WPF实战学习笔记05-首页界面

最新推荐文章于 2024-09-30 10:10:26 发布
最新推荐文章于 2024-09-30 10:10:26 发布
阅读量447 收藏
点赞数
分类专栏： WPF实战学习笔记 文章标签： wpf 学习 笔记
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/xinzhiya001/article/details/131896156
版权

首页界面

新建文件

  • 添加文件［类型：用户控件］

    ./Common/Models/TaskBars.cs

    ./Common/Models/ToDoDto.cs

    ./Common/Models/MemoDto.cs

新建类

TaskBars.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;

namespace Mytodo.Common.Models
{
    public class TaskBar
    {
        private string? title;
        private string? content;
        private string? target;
        private string? color;
        private string? icon;


		public string? Icon
		{
			get { return icon; }
			set { icon = value; }
		}

		

		public string? Title
		{
			get { return title; }
			set { title = value; }
		}

		

		public string? Content
		{
			get { return content; }
			set { content = value; }
		}

		

		public string? Color
		{
			get { return color; }
			set { color = value; }
		}

		

		public string? Target
		{
			get { return target; }
			set { target = value; }
		}
	}
}
TodoDto.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;

namespace Mytodo.Common.Models
{
    public class ToDoDto:BaseTodo
    {
		private string? title;
		private string? content;
		private int status;

		public int Status
		{
			get { return status; }
			set { status = value; }
		}

		public string? Content
		{
			get { return content; }
			set { content = value; }
		}

		public string? Title
		{
			get { return title; }
			set { title = value; }
		}
	}
}
MemoDto.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;

namespace Mytodo.Common.Models
{
    /// <summary>
    /// 备忘录
    /// </summary>
    public class MemoDto:BaseTodo
    {
        private string? title;
        private string? content;
        private int status;

        public int Status
        {
            get { return status; }
            set { status = value; }
        }

        public string? Content
        {
            get { return content; }
            set { content = value; }
        }

        public string? Title
        {
            get { return title; }
            set { title = value; }
        }
    }
}
BaseTodo.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;

namespace Mytodo.Common.Models
{
    public   class BaseTodo
    {
		private int id;
		private DateTime createDate;
		private DateTime updateDate;

		/// <summary>
		/// 项修改日期
		/// </summary>
		public DateTime UpdateDate
		{
			get { return updateDate; }
			set { updateDate = value; }
		}

		/// <summary>
		/// 项创建时间
		/// </summary>
		public DateTime CreateDate
		{
			get { return createDate; }
			set { createDate = value; }
		}

		/// <summary>
		/// 项ID
		/// </summary>
		public int Id
		{
			get { return id; }
			set { id = value; }
		}
	}
}

创建TaskBars集合变量并初始化

创建变量

  • IndexViewModel

    private ObservableCollection<TaskBar> taskBars;
初始化
  • IndexViewModel（代码在构造函数中）
TaskBars=new ObservableCollection<TaskBar>();
TaskBars.Add(new TaskBar { Icon = "CalendarBlankOutline", Title = "汇总", Color = "#FF00FF00", Content = "27", Target = "" });
TaskBars.Add(new TaskBar { Icon = "CalendarMultipleCheck", Title = "已完成", Color = "#6B238E", Content = "24", Target = "" });
TaskBars.Add(new TaskBar { Icon = "ChartLine", Title = "完成比例", Color = "#32CD99", Content = "100%", Target = "" });
TaskBars.Add(new TaskBar { Icon = "CheckboxMarked", Title = "备忘录", Color = "#5959AB", Content = "13", Target = "" });

创建todoDtos、memoDtos集合变量并初始化

  • IndexViewModel

    private ObservableCollection<ToDoDto> todoDtos;
private ObservableCollection<MemoDto> memoDtos;
public ObservableCollection<MemoDto> MemoDtos
{
    get { return memoDtos; }
    set { memoDtos = value; RaisePropertyChanged(); }
}


public ObservableCollection<ToDoDto> TodoDtos
{
    get { return todoDtos; }
    set { todoDtos = value; RaisePropertyChanged(); }
}
void CreatTestData()
{
    TodoDtos = new ObservableCollection<ToDoDto>();
    MemoDtos = new ObservableCollection<MemoDto>();

    for (int i = 0; i < 20; i++)
    {
        TodoDtos.Add(new ToDoDto() { Title = "待办" + i, Content = "正在处理中....." });
        MemoDtos.Add(new MemoDto() { Title = "备忘" + i, Content = "正在忘记中....." });
    }
}
public IndexViewModel()
{
    Title = "您好，2022";
    TaskBars=new ObservableCollection<TaskBar>();
    TaskBars.Add(new TaskBar { Icon = "CalendarBlankOutline", Title = "汇总", Color = "#FF00FF00", Content = "27", Target = "" });
    TaskBars.Add(new TaskBar { Icon = "CalendarMultipleCheck", Title = "已完成", Color = "#6B238E", Content = "24", Target = "" });
    TaskBars.Add(new TaskBar { Icon = "ChartLine", Title = "完成比例", Color = "#32CD99", Content = "100%", Target = "" });
    TaskBars.Add(new TaskBar { Icon = "CheckboxMarked", Title = "备忘录", Color = "#5959AB", Content = "13", Target = "" });

    CreatTestData();
}

定义界面

<UserControl
    x:Class="Mytodo.Views.IndexView"
    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:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    d:DesignHeight="450"
    d:DesignWidth="800"
    mc:Ignorable="d">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="auto" />
            <RowDefinition Height="auto" />
            <RowDefinition />
        </Grid.RowDefinitions>
        <TextBlock
            Margin="20,10"
            FontSize="30"
            Text="{Binding Title}" />
        <ItemsControl Grid.Row="1" ItemsSource="{Binding TaskBars}">
            <ItemsControl.ItemsPanel>
                <ItemsPanelTemplate>
                    <UniformGrid Columns="4" />
                </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <Border
                        Margin="10"
                        Background="{Binding Color}"
                        CornerRadius="5">
                        <Border.Style>
                            <Style TargetType="Border">
                                <Style.Triggers>
                                    <Trigger Property="IsMouseOver" Value="True">
                                        <Setter Property="Effect">
                                            <Setter.Value>
                                                <DropShadowEffect
                                                    BlurRadius="10"
                                                    ShadowDepth="1"
                                                    Color="#dddddd" />
                                            </Setter.Value>
                                        </Setter>
                                    </Trigger>
                                </Style.Triggers>
                            </Style>
                        </Border.Style>
                        <Grid>
                            <StackPanel Margin="20">
                                <materialDesign:PackIcon
                                    Width="25"
                                    Height="30"
                                    Margin="5"
                                    Kind="{Binding Icon}" />
                                <TextBlock
                                    Margin="5"
                                    FontSize="10"
                                    Text="{Binding Title}" />
                                <TextBlock
                                    Margin="5"
                                    FontSize="30"
                                    Text="{Binding Content}" />
                            </StackPanel>
                            <Canvas 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>
                        </Grid>
                    </Border>
                </DataTemplate>
            </ItemsControl.ItemTemplate>
        </ItemsControl>
        <Grid Grid.Row="2">
            <Grid.ColumnDefinitions>
                <ColumnDefinition />
                <ColumnDefinition />
            </Grid.ColumnDefinitions>
            <Border
                Grid.Column="0"
                Margin="10,20"
                Background="#bebebe"
                CornerRadius="5"
                Opacity="0.1" />
            <Border
                Grid.Column="1"
                Margin="10,20"
                Background="#bebebe"
                CornerRadius="5"
                Opacity="0.1" />
            <DockPanel Margin="10,0">
                <DockPanel
                    Grid.Column="0"
                    Margin="10,20"
                    DockPanel.Dock="Top"
                    LastChildFill="False">
                    <TextBlock
                        Margin="10"
                        FontFamily="微软雅黑"
                        FontSize="25"
                        FontWeight="Bold"
                        Text="待办事项" />
                    <Button
                        Width="30"
                        Height="30"
                        Margin="10"
                        VerticalAlignment="Top"
                        Content="{materialDesign:PackIcon Kind=Add}"
                        DockPanel.Dock="Right"
                        Style="{StaticResource MaterialDesignFloatingActionAccentButton}" />
                </DockPanel>
                <ListBox
                    Margin="5"
                    HorizontalContentAlignment="Stretch"
                    ItemsSource="{Binding MemoDtos}"
                    ScrollViewer.VerticalScrollBarVisibility="Hidden">
                    <ListBox.ItemTemplate>
                        <DataTemplate>
                            <DockPanel LastChildFill="False">
                                <ToggleButton Width="40" DockPanel.Dock="Right" />
                                <StackPanel>
                                    <TextBlock FontSize="14" Text="{Binding Title}" />
                                    <TextBlock
                                        FontSize="24"
                                        Opacity="0.5"
                                        Text="{Binding Content}" />
                                </StackPanel>
                            </DockPanel>
                        </DataTemplate>
                    </ListBox.ItemTemplate>
                </ListBox>
            </DockPanel>
            <DockPanel Grid.Column="1" Margin="10,0">
                <DockPanel
                    Margin="10,20"
                    DockPanel.Dock="Top"
                    LastChildFill="False">
                    <TextBlock
                        Margin="10"
                        FontFamily="微软雅黑"
                        FontSize="25"
                        FontWeight="Bold"
                        Text="备忘录" />
                    <Button
                        Width="30"
                        Height="30"
                        Margin="10"
                        VerticalAlignment="Top"
                        Content="{materialDesign:PackIcon Kind=Add}"
                        DockPanel.Dock="Right"
                        Style="{StaticResource MaterialDesignFloatingActionAccentButton}" />
                </DockPanel>
                <ListBox
                    Margin="5"
                    ItemsSource="{Binding TodoDtos}"
                    ScrollViewer.VerticalScrollBarVisibility="Hidden">
                    <ListBox.ItemTemplate>
                        <DataTemplate>
                            <StackPanel>
                                <TextBlock FontSize="14" Text="{Binding Title}" />
                                <TextBlock
                                    FontSize="24"
                                    Opacity="0.5"
                                    Text="{Binding Content}" />
                            </StackPanel>
                        </DataTemplate>
                    </ListBox.ItemTemplate>
                </ListBox>
            </DockPanel>

        </Grid>
    </Grid>
</UserControl>

xinzhiya001
关注
专栏目录
wpf 控件的抖动效果
___ 、努ㄌ
09-27 3769
<Window x:Class="WpDemo.textBoxRun" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://sche
WPF实战学习笔记28-登录界面
xinzhiya001的博客
07-29 762
添加文件loginview.xaml。注意本界面使用的是md内的图标。添加文件Mytodo.ViewModels.LoginViewModel.cs。修改文件：App.xmal.cs。
wpf创建时间
qq_44858151的博客
02-18 151
1.wpf创建时间 DispatcherTimer dispatcherTimer = new DispatcherTimer(); // 当间隔时间过去时发生的事件 dispatcherTimer.Tick += new EventHandler(ShowCurrentTime); dispatcherTimer.Interval = new TimeSpan(0, 0, 0, 1); dispatcherTimer.Start(); public void ShowCurrentTime(objec
Material design - 图标（一）
jolieLi2019888的博客
04-18 1486
Product Icons（产品图标） 产品图标是品牌产品，服务和工具的直观表达\color{red}{产品图标是品牌产品，服务和工具的直观表达}产品图标是品牌产品，服务和工具的直观表达 设计原则 品牌表达 产品图标是品牌和产品的视觉表达，包括其服务和工具。 图标以简单，大胆和友好的方式传达产品的核心理念和意图。 虽然每个图标在视觉上都是不同的，但品牌的所有产品图标都应该通过概念和执行来统一。 ...
WPF Property属性
郎涯技术
04-05 3820
1. 属性的来龙去脉     被封装在类里的变量称为字段，它表示的是类或实例的状态；被封装在类里的函数叫做方法，它表示的是类或实例的功能。字段和类构造出了最原始的面向对象封装，这时候的面向对象中还不包含事件，属性等概念。     静态字段在内存中只有一个拷贝，非静态字段则每个实例都有一个拷贝，无论方法是静态还是非静态，在内存中都只有一个拷贝，区别只是你能通过类名来访问存放内
WPF实战学习笔记31-登录界面全局通知
xinzhiya001的博客
07-31 972
修改文件：Mytodo.ViewModels.LoginViewModel.cs。文件：Mytodo.Views.LoginView.cs构造函数添加内容。
WPF实战学习笔记06-设置待办事项界面
xinzhiya001的博客
07-24 514
【代码】WPF实战学习笔记06-设置待办事项界面。
WPF实战学习笔记20-设置首页启动页
xinzhiya001的博客
07-25 725
App.xmal.cs 重写OnInitialized方法。删除 CreatMenuBar();
WPF实战学习笔记07-设置备忘录以及设置界面
xinzhiya001的博客
07-24 128
主要从materialDesignDemo项目复制，需要更改项目名称，引用空间，另需要添加转换器以及对应的转换器资源key。都是从materialDesignDemo的colortool对应的.cs中复制过来，除了。同待办事项，相关名字改掉，类tododto改成memodto即可。其他的view自己定义就可以，这里不再展开。从MainView.xaml处复制过来。
WPF实战学习笔记22-添加自定义询问窗口
xinzhiya001的博客
07-29 657
详细代码：https://github.com/DongLiqiang/Mytodo/commit/221de6b2344d5c861f1d3b2fbb2480e3e3b35c26修改文件Mytodo.Extensions.DialogExtension添加内容，类中添加内容/// 显示方法//添加参数//返回对话框实例添加文件Mytodo.Views.MsgView.xaml<Grid><TextBlockd:Text="温馨提示"<TextBlock。
WPF实战学习笔记03-绑定菜单
xinzhiya001的博客
07-24 365
MainWindow内容，移动到Mainview.xaml中，并做相应修改,并把对应的.cs文件复制过来。Views内新建XAML文件MainView.xaml。Models 内新建类文件 MenuBars.cs。其中，BaseTheme=“Dark”
在WPF中实现多语言切换的四种方式
zhaotianff的专栏
09-28 1397
9 <s:String x:Key="Main.RibbonButton.Setting.Description">包括语言在内的全部设置</s:String>12 <s:String x:Key="Setting.Tab.Label.ChooseLanguage">请选择一种语言</s:String>//当前语言的JObject对象。8 <s:String x:Key="Main.RibbonButton.Setting.Title">设置</s:String>
什么是 JWT？它是如何工作的？
江南一点雨的专栏
09-29 1143
有状态服务，即服务端需要记录每次会话的客户端信息，从而识别客户端身份，根据用户身份进行请求的处理，典型的设计如 Tomcat 中的 Session。例如登录：用户登录后，我们把用户的信息保存在服务端 session 中，并且给用户一个 cookie 值，记录对应的 session，然后下次请求，用户携带 cookie 值来（这一步有浏览器自动完成），我们就能识别到对应 session，从而找到用户的信息。服务端保存大量数据，增加服务端压力服务端保存用户状态，不支持集群化部署。
WPF之UI进阶--控件样式与样式模板及词典
河西~石头
09-29 1326
在Window.Resources中定义样式，指定TargetType为要应用样式的控件类型。控件模板允许你完全自定义控件的视觉结构。你可以通过 ControlTemplate 元素定义控件的外观和行为。步骤 1: 定义控件模板。
WPF之UI进阶--完整了解wpf的控件和布局容器及应用
河西~石头
09-28 1718
无论是winform还是wfp，布局容器都是属于控件的一种，只不过说布局容器是一种“装控件的控件”。这里我们来梳理一下他们的关系和使用方法，并且详细介绍他们的使用及注意事项。
单体到微服务架构服务演化过程
Dc253061007的博客
09-28 1184
云原生应用的关键属性包括了：使用轻量级的容器打包、使用最合适的语言和框架开发、以松耦合的微服务方式设计、以 API 为中心的交互和协作、无状态和有状态服务在架构上界限清晰、不依赖于底层操作系统和服务器、部署在自服务、弹性的云基础设施上、通过敏捷的 DevOps 流程管理、自动化能力、通过定义和策略驱动的资源分配。SOA 偏向水平服务，微服务偏向垂直服务；对应的是服务开发，实现了源代码托管，你只需要关注你的代码实现，而不需要关心你的代码在哪，因为在整个开发过程中你都不会感受到代码库和代码分支的存在。
演示：基于WPF的DrawingVisual开发的频谱图和律动图
HeBianGu的博客
09-29 1572
1、使用轻量的绘图方式，比如：DrawingVisual（可以应用硬件加速渲染）；2、尽量减少数据量，越少的数据绘制性能越高；3、将绘制线程和更新数据线程分开，绘制线程中不要写太多逻辑尽量简单；4、显示的范围尽量不要太大，越小的屏幕范围性能越高；5、条件允许尽量提高硬件环境，最主要提高GPU环境；6、Visual Studio环境和Debug环境都会影响绘制性能，可以打包或生成Release测试最终性能；
WPF RadioButton 绑定boolean值
最新发布
明耀的博客
09-30 522
切记:RadioButton 不能有GroupName属性。
wpf+prism应用实战-朝夕停车场项目 源码
05-10
通过这个实战项目的源码学习，可以深入了解WPF Prism框架的应用及其MVVM架构和依赖注入的设计思想，也可以了解如何实现一个完整的智能化停车场管理系统。同时，该项目源码可以作为一个参考，通过在此基础上进行二次...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值