Question

我在uwp中有一个列表视图，其中我必须通过在选中的项目上显示选中的复选框来突出显示选中的项目。所以，请告诉我我是如何实现的。

   My XAML code    

  <ListView x:Name="gvProcesses"  SelectionChanged="GvProcesses_SelectionChanged" Grid.Row="1" Grid.ColumnSpan="2" Height="100"  ItemsSource="{Binding ScanProcessNameCollection,Mode=OneWay}" SelectedItem="{Binding SelectedScanProcessName,Mode=TwoWay}"   IsItemClickEnabled="True" SelectionMode="Single"  ScrollViewer.HorizontalScrollBarVisibility="Auto" ScrollViewer.HorizontalScrollMode="Enabled" ScrollViewer.IsHorizontalRailEnabled="True" >
                <ListView.ItemsPanel>
                    <ItemsPanelTemplate>
                        <!--<StackPanel Orientation="Horizontal" />-->
                        <ItemsStackPanel Orientation="Horizontal" Margin="0"/>
                    </ItemsPanelTemplate>
                </ListView.ItemsPanel>
                <ListView.ItemTemplate>
                    <DataTemplate >

                        <StackPanel Background="{ThemeResource SystemControlBackgroundAccentBrush}" >
                            <TextBlock  Visibility="{Binding IsSelected,Mode=TwoWay, RelativeSource={RelativeSource Mode=TemplatedParent}, Converter={StaticResource BooleanToVisibilityConverter}}" 
                                        x:Name="txtcheckbox" FontFamily="Segoe MDL2 Assets" Text="&#xE73A;"  FontSize="{ StaticResource SmallFontSize}" VerticalAlignment="Center"  HorizontalAlignment="Left"></TextBlock>
                            <TextBlock Text="{Binding}" FontSize="{ StaticResource SmallFontSize}" VerticalAlignment="Center" TextWrapping="WrapWholeWords"  Margin="0 40" HorizontalAlignment="Center"></TextBlock>
                        </StackPanel>
                    </DataTemplate>
                </ListView.ItemTemplate>
                <ListView.ItemContainerStyle>
                    <Style TargetType="ListViewItem">
                        <Setter Property="HorizontalContentAlignment" Value="Stretch" />
                        <Setter Property="VerticalContentAlignment" Value="Stretch" />
                        <Setter Property="Margin" Value="2,0,2,0"  />
                        <Setter Property="Padding" Value="0,0,0,0"  />
                        <Setter Property="MinHeight" Value="50"  />
                        <Setter Property="MaxHeight" Value="100"  />
                        <Setter Property="MaxWidth" Value="80"  />

                    </Style>
                </ListView.ItemContainerStyle>
            </ListView>

在绑定的所有项目上显示复选框不正常，并且在调试时也不会在转换器上显示。

Answer 1

多种选择模式

如果需要使用复选框进行多个选择，则可以将属性SelectionMode更改为Multiple，然后将IsMultiSelectCheckBoxEnabled设置为True

单选模式

如果需要带有复选框的单选，则需要将复选框添加到网格中，然后将其绑定到Veriable。我在下面添加了一个小例子

// Xaml代码

<ListView ItemsSource="{x:Bind line_items,Mode=OneWay}"  SelectionChanged="ListView_SelectionChanged">
        <ListView.ItemTemplate>
            <DataTemplate>
                <StackPanel Orientation="Horizontal">
                    <CheckBox IsChecked="{Binding is_checked,Mode=OneWay}"></CheckBox>
                    <TextBlock Text="{Binding value,Mode=OneWay}"></TextBlock>
                </StackPanel>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>

// C＃代码

public sealed partial class MainPage : Page
    {
        public List<item> line_items = new List<item>();
        public MainPage()
        {
            for (var i = 0; i < 10; i++)
                line_items.Add(new item() { is_checked = false, value = "item" + i });
            this.InitializeComponent(); 
        }

        private void ListView_SelectionChanged(object sender, SelectionChangedEventArgs e)
        {
            foreach(var item in line_items)
                item.is_checked = false;
            line_items[(sender as ListView).SelectedIndex].is_checked = true;
        }
    }
    public class item : INotifyPropertyChanged
    {
        private bool? _is_checked;
        private string _value;

        public bool? is_checked
        {
            get { return _is_checked; }
            set
            {
                _is_checked = value;
                RaisePropertyChanged(nameof(is_checked));
            }
        }

        public string value
        {
            get { return _value; }
            set
            {
                _value = value;
                RaisePropertyChanged(nameof(value));
            }
        }
        public event PropertyChangedEventHandler PropertyChanged;
        protected void RaisePropertyChanged(string name)
        {
            if (PropertyChanged != null)
            {
                PropertyChanged(this, new PropertyChangedEventArgs(name));
            }
        }
    }

如何在uwp中的ListView的所选项目上显示选中的复选框

1 个答案:

多种选择模式

单选模式