Xamarin:在加载数据之前保留列表中的项目

问题描述

在移动应用程序中,当有产品列表要显示时,经常等待数据加载,位置显示为灰色,避免加载文本和图像时出现手风琴效果。我想知道使用此 Xamarin 表单执行此操作的最佳方法是什么?如果你有一个例子。谢谢。

解决方法

如果您使用 ListView,那么您可以实现一个空的列表视图模板,并在项目加载时在那里呈现您想要的内容。这是此功能的一个很好的示例:

https://github.com/xamcat/mobcat-library/blob/master/MobCAT.Forms/Controls/InfiniteListView.cs#L59-L63

今后,我建议切换到 CollectionView,因为它是在 Xamarin.Forms 应用中处理列表的推荐控件,并遵循 guide posted by Jason in his comment

,

我已经使用了 collectionView,谢谢你的回答,这里更多的是使用 IsBusy 来确定是否正在调用 webservice

<CollectionView.EmptyView>
<ContentView x:DataType="viewModels:ProductListViewModel">
    <StackLayout>
        <Grid
            ColumnDefinitions="*,*"
            IsVisible="{Binding IsBusy}"
            RowDefinitions="Auto,Auto,Auto">
            <controls:EmptyProductView
                x:Name="EmptyProduct"
                Grid.Row="0"
                Grid.Column="0" />
            <controls:EmptyProductView Grid.Row="0" Grid.Column="1" />
            <controls:EmptyProductView Grid.Row="1" Grid.Column="0" />
            <controls:EmptyProductView Grid.Row="1" Grid.Column="1" />
            <controls:EmptyProductView Grid.Row="2" Grid.Column="0" />
            <controls:EmptyProductView Grid.Row="2" Grid.Column="1" />
            <controls:EmptyProductView Grid.Row="3" Grid.Column="0" />
            <controls:EmptyProductView Grid.Row="3" Grid.Column="1" />
            <controls:EmptyProductView Grid.Row="4" Grid.Column="0" />
            <controls:EmptyProductView Grid.Row="4" Grid.Column="1" />
        </Grid>
        <Label IsVisible="{Binding IsNotBusy}" Text="No data" />
    </StackLayout>
</ContentView>
</CollectionView.EmptyView>