如何不使用集合列表为Xamarin.Forms Picker填充数据？

一、修改ViewModel，添加选中项属性 #

在NewReleasesViewModel中补充选中游戏的属性，并简化属性变更通知的代码：

using System.Collections.ObjectModel;
using System.ComponentModel;

namespace FYP.ViewModels
{
    public class NewReleasesViewModel : INotifyPropertyChanged
    {
        public event PropertyChangedEventHandler PropertyChanged;

        private ObservableCollection<NewGames> _newGames;
        public ObservableCollection<NewGames> Games
        {
            get { return _newGames; }
            set 
            { 
                _newGames = value;
                OnPropertyChanged(nameof(Games));
            }
        }

        private NewGames _selectedGame;
        public NewGames SelectedGame
        {
            get { return _selectedGame; }
            set 
            { 
                _selectedGame = value;
                OnPropertyChanged(nameof(SelectedGame));
            }
        }

        public NewReleasesViewModel() 
        {
            Games = new ObservableCollection<NewGames>();
            AddData();
        }

        private void AddData()
        {
            Games.Add(new NewGames
            {
                Id = 0,
                GameTitle = "上古卷轴OL",
                Rating = 4.9,
                ImageSource= "https://assets-prd.ignimgs.com/2022/01/05/elderscrollsonline-1641413357689.jpg"
            });
            Games.Add(new NewGames
            {
                Id = 1,
                GameTitle = "魔兽世界",
                Rating = 4.9,
                ImageSource = "https://assets-prd.ignimgs.com/2021/12/10/wow-1639126324635.jpg"
            });
            Games.Add(new NewGames
            {
                Id = 2,
                GameTitle = "星球大战：旧共和国",
                Rating = 4.9,
                ImageSource = "https://assets-prd.ignimgs.com/2022/01/27/swotor-sq1-1643302998212.jpg"
            });
        }

        private void OnPropertyChanged(string propertyName)
        {
            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
        }
    }
}

注：游戏标题已翻译成中文，可根据需求换回原英文；封装OnPropertyChanged方法是为了简化重复的属性变更通知代码。

二、修改XAML页面，完成绑定与内容展示 #

设置页面绑定上下文，绑定Picker的数据源和选中项，同时添加控件展示选中游戏的详情：

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:vm="clr-namespace:FYP.ViewModels"
             xmlns:converters="clr-namespace:FYP.Converters"
             x:Class="FYP.NewReleasesPage">
    <ContentPage.Resources>
        <ResourceDictionary>
            <converters:IsNotNullConverter x:Key="IsNotNullConverter" />
        </ResourceDictionary>
    </ContentPage.Resources>
    <ContentPage.BindingContext>
        <vm:NewReleasesViewModel />
    </ContentPage.BindingContext>
    <ContentPage.Content>
        <StackLayout Margin="15">
            <Label Text="选择游戏" TextColor="Black" FontSize="24" FontAttributes="Bold" Margin="0,0,0,10" />
            <!-- 绑定Picker数据源与选中项 -->
            <Picker 
                ItemsSource="{Binding Games}"
                DisplayMemberPath="GameTitle"
                SelectedItem="{Binding SelectedGame}"
                Title="请选择一款游戏" />

            <!-- 选中游戏后展示的详情区域 -->
            <Frame Margin="0,20,0,0" Padding="10" CornerRadius="8">
                <StackLayout IsVisible="{Binding SelectedGame, Converter={StaticResource IsNotNullConverter}}">
                    <Image Source="{Binding SelectedGame.ImageSource}" HeightRequest="200" Aspect="AspectFill" />
                    <Label Text="{Binding SelectedGame.GameTitle}" FontSize="20" FontAttributes="Bold" Margin="0,10,0,5" />
                    <Label Text="{Binding SelectedGame.Rating, StringFormat='评分：{0}'}" FontSize="16" TextColor="Gray" />
                </StackLayout>
            </Frame>
        </StackLayout>
    </ContentPage.Content>
</ContentPage>

三、添加值转换器（控制详情区域显示） #

如果需要在未选择游戏时隐藏详情区域，需添加一个判断对象是否为空的转换器：

using System.Globalization;
using Microsoft.Maui.Controls;

namespace FYP.Converters
{
    public class IsNotNullConverter : IValueConverter
    {
        public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
        {
            return value != null;
        }

        public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
        {
            throw new NotImplementedException();
        }
    }
}

核心逻辑说明 #

1. Picker通过ItemsSource="{Binding Games}"绑定ViewModel中的游戏列表，DisplayMemberPath="GameTitle"指定显示游戏标题
2. SelectedItem="{Binding SelectedGame}"将Picker选中的游戏对象同步到ViewModel的SelectedGame属性
3. 详情区域通过绑定SelectedGame的属性，实现选中游戏后自动加载对应图片、标题和评分；值转换器确保未选游戏时隐藏该区域

内容的提问来源于stack exchange，提问作者sunboy