XamarinフォームListViewにHasUnevenRows = trueのときに重複するラベルを再描画/サイズ変更する方法

Question

コンテンツビューをビューセルとして持つリストビューを持つページがあります。 contentviewには画像があります（実際にはキャッシュされたオブジェクトです）。リストビューは、さまざまな画像の高さに対応するために不均一な行を持ちます。

残念ながら、ラベルなどのオブジェクトは、それらの行内のイメージがロードされた後、各行から重複します。私は 'ForceUpdateSize'を使用するべきだと読んだけど、これを置くコードのどこに（またはうまくいけば）わからない。

（私のcontentview（viewcell）には高さが星印のグリッドがありますが、これは行間に不必要なギャップが発生します）、ovelapはありません。

p.s.私はこのXAMLとコードをリストビューなしのXamarinページで再利用しているので、contentviewです。

<?xml version="1.0" encoding="UTF-8"?> 
<ContentPage xmlns:local="clr-namespace:myapp" xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" x:Class="myapp.HomePage"> 
<ContentPage.Content> 
    <ListView x:Name="ListView" HasUnevenRows="true"> 
     <ListView.ItemTemplate> 
      <DataTemplate> 
       <ViewCell> 
        <local:MyContentView x:Name="MyContentView"> 
        </local:MyContentView> 
       </ViewCell> 
      </DataTemplate> 
     </ListView.ItemTemplate> 
    </ListView> 
</ContentPage.Content> 

<?xml version="1.0" encoding="UTF-8"?> 
<ContentView xmlns:ffimageloading="clr-namespace:FFImageLoading.Forms;assembly=FFImageLoading.Forms" xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" x:Class="myapp.MyContentView"> 
<ContentView.Content> 
    <StackLayout x:Name="MainLayout"> 
     <StackLayout Orientation="Horizontal" Margin="10,1"> 
      <Button Text="username" x:Name="UsernameBtn" Clicked="Username_Clicked" /> 
      <Button Text="follow" x:Name="FollowBtn" HorizontalOptions="EndAndExpand" Clicked="Follow_Clicked" /> 
      <Button Text="..." x:Name="MoreBtn" Clicked="More_Clicked" /> 
     </StackLayout> 
     <ffimageloading:CachedImage x:Name="Image" HorizontalOptions="Center" VerticalOptions="Center" DownsampleToViewSize="true" Source="http://loremflickr.com/600/600/nature?filename=simple.jpg"> 
     </ffimageloading:CachedImage> 
     <StackLayout Orientation="Horizontal" Margin="10,0"> 
      <Button Text="Like" x:Name="LikeBtn" Clicked="Like_Clicked" Image="http://www.endlessicons.com/wp-content/uploads/2014/03/bookmark-icon-2-614x460.png" /> 
      <Button Text="Comment" x:Name="CommentBtn" Clicked="Comment_Clicked" /> 
      <Button Text="Share" x:Name="ShareBtn" Clicked="Share_Clicked" /> 
      <Button Text="Bkmrk" x:Name="BookMarkPostBtn" Clicked="BookmarkPost_Clicked" HorizontalOptions="EndAndExpand" Image="http://www.endlessicons.com/wp-content/uploads/2014/03/bookmark-icon-2-614x460.png" /> 
     </StackLayout> 
     <StackLayout Orientation="Horizontal" Margin="10,0"> 
      <Label x:Name="LikeCount" Text="1,234" /> 
      <Label Text="Likes" /> 
     </StackLayout> 
     <Label x:Name="CommentLabel" Text="Comments" /> 
     <Label x:Name="TagLabel" Text="Tags" /> 
    </StackLayout> 

    <!-- 
    <Grid ColumnSpacing="5" RowSpacing="5" Margin="5"> 
     <Grid.RowDefinitions> 
      <RowDefinition Height="*" /> 
      <RowDefinition Height="Auto" /> 
      <RowDefinition Height="*" /> 
      <RowDefinition Height="*" /> 
      <RowDefinition Height="*" /> 
      <RowDefinition Height="*" /> 
     </Grid.RowDefinitions> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="*" /> 
     </Grid.ColumnDefinitions> 

     <StackLayout Orientation="Horizontal" Margin="10,1" Grid.Row="0" Grid.Column="0" > 
      <Button Text="username" x:Name="UsernameBtn" Clicked="Username_Clicked" /> 
      <Button Text="follow" x:Name="FollowBtn" HorizontalOptions="EndAndExpand" Clicked="Follow_Clicked" /> 
      <Button Text="..." x:Name="MoreBtn" Clicked="More_Clicked" /> 

     </StackLayout> 

     <ffimageloading:CachedImage Grid.Row="1" Grid.Column="0" x:Name="Image" HorizontalOptions="Center" VerticalOptions="Center" DownsampleToViewSize="true" Source="http://loremflickr.com/600/600/nature?filename=simple.jpg"> 
      </ffimageloading:CachedImage> 


     <StackLayout Grid.Row="2" Grid.Column="0" Orientation="Horizontal" Margin="10,0"> 
      <Button Text="Like" x:Name="LikeBtn" Clicked="Like_Clicked" Image="http://www.endlessicons.com/wp-content/uploads/2014/03/bookmark-icon-2-614x460.png" /> 
      <Button Text="Comment" x:Name="CommentBtn" Clicked="Comment_Clicked" /> 
      <Button Text="Share" x:Name="ShareBtn" Clicked="Share_Clicked" /> 
      <Button Text="Bkmrk" x:Name="BookMarkPostBtn" Clicked="BookmarkPost_Clicked" HorizontalOptions="EndAndExpand" Image="http://www.endlessicons.com/wp-content/uploads/2014/03/bookmark-icon-2-614x460.png" /> 
     </StackLayout> 

     <StackLayout Grid.Row="3" Grid.Column="0" Orientation="Horizontal" Margin="10,0"> 
      <Label x:Name="LikeCount" Text="1,234" /> 
      <Label Text="Likes" /> 
     </StackLayout> 

     <Label Grid.Row="4" Grid.Column="0" x:Name="CommentLabel" Text="Comments" /> 
     <Label Grid.Row="5" Grid.Column="0" x:Name="TagLabel" Text="Tags" /> 


    </Grid> 
    --> 

</ContentView.Content> 

Answer 1

ViewCellとあなたのItemTemplateに内代わりViewCellの使用を継承するクラスを作成します。このクラスの中で、ForceUpdateSize（）を呼び出します。

グリッドが機能しているように見えますが余分なスペースがあっても実際の問題ではないかもしれません。おそらくListView内のグリッド内の高さを避け、代わりにオートまたはピクセルの高さを使用するべきです。