XamarinのListViewを使用して静的なソーシャルメディアのタイムライン投稿を表示

Question

ソーシャルメディアのタイムライン投稿のようなものを表示したいas shown in this imageここには何か間違いがあるため、現在ListViewコードがあります。

<StackLayout> 

<ListView x:Name="LvTimeLine"> 
<ListView.ItemTemplate> 

    <DataTemplate> 
    <ViewCell> 

     <Grid> 

     <Grid.RowDefinitions> 
       <RowDefinition Height="0.15" /> 
       <RowDefinition Height="0.35" /> 
       <RowDefinition Height="0.20" /> 
       <RowDefinition Height="0.10" /> 
     </Grid.RowDefinitions> 

     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="0.15" /> 
      <ColumnDefinition Width="0.25" /> 
      <ColumnDefinition Width="0.20" /> 
      <ColumnDefinition Width="0.50" /> 
     </Grid.ColumnDefinitions> 

     <BoxView Grid.Row="0" Grid.Column="0"> 

     <Image x:Name="Imagedp" Source="{Binding ProfilePic}" HeightRequest="70" WidthRequest="70" /> 

     </BoxView> 

     <BoxView Grid.Row="0" Grid.Column="1" Grid.ColumnSpan="3"> 

     <Label Text="{Binding ProfileName}" /> 

     </BoxView> 

     <BoxView Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="4"> 

       <!--post image--> 
      <Image x:Name="ImagePostImage" Source="{Binding PostImage}" HeightRequest="250" /> 

     </BoxView> 

     <BoxView Grid.Row="2" Grid.Column="0" Grid.ColumnSpan="4"> 

       <!--Details--> 
      <Label Text="{Binding PostDesc}" /> 


     </BoxView> 


     <BoxView Grid.Row="3" Grid.Column="0" Grid.ColumnSpan="3"> 

       <!--Category--> 
      <Label Text="{Binding PostCat}" /> 


     </BoxView> 

     <BoxView Grid.Row="3" Grid.Column="3"> 

       <!--Like button--> 
      <Label Text="Like - Comment - Share" /> 


     </BoxView> 




     </Grid> 


    </ViewCell> 
    </DataTemplate> 

</ListView.ItemTemplate> 
</ListView> 


</StackLayout> 

私のリストPostview.csは私のリストビューでバインドしています。

public class PostList 
{ 
    public int Id { get; set; } 

    public string ProfilePic { get; set; } 
    public string ProfileName { get; set; } 
    public string PostImage { get; set; } 

    public string PostDesc { get; set; } 
    public string PostCat { get; set; } 

} 

はまた、私はあなたの代わりにList<PostList>

秒のObservableCollection<PostList>を使用する必要があり、私のリストビュー

public TabActiveForms() 
    { 
     InitializeComponent(); 
     LvTimeLine.ItemsSource = new List<PostList> 
     { 
      new PostList() { Id=1, ProfileName = "Uzair", ProfilePic = "D1.jpg", PostCat = "Sports", PostDesc = "Lahore Stadium", PostImage = "P1.jpg"}, 
      new PostList() { Id=2, ProfileName = "Tasmeer", ProfilePic = "D2.jpg", PostCat = "Sports", PostDesc = "Karachi Stadium", PostImage = "P2.jpg"}, 
      new PostList() { Id=3, ProfileName = "Aamna", ProfilePic = "D3.jpg", PostCat = "Home", PostDesc = "Talagang Stadium", PostImage = "P3.JPG"}, 
     }; 

    } 

Answer 1

まずに表示する3つのレコードを宣言している、あなたのモデルはINotifyPropertyChangedのを実装する必要があります。

私は静的についてINPC

Answer 2

ためPropertyChanged.Fodyを使用することをお勧め（質問のタイトルで述べたように）リストビューのコレクション、ObservableCollectionを使用するための厳格な要件はありません。コンテンツが静的である限り、通常のListまたはarrayを使用するのはまったく問題ありません。 ObservableCollectionは、コレクションが変更されるたびにListViewが通知を受け取るようにします。 INotifyPropertyChangedインターフェイスは、ViewCellがオブジェクト自体の変更に応答できることを確認します。 ListView ItemsSourceのXamarinのドキュメントを参照してください。

List〜ObservableCollectionを変更することは、提供したコードに他の根本的な問題があるため、多くの場合役に立ちません。

1. 行と列の定義は、ほとんどあなたが望んでいない可能性が高いため、定義によってグリッドが非常に小さくなります。 Xamarinは*,Autoまたは絶対値で動作します。詳細は、the documentationを参照してください。
2. BoxViewsは何も追加しません。何も表示されていない可能性があります。 BoxViewはContentViewではなく、普通のViewであるため、子要素はサポートされていません。
3. ListViewのHasUnevenRowsプロパティをtrueに設定するか、必要なサイズに合わせた固定セルの高さを設定する必要があります。
4. まだ説明できない奇妙な理由から、ToString()メソッドをオーバーライドしてBindingsを機能させる必要がありました。

ObservableCollectionは、おそらくあなたの問題を解決しませんが、どのように動作するかを知っている、とINotifyPropertyChangedインタフェースを利用することの価値があります。私はまた、Alessandroが述べたように、FodyのPropertyChangedパッケージベースをお勧めします。