设置待办事项界面
创建待办待办事项集合并初始化
- TodoViewModel：
using Mytodo.Common.Models;
using Prism.Commands;
using Prism.Mvvm;
using System;
using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
namespace Mytodo.ViewModels
{
public class TodoViewModel:BindableBase
{
private ObservableCollection<ToDoDto>? todoDtos;
/// <summary>
/// todo集合
/// </summary>
public ObservableCollection<ToDoDto>? TodoDtos
{
get { return todoDtos; }
set { todoDtos = value; RaisePropertyChanged(); }
}
public TodoViewModel()
{
//创建测试数据
CreatTestData();
OpenRightContentCmd = new DelegateCommand(Add);
}
void CreatTestData()
{
TodoDtos = new ObservableCollection<ToDoDto>();
for (int i = 0; i < 20; i++)
{
TodoDtos.Add(new ToDoDto() { Title = "待办" + i, Content = "正在处理中....." });
}
}
}
}
创建绑定右侧命令、变量
private bool isRightOpen;
public bool IsRightOpen
{
get { return isRightOpen; }
set { isRightOpen = value; RaisePropertyChanged(); }
}
public DelegateCommand OpenRightContentCmd { set; get; }
void Add()
{
IsRightOpen = true;
}
public TodoViewModel()
{
//创建测试数据
OpenRightContentCmd = new DelegateCommand(Add);
}
设置界面
<UserControl
x:Class="Mytodo.Views.TodoView"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:local="clr-namespace:Mytodo.Views"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:md="http://materialdesigninxaml.net/winfx/xaml/themes"
d:DesignHeight="450"
d:DesignWidth="800"
mc:Ignorable="d">
<md:DialogHost>
<md:DrawerHost IsRightDrawerOpen="{Binding IsRightOpen}">
<md:DrawerHost.RightDrawerContent>
<DockPanel
MinWidth="200"
MaxWidth="240"
Margin="2"
LastChildFill="False">
<TextBlock
Margin="10"
DockPanel.Dock="Top"
FontFamily="微软雅黑"
FontSize="20"
FontWeight="Bold"
Text="添加待办" />
<StackPanel
Margin="10"
DockPanel.Dock="Top"
Orientation="Horizontal">
<TextBlock
Margin="5"
VerticalAlignment="Center"
FontFamily="微软雅黑"
FontSize="14"
Text="状态" />
<ComboBox Margin="5">
<ComboBoxItem Content="已完成" FontSize="12" />
<ComboBoxItem Content="未完成" FontSize="12" />
</ComboBox>
</StackPanel>
<TextBox
Margin="10"
md:HintAssist.Hint="待办事项标题"
DockPanel.Dock="Top"
FontFamily="微软雅黑"
FontSize="12" />
<TextBox
MinHeight="50"
Margin="10"
md:HintAssist.Hint="待办事项内容"
DockPanel.Dock="Top"
FontFamily="微软雅黑"
FontSize="12"
TextWrapping="Wrap" />
</DockPanel>
</md:DrawerHost.RightDrawerContent>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="auto" />
<RowDefinition />
</Grid.RowDefinitions>
<StackPanel Margin="15,10" Orientation="Horizontal">
<TextBox
Width="200"
FontFamily="微软雅黑"
FontSize="14"
md:HintAssist.Hint="查找待办事项" />
<TextBlock
Margin="10"
FontSize="14"
Text="筛选" />
<ComboBox
Width="auto"
MinWidth="30"
FontFamily="微软雅黑"
FontSize="14">
<ComboBoxItem Content="全部" />
<ComboBoxItem Content="已完成" />
<ComboBoxItem Content="未完成" />
</ComboBox>
</StackPanel>
<Button
Margin="10,0"
HorizontalAlignment="Right"
Command="{Binding OpenRightContentCmd}"
Content="+ 添加到待办"
FontFamily="微软雅黑"
FontSize="14" />
<ItemsControl
Grid.Row="1"
Margin="10"
ItemsSource="{Binding TodoDtos}">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<WrapPanel />
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemTemplate>
<DataTemplate>
<Border MinWidth="200" Margin="10">
<Grid MinHeight="150">
<Grid.RowDefinitions>
<RowDefinition Height="auto" />
<RowDefinition />
</Grid.RowDefinitions>
<DockPanel LastChildFill="False">
<TextBlock
Margin="10,10"
FontFamily="黑体"
FontSize="14"
Text="{Binding Title}" />
<md:PackIcon
Margin="10,10"
VerticalContentAlignment="Top"
DockPanel.Dock="Right"
Kind="More" />
</DockPanel>
<TextBlock
Grid.Row="1"
Margin="10,5"
FontFamily="黑体"
FontSize="12"
Opacity="0.7"
Text="{Binding Content}" />
<Canvas Grid.RowSpan="2" ClipToBounds="True">
<Border
Canvas.Top="10"
Canvas.Right="-50"
Width="120"
Height="120"
Background="#FFFFFF"
CornerRadius="100"
Opacity="0.1" />
<Border
Canvas.Top="80"
Canvas.Right="-30"
Width="120"
Height="120"
Background="#FFFFFF"
CornerRadius="100"
Opacity="0.1" />
</Canvas>
<Border
Grid.RowSpan="2"
Background="#ffcccc"
CornerRadius="5"
Opacity="0.3" />
</Grid>
</Border>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</Grid>
</md:DrawerHost>
</md:DialogHost>
</UserControl>
文章来源地址https://www.toymoban.com/news/detail-611847.html
文章来源：https://www.toymoban.com/news/detail-611847.html
到了这里，关于WPF实战学习笔记06-设置待办事项界面的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
