Question

我有一个带有列表视图的页面，其中包含一个内容视图作为视单元。 contentview有一个图像（实际上是一个cachedimage对象）。列表视图具有不均匀的行以适应各种图像高度。

不幸的是，在加载这些行中的图像之后，诸如标签等的对象从每个行重叠。我已经读过我应该使用'ForceUpdateSize'，但我不确定代码中的哪个位置（或者即使它可以工作）。

（另一方面，当我的contentview（viewcell）有一个带有星号高度的网格时，没有过度使用，但这会导致行之间出现大量不必要的间隙。）

P.S。这是一个内容视图，因为我正在使用XAML和Xamarin页面中的代码重新使用没有列表视图。

<?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中的Grid中使用* height，而是使用Auto或像素高度。

当HasUnevenRows = true时，如何强制Xamarin Forms ListView重绘/调整重叠标签的大小

1 个答案: