【问题标题】:INotifyPropertyChanged ListViewINotifyPropertyChanged ListView
【发布时间】:2019-04-22 01:40:01
【问题描述】:

我是 Xamarin Forms 的新手,并试图在我的应用程序中实现无限循环功能。我遵循的示例代码运行良好,并且我已成功将其集成到我的应用程序中。

问题是我无法从代码中找出如何更改列表视图的来源。

我打算在我的列表视图上方有按钮(如下图所示),单击后列表视图的源应该会改变。

这就是我的代码的样子

 <ContentPage.BindingContext>
    <local:MainViewModel />
</ContentPage.BindingContext>

<StackLayout>

    <ListView  x:Name="tyres_listview" ItemsSource="{Binding Items}"
                       HasUnevenRows="True" SeparatorVisibility="None"  >

        <ListView.Behaviors>
            <extended:InfiniteScrollBehavior IsLoadingMore="{Binding IsBusy}" />
        </ListView.Behaviors>
        <ListView.ItemTemplate>

            <DataTemplate>
                <ViewCell>

                    <StackLayout>
                        <Grid Margin="10" VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="0.25*"></ColumnDefinition>

                                <ColumnDefinition Width="0.75*"></ColumnDefinition>
                            </Grid.ColumnDefinitions>

                            <StackLayout  Grid.Column="0" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" Margin="5,5,5,10">
                                <Image  Source="{Binding image_url}"  >
                                </Image>
                            </StackLayout>
                            <StackLayout Grid.Column="1" Spacing="0" >
                                <Label Text="{Binding name}" FontAttributes="Bold" FontSize="Small" Margin="0,5,5,0" VerticalOptions="Center" ></Label>
                                <Label  Text="{Binding brand}" VerticalOptions="Center" FontSize="Micro"  ></Label>
                                <Label  Text="{Binding item_id}" VerticalOptions="Center" FontSize="Micro"  ></Label>

                                <StackLayout Orientation="Horizontal" x:Name="sl_db" >
                                    <Image Source="fuel.png" ></Image>
                                    <Label Text="{Binding fuel_type}"></Label>
                                    <Image Source="weather.png"></Image>
                                    <Label Text="{Binding wheather_type }"></Label>
                                    <Image Source="volume.png"  ></Image>
                                    <Label Text="{Binding noise}"></Label>
                                    <Label Text="dB"></Label>
                                </StackLayout>


                                <StackLayout Orientation="Horizontal">
                                    <Image></Image>
                                    <Label Text="{Binding rated_count }"></Label>
                                </StackLayout>

                                <StackLayout Orientation="Horizontal">
                                    <Label Text="Price: " VerticalOptions="Center"></Label>
                                    <Label Text="{Binding price }" VerticalOptions="Center" TextColor="Green"></Label>
                                    <Label Text=" EUR" VerticalOptions="Center"></Label>

                                </StackLayout>
                                <StackLayout Orientation="Horizontal">
                                    <StackLayout.GestureRecognizers>
                                        <TapGestureRecognizer Tapped="TapGestureRecognizer_Tapped_1" >

                                        </TapGestureRecognizer>
                                    </StackLayout.GestureRecognizers>
                                    <StackLayout BackgroundColor="Red" Orientation="Horizontal" Margin="5" >
                                        <Image Source="shoppingcart.png" Margin="10,0,0,0"></Image>
                                        <Label Text="Add to Cart" VerticalOptions="Center" HorizontalOptions="EndAndExpand" Margin="0,0,10,0" ></Label>
                                    </StackLayout>
                                    <Image x:Name="button_info"  Source="info.png" >

                                        <Image.GestureRecognizers>
                                            <TapGestureRecognizer Tapped="button_info_Clicked"></TapGestureRecognizer>
                                        </Image.GestureRecognizers>

                                    </Image>
                                </StackLayout>

                            </StackLayout>

                        </Grid>
                    </StackLayout>

                </ViewCell>

            </DataTemplate>

        </ListView.ItemTemplate>

        <ListView.Footer>
            <Grid Padding="6" IsVisible="{Binding IsBusy}">
                <!-- set the footer to have a zero height when invisible -->
                <Grid.Triggers>
                    <Trigger TargetType="Grid" Property="IsVisible" Value="False">
                        <Setter Property="HeightRequest" Value="0" />
                    </Trigger>
                </Grid.Triggers>
                <!-- the loading content -->
                <Label Text="Loading..." TextColor="DeepPink" FontSize="20" FontAttributes="Bold" VerticalOptions="Center" HorizontalOptions="Center" />
            </Grid>
        </ListView.Footer>
    </ListView>
    <Button Clicked="button_Change_Order_Clicked"></Button>
</StackLayout>

 public class MainViewModel : INotifyPropertyChanged
{
    private bool _isBusy;
    private const int PageSize = 10;
    readonly DataService _dataService = new DataService();

    public InfiniteScrollCollection<Product_Search> Items { get; }

    public bool IsBusy
    {
        get => _isBusy;
        set
        {
            _isBusy = value;
            OnPropertyChanged();
        }
    }
    public MainViewModel()
    {
        Items = new InfiniteScrollCollection<Product_Search>
        {
            OnLoadMore = async () =>
            {
                IsBusy = true;

                // load the next page
                var page = Items.Count / PageSize;
                var items = await _dataService.GetItemsAsync(page, PageSize);

                IsBusy = false;

                // return the items that need to be added
                return items;
            },
            OnCanLoadMore = () =>
            {
                return Items.Count < 44;
            }
        };

        DownloadDataAsync();
    }

    private async Task DownloadDataAsync()
    {
        var items = await _dataService.GetItemsAsync(pageIndex: 0, pageSize: PageSize);
        Items.AddRange(items);
    }

    public event PropertyChangedEventHandler PropertyChanged;

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

}

任何帮助都非常重要。

【问题讨论】:

  • 只需将另一个 IEnumerable 分配给 tyres_listview.ItemSource
  • 如果我设置了(tyres_listview.itemsource=somelist),那么它不具备无限滚动的功能
  • 使用 InfiniteScrollCollection 的另一个实例。您的问题并没有明确说明您要解决什么问题。
  • 我尝试详细说明。正如你在附图中看到的,我有三个按钮。当我单击按钮时,我希望更改列表视图的来源。在 buttonClck 方法上,如果我设置 tyres_listview.itemsource=somelist ,它会更改列表视图,但它没有无限循环的功能。我正在寻找一种解决方案,我可以在其中更改 MainViewModel 中的 Listview 源
  • 当您重新分配它时,您使用的是 InfiniteScrollCollection 还是其他类型?

标签: c# listview xamarin.forms cross-platform


【解决方案1】:

您的ListView.Items 属性已经绑定到您的MainViewModel.Items 属性,需要触发PropertyChanged event 来表示属性值的更改(对应于属性本身或其内容,如果InfiniteScrollCollection&lt;&gt;是一个 Observable 集合)。

当您想要替换 Items 源时,您可以给它一个新值,表明它已更改并且您的 ListView 可能会被刷新:

private InfiniteScrollCollection<Product_Search> _items;
public InfiniteScrollCollection<Product_Search> Items 
{ 
    get { return _items; }
    set
    {
        _items = value;
        OnPropertyChanged();
    }
}

【讨论】:

    猜你喜欢
    • 2017-01-24
    • 1970-01-01
    • 1970-01-01
    • 2017-02-09
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2020-08-22
    • 2021-09-07
    相关资源
    最近更新 更多