ContentView构式

Question

我正在创建一个ContentView、UserPostView的子类，作为ListView中的数据模板。通过创建新的ItemSource实例，动态地向ListView的UserPostView添加项。

<Image x:Name="PictureView" Source="Logo" BackgroundColor="#ddd" />
<Label x:Name="NameView" Text="Name" TextColor="#444" FontAttributes="Bold" Grid.Row="0" Grid.Column="1" Margin="10" />
<Label x:Name="LocationNameView" Text="Location" TextColor="#666" Grid.Row="0" Grid.Column="2" YAlign="Center" />
<Label x:Name="DeptNameView" Text="Dept" TextColor="#666" Grid.Row="0" Grid.Column="3" YAlign="Center" />

在代码中：

using System;
using System.Collections.Generic;
using Xamarin.Forms;

namespace CMCityClient.Views
{
    public partial class UserPostView : ContentView
    {

        public ImageSource Picture
        {
            get { return PictureView.Source; }
            set { PictureView.Source = value; }
        }

        public string PostOwner {
            get { return NameView.Text; }
            set { NameView.Text = value; }
        }

        public string PostOwnerLocation {
            get { return LocationNameView.Text; }
            set { LocationNameView.Text = value; }
        }

        // ...

        // ...

        public UserPostView(ImageSource picture, string owner, string loc, string dept, string text) {
            InitializeComponent();

            Picture = picture;
            PostOwner = owner;
            PostOwnerLocation = loc;
            PostOwnerDept = dept;
            PostText = text;
        }

        public UserPostView(ImageSource picture, string owner, string loc, string dept, string text, ImageSource image) {
            InitializeComponent();

            Picture = picture;
            PostOwner = owner;
            PostOwnerLocation = loc;
            PostOwnerDept = dept;
            PostText = text;
            PostImage = image;
        }
    }
}

但是当我在我的ListView中使用它时，它不会显示传递的数据，而是显示原始数据。(Text=“Name”)

public TimelinePage()
{
    InitializeComponent();

    ImageSource pic = ImageSource.FromUri(new Uri("https://tse1.mm.bing.net/th?id=OIP.acchQ02P8HmrmwbjCTwG5AHaHa&pid=Api"));
    timeline.ItemsSource = new UserPostView[]{
        new UserPostView(ImageSource.FromResource("Logo"), "Kevin Wang", "SHDR", "AOP", "hey"),
        new UserPostView(pic, "Lily", "SHDR", "ENT", "good"),
        new UserPostView(pic, "Zhang Shuo", "FRDL", "ENT", "Salut! "),
    };
}

帮助!如何让它们显示通过构造函数传递的数据？

Answer 1

如果您能够提供ListView的xaml和DataTemplate，我们可以为您提供更好的答案。

但是，我猜您的ListView的ItemsSource应该设置为一个包含属性的ViewModel : INotifyPropertyChanged列表，而不是在ContentView上，您的ContentView应该绑定到该ViewModel。例如：

public partial class UserPostView : ContentView
{
    public UserPostView()
    {
        InitializeComponent();
    }
}

//NOTE: in UserPostView.xaml 
<Image Source="{Binding Picture}" BackgroundColor="#ddd" />
<Label Text="{Binding PostOwner}" TextColor="#444" FontAttributes="Bold" Margin="10" />
<Label Text="{Binding PostOwnerLocation}" TextColor="#666" YAlign="Center" />
...

示例ViewModel：

public class UserPostViewModel : INotifyPropertyChanged
{
    ImageSource _picture;

    public ImageSource Picture
    {
       get { return _picture; }
       set 
       {
           _picture = value;
           OnPropertyChanged(nameof(Picture));
        }
    }

    string _postOwner;

    public string PostOwner
    {
        get { return _postOwner; }
        set 
        {
            _postOwner = value;
            OnPropertyChanged(nameof(PostOwner));
        }
    }

    string _postOwnerLocation;

    public string PostOwnerLocation
    {
        get { return _postOwnerLocation; }
        set 
        {
            _postOwnerLocation = value;
            OnPropertyChanged(nameof(PostOwnerLocation));
        }
    }

    ....

    public event PropertyChangedEventHandler PropertyChanged;

    protected void OnPropertyChanged([CallerMemberName] string propertyName = null)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }
}

在你的页面中：

public TimelinePage()
{
    InitializeComponent();
    ImageSource pic = ImageSource.FromUri(new Uri("https://tse1.mm.bing.net/th?id=OIP.acchQ02P8HmrmwbjCTwG5AHaHa&pid=Api"));
    _listView.ItemsSource = new ObservableCollection<UserPostViewModel>
    {
        new UserPostViewModel { Picture = ImageSource.FromResource("Logo"), PostOwner="Kevin Wang", PostOwnerLocation="SHDR"},
        new UserPostViewModel { Picture = pic, PostOwner="Lily", PostOwnerLocation="SHDR"},
        new UserPostViewModel { Picture = pic, PostOwner="Zhang Shuo", PostOwnerLocation="FRDL"},
    };
}

//NOTE: In your Pages ListView DataTemplate
<ListView.ItemTemplate>
    <DataTemplate>
        <ViewCell>
            <local:UserPostView/>
        </ViewCell>
    </DataTemplate>
</ListView.ItemTemplate>