uwp 的】listView 选择

xml 代码

----------------------------------------------------------

<Page
    x:Class="ContentControlWithTemplateSelector.TestPage1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:ContentControlWithTemplateSelector"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">
 
    <Page.Resources>
        <DataTemplate x:Key="AvatarWithVisibility">
            <Grid >
                <Grid Visibility="{Binding Converter={StaticResource RoomTypeConverter},ConverterParameter=Name}">
                    <Ellipse Fill="Green"></Ellipse>
                    <TextBlock Text="{Binding Index}" TextAlignment="Center" VerticalAlignment="Center"></TextBlock>
                </Grid>
                <Grid Visibility="{Binding Converter={StaticResource RoomTypeConverter},ConverterParameter=Image}">
                    <Ellipse >
                        <Ellipse.Fill>
                            <ImageBrush ImageSource="{Binding ImageUri}"></ImageBrush>
                        </Ellipse.Fill>
                    </Ellipse>
                </Grid>
                <Grid CacheMode="BitmapCache" Visibility="{Binding Converter={StaticResource RoomTypeConverter},ConverterParameter=Default}">
                    <Grid.RowDefinitions>
                        <RowDefinition></RowDefinition>
                        <RowDefinition Height="2*"></RowDefinition>
                        <RowDefinition></RowDefinition>
                    </Grid.RowDefinitions>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition></ColumnDefinition>
                        <ColumnDefinition Width="2*"></ColumnDefinition>
                        <ColumnDefinition></ColumnDefinition>
                    </Grid.ColumnDefinitions>
 
                    <Ellipse Grid.Row="0" Grid.Column="0" Grid.RowSpan="2" Grid.ColumnSpan="2" Fill="Green">
                    </Ellipse>
                    <Ellipse Grid.Row="1" Grid.Column="1" Grid.RowSpan="2" Grid.ColumnSpan="2" Fill="Orange">
                    </Ellipse>
                </Grid>
            </Grid>
        </DataTemplate>
    </Page.Resources>
    
    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
        <Grid.ColumnDefinitions>
            <ColumnDefinition></ColumnDefinition>
            <ColumnDefinition></ColumnDefinition>
        </Grid.ColumnDefinitions>
        <ListView x:Name="listViewAvatar" Grid.Column="0" ItemsSource="{Binding Rooms}">
            <ListView.ItemTemplate>
                <DataTemplate>
                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition ></ColumnDefinition>
                            <ColumnDefinition></ColumnDefinition>
 
                        </Grid.ColumnDefinitions>
 
                        <ContentControl Grid.Column="0" HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch" Width="50" Height="50"
                                        ContentTemplate="{StaticResource AvatarWithVisibility}"></ContentControl>
                        
                        <StackPanel Grid.Column="1" >
                            <TextBlock  Text="{Binding Name}"></TextBlock>
                            <TextBlock  Text="{Binding ImageUri}"></TextBlock>
                        </StackPanel>
                    </Grid>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
 
        <ContentControl Grid.Column="1" HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch"
                        Content="{Binding SelectedItem,ElementName=listViewAvatar}" Width="150" Height="150"
                        ContentTemplate="{StaticResource AvatarWithVisibility}"></ContentControl>
    </Grid>
</Page>
 
 public sealed partial class TestPage1 : Page
    {
        　　public TestPage1()
        　　{
            　　　　this.InitializeComponent();
            　　　　this.DataContext = new DataViewModel();
        　　}
    } 
 
DataViewModel 代码
  public class DataViewModel
    {
        public ObservableCollection<Room> Rooms { get; set; }
 
        public DataViewModel()
        {
            Rooms = CreateRooms();
        }
 
        private ObservableCollection<Room> CreateRooms()
        {
            ObservableCollection<Room> rooms = new ObservableCollection<Room>();
            for (int i = 0; i < 10000; i++)
            {
                var room = new Room { Index = i };
 
                if (i % 3 == 0)
                {
                    room.Name = "Room " + i;
                    if (i % 2 == 0)
                    {
                        room.ImageUri = new Uri( "ms-appx:///Assets/testImage.jpg");
                    }
                }
 
                rooms.Add(room);
            }
 
            return rooms;
        }
    }