You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Xamarin Forms选择器:基于列表数据生成年份选项并排序列表

Xamarin Forms 实现动态年份选择器及列表排序功能

1. 动态生成年份选择器选项

首先假设你的数据模型包含年份属性,示例模型如下:

public class DataModel
{
    public int Year { get; set; }
    // 其他业务属性
}

在ViewModel中实现动态生成年份选项的逻辑,会根据数据源提取唯一年份,同时支持按你指定的范围规则补充年份(处理你描述中2018-2023范围的场景):

public class MainViewModel : INotifyPropertyChanged
{
    private ObservableCollection<DataModel> _dataList;
    public ObservableCollection<DataModel> DataList
    {
        get => _dataList;
        set
        {
            _dataList = value;
            OnPropertyChanged();
            GenerateYearOptions();
        }
    }

    private List<int> _yearOptions;
    public List<int> YearOptions
    {
        get => _yearOptions;
        set
        {
            _yearOptions = value;
            OnPropertyChanged();
        }
    }

    private int _selectedYear;
    public int SelectedYear
    {
        get => _selectedYear;
        set
        {
            _selectedYear = value;
            OnPropertyChanged();
            SortDataByYear();
        }
    }

    // 生成年份选项
    private void GenerateYearOptions()
    {
        if (DataList == null || !DataList.Any())
        {
            YearOptions = new List<int>();
            return;
        }

        // 提取数据中的唯一年份并排序
        var uniqueYears = DataList.Select(d => d.Year).Distinct().OrderBy(y => y).ToList();

        // 按规则:如果数据年份范围覆盖2018-2023,添加指定年份(可根据实际需求调整列表内容)
        var minYear = DataList.Min(d => d.Year);
        var maxYear = DataList.Max(d => d.Year);
        if (minYear <= 2018 && maxYear >= 2023)
        {
            var customYears = new List<int> { 2018, 2019, 2020, 2021, 2022, 2023 };
            uniqueYears = customYears.Union(uniqueYears).OrderBy(y => y).ToList();
        }

        YearOptions = uniqueYears;
    }

    // INotifyPropertyChanged 实现
    public event PropertyChangedEventHandler PropertyChanged;
    protected virtual void OnPropertyChanged([CallerMemberName] string propertyName = null)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }
}

2. 选中年份后对列表排序

在ViewModel的SelectedYear属性变更时触发排序逻辑,示例中将选中年份的项优先显示,剩余项按年份升序排序:

// 按选中年份排序列表
private void SortDataByYear()
{
    if (DataList == null || !DataList.Any()) return;

    // 自定义排序规则:选中年份的项排在最前面,其余按年份升序
    var sortedItems = DataList.OrderBy(d => d.Year == SelectedYear ? 0 : 1)
                              .ThenBy(d => d.Year)
                              .ToList();

    // 更新ObservableCollection
    DataList.Clear();
    foreach (var item in sortedItems)
    {
        DataList.Add(item);
    }
}

3. XAML布局实现

将选择器和列表与ViewModel绑定:

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="YourAppNamespace.MainPage"
             xmlns:vm="clr-namespace:YourAppNamespace.ViewModels">
    <ContentPage.BindingContext>
        <vm:MainViewModel />
    </ContentPage.BindingContext>
    <StackLayout Padding="20">
        <!-- 年份选择器 -->
        <Picker Title="选择年份"
                ItemsSource="{Binding YearOptions}"
                SelectedItem="{Binding SelectedYear}"
                ItemDisplayBinding="{Binding .}" />
        
        <!-- 数据展示列表 -->
        <ListView ItemsSource="{Binding DataList}"
                  Margin="0,20,0,0">
            <ListView.ItemTemplate>
                <DataTemplate>
                    <TextCell Text="{Binding Year}" />
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
    </StackLayout>
</ContentPage>

注意事项

  • 若年份为字符串类型,需先转换为int再处理排序和范围判断
  • 可根据需求修改GenerateYearOptions中的自定义年份列表,或调整SortDataByYear内的排序规则(比如改为纯年份升序/降序)
  • 必须确保ViewModel正确实现INotifyPropertyChanged,否则UI不会随数据变化自动更新

内容的提问来源于stack exchange,提问作者I'm Khan

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.07.19 13:30:30