如何使用uwp中的全选复选框创建带有复选框项目的列表视图
Posted
技术标签:
【中文标题】如何使用uwp中的全选复选框创建带有复选框项目的列表视图【英文标题】:How to create a list view with checkbox item with select all check box in uwp 【发布时间】:2019-07-28 04:10:48 【问题描述】:我想创建一个包含部门名称的ListView
。 ListView
包含带有部门名称的 CheckBox
。用户可以选中和取消选中部门,也可以单击全选复选框,用户可以选择所有部门。
【问题讨论】:
***.com/help/mcve 也许我有你正在寻找的东西,以及工作代码。我只想了解您拥有的用例,1 个列表视图,所有项目的复选框和顶部的全选按钮 【参考方案1】:你想要一个简单的列表视图,textcell
或 imagecell
由你决定,在这里我发布了带有 imagecell 的列表视图的代码,还有单元格滑动选项,只需在你想要的地方添加 Checkbox
事件和应用逻辑。希望它对你有用!
<AbsoluteLayout>
<ListView x:Name="Demolist" BackgroundColor="White" ItemSelected="Demolist_ItemSelected">
<ListView.ItemTemplate>
<DataTemplate>
<ImageCell Height="30"
Text="Binding deparment_name "
Detail="Binding department_description"
ImageSource="ImageName.png">
<ImageCell.ContextActions>
<MenuItem x:Name="OnMore" Clicked="OnMore_Clicked" CommandParameter="Binding ." Text="More" />
<MenuItem x:Name="OnDelete" Clicked="OnDelete_Clicked" CommandParameter="Binding ." Text="Delete" IsDestructive="True" />
</ImageCell.ContextActions>
</ImageCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</AbsoluteLayout>
【讨论】:
【参考方案2】:Checkbox 不是 XF 框架中存在的控件,所以我认为您不能在 Xamarin.form 的列表视图中添加复选框,但您可以使用不同的方式显示选中和取消选中状态。
<ContentPage
x:Class="test2.Page3"
xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:convert="clr-namespace:test2"
x:Name="ToDoPage">
<ContentPage.Resources>
<convert:converter1 x:Key="converterbool" />
</ContentPage.Resources>
<ContentPage.Content>
<StackLayout>
<ListView x:Name="listview1" ItemsSource="Binding todoList">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="4*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Label Text="Binding ItemDescription" VerticalOptions="Center" />
<Button
Grid.Column="1"
Command="Binding Source=x:Reference ToDoPage, Path=BindingContext.UpdateCheckBoxCommand"
CommandParameter="Binding Id"
Opacity="0" />
<Image
Grid.Column="1"
HeightRequest="20"
HorizontalOptions="Center"
Source="Binding IsDone, Converter=StaticResource converterbool"
VerticalOptions="Center" />
</Grid>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</StackLayout>
</ContentPage.Content>
public class TodoItem:INotifyPropertyChanged
private string _Id;
public string Id
get return _Id;
set
_Id = value;
RaisePropertyChanged("Id");
private string _ItemDescription;
public string ItemDescription
get return _ItemDescription;
set
_ItemDescription = value;
RaisePropertyChanged("ItemDescription");
private bool _IsDone;
public bool IsDone
get return _IsDone;
set
_IsDone = value;
RaisePropertyChanged("IsDone");
public event PropertyChangedEventHandler PropertyChanged;
public void RaisePropertyChanged(string propertyName)
PropertyChangedEventHandler handler = PropertyChanged;
if (handler != null)
handler(this, new PropertyChangedEventArgs(propertyName));
class ToDoViewModel:INotifyPropertyChanged
public ObservableCollection<TodoItem> todoList get; set;
public ICommand UpdateCheckBoxCommand get; set;
public ToDoViewModel()
todoList = new ObservableCollection<TodoItem>()
new TodoItem() Id = "1", ItemDescription = "Task 1", IsDone = false,
new TodoItem() Id = "2", ItemDescription = "Task 2", IsDone = false,
new TodoItem() Id = "3", ItemDescription = "Task 3", IsDone = false,
new TodoItem() Id = "4", ItemDescription = "Task 4", IsDone = false,
new TodoItem() Id = "5", ItemDescription = "Task 5",IsDone=false
;
UpdateCheckBoxCommand = new Command((Id) => UpdateCheckBox(Id.ToString()));
private void UpdateCheckBox(string id)
IEnumerable<TodoItem> items = todoList.Where(x=>x.Id==id);
foreach(var item in items )
if (item.IsDone) item.IsDone = false;
else item.IsDone = true;
public event PropertyChangedEventHandler PropertyChanged;
public void RaisePropertyChanged(string propertyName)
PropertyChangedEventHandler handler = PropertyChanged;
if (handler != null)
handler(this, new PropertyChangedEventArgs(propertyName));
class converter1 : IValueConverter
public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
bool ischeck = (bool)value;
if(ischeck==false)
return "uncheck.png";
else
return "check.png";
public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
throw new NotImplementedException();
[XamlCompilation(XamlCompilationOptions.Compile)]
public partial class Page3 : ContentPage
public Page3 ()
InitializeComponent ();
this.BindingContext = new ToDoViewModel();
【讨论】:
以上是关于如何使用uwp中的全选复选框创建带有复选框项目的列表视图的主要内容,如果未能解决你的问题,请参考以下文章
在 uwp 中使用带有多选复选框的 mytoolkit 数据网格