房地产微网站建设栏目设计,行业网站建设策划方案,wordpress中文目录下,网站被黑 发现前言
WPF在国内讨论度很小#xff0c;我在这里记录一下WPF简单的原生控件是如何使用的#xff0c;顺便回忆一下WPF的基础知识#xff0c;有些忘记的比较厉害了
WPF简介
WPF是微软推出的桌面UI软件#xff0c;是我觉得最早实现MVVM#xff08;数据驱动事务#xff09;我在这里记录一下WPF简单的原生控件是如何使用的顺便回忆一下WPF的基础知识有些忘记的比较厉害了
WPF简介
WPF是微软推出的桌面UI软件是我觉得最早实现MVVM数据驱动事务比Vue早3,4年吧。当然讨论谁是第一个并没有意义现在Vue如日中天Vueuniappuniapp是基于Vue开发的基本实现了网页端到移动端全平台的UI解决方案。而桌面软件逐渐式微。注意WPF只能在Windows环境下运行Linux系统现在应该暂不支持
WPF目前状况
微软技术的特点就是技术很牛B但是容易断档。只管开发新技术但是不管维护。WPF目前框架已经停止更新微软现在主推的是MAUI推出Windows桌面应用Andorid,ios,macos跨端文件一次生成多端使用。WPF现在是工控领域比较多工控领域主打的就是性能。
现在Ui框架情况
Vue Vue2.0上手难度低开发速度快Vue3.0效率更高uniapp基于Vue开发在追求开发效率上和学习成本上是国内目前的最优解 React用的比较少不评价。Web端两个大哥Vue和React。React 有 React Active也支持移动端开发。但是我也没接触过。Angular目前看已经没落了Flutter没用过是Andriod和IOS跨端开发的框架但是好像圈子比较小QTC专业工控领域因为是C所以可以实现对内存的完全操控但是开发周期长开发难度大。用来开发小项目就是大炮打蚊子。C#/.NET Winform老东西死而不僵。在工控领域不追求UI界面美观只要求能用。现在岗位也还是很多。WPF:Winform的上位替代使用XMALMVVM。用起来和Vue差不多。Unity2d/3d上限最高的Ui框架用游戏的UI去做操作系统简直是降维打击。特别适合需要进行交互设计的软件。但是问题是大部分UI界面就是点点点有点大材小用。
工控领域是特别讲究性能的地方。网页不太适合做工控领域的操作软件。工控领域的要求是
效率高因为工控领域机器性能比较差打开网页特别慢。兼容性好有些工控机还是windows xp系统这种老东西。权限问题网页的权限提升难度比较大。
ok,目前有些离题了现在来介绍WPF原生相关知识
WPF原生介绍
微软官方文档 微软的文档写的真是垃圾我去微软上面搜WPF文档里面没有给放到Windows Desktop里面了。我找了半天。还有就是有部分是机器翻译你TM把元素名翻译了我怎么搜得到。Grid翻译成网格我搜还没有这个类。
WPF布局
布局是最重要因为后面单个元素组件我们可以通过Ui库来进行解决。
名称作用Grid最基本的布局元素。通过Row和Col来对布局进行划分。有固定长度比例长度自动适应三种长度布局UniformGrid均分布局。如果是9个按钮就是33。如果是4个按钮就是22。如果不是平方数例如10个按钮则是4*4的布局然后是442。剩下的布局为空。StackPanel无法自动换行的布局WrapPanel会自动换行的布局DockPanel停靠容器类似于vs studio里面的侧边栏
Grid
Grid使用有一定的逻辑顺序
Grid Gird.RowDefinitions定义用于包裹RowDefinition RowDefinition定义有多少个RowDefinition Grid.ColumnDefinitions同上 ColumnDefinition 元素
示例如下
Window x:ClassModuleB.Views.ViewBxmlnshttp://schemas.microsoft.com/winfx/2006/xaml/presentationxmlns:xhttp://schemas.microsoft.com/winfx/2006/xamlxmlns:dhttp://schemas.microsoft.com/expression/blend/2008xmlns:mchttp://schemas.openxmlformats.org/markup-compatibility/2006xmlns:localclr-namespace:ModuleB.Viewsmc:IgnorabledTitleViewB Height450 Width800GridGrid.RowDefinitionsRowDefinition /RowDefinition /RowDefinition //Grid.RowDefinitionsGrid.ColumnDefinitionsColumnDefinition /ColumnDefinition /ColumnDefinition //Grid.ColumnDefinitionsTextBlock Text我是默认FontSize50 /TextBlock Text我是第二个默认 TextWrappingWrapFontSize50 /TextBlock Text我是默认FontSize50 /TextBlock Text我是指定第二行第二列FontSize50Grid.Row2Grid.Column2TextWrappingWrap //Grid
/Window
不指定的话就默认第一格这里可以看到两个文字重叠了 按比例修改
Window x:ClassModuleB.Views.ViewBxmlnshttp://schemas.microsoft.com/winfx/2006/xaml/presentationxmlns:xhttp://schemas.microsoft.com/winfx/2006/xamlxmlns:dhttp://schemas.microsoft.com/expression/blend/2008xmlns:mchttp://schemas.openxmlformats.org/markup-compatibility/2006xmlns:localclr-namespace:ModuleB.Viewsmc:IgnorabledTitleViewB Height450 Width800GridGrid.RowDefinitionsRowDefinition Height1*/RowDefinition Height1*/RowDefinition Height2*//Grid.RowDefinitionsGrid.ColumnDefinitionsColumnDefinition Width1*/ColumnDefinition Width1*/ColumnDefinition Width2*//Grid.ColumnDefinitions............/Grid
/Window 固定大小
Window x:ClassModuleB.Views.ViewBxmlnshttp://schemas.microsoft.com/winfx/2006/xaml/presentationxmlns:xhttp://schemas.microsoft.com/winfx/2006/xamlxmlns:dhttp://schemas.microsoft.com/expression/blend/2008xmlns:mchttp://schemas.openxmlformats.org/markup-compatibility/2006xmlns:localclr-namespace:ModuleB.Viewsmc:IgnorabledTitleViewB Height450 Width800GridGrid.RowDefinitionsRowDefinition Height200/RowDefinition Height100/RowDefinition //Grid.RowDefinitionsGrid.ColumnDefinitionsColumnDefinition Width200/ColumnDefinition Width100/ColumnDefinition //Grid.ColumnDefinitions......./Grid
/Window UniformGrid
自动分配尽可能均匀分布与长宽不管。例如42x2。93x3。如果是不能开方的就会向上取整缺的就空着。例如83*3-1。 效果如下
4个
Window x:ClassModuleB.Views.ViewBxmlnshttp://schemas.microsoft.com/winfx/2006/xaml/presentationxmlns:xhttp://schemas.microsoft.com/winfx/2006/xamlxmlns:dhttp://schemas.microsoft.com/expression/blend/2008xmlns:mchttp://schemas.openxmlformats.org/markup-compatibility/2006xmlns:localclr-namespace:ModuleB.Viewsmc:IgnorabledTitleViewB Height450 Width800UniformGridTextBox Text1 FontSize50/TextBox Text2FontSize50 /TextBox Text3FontSize50 /TextBox Text4FontSize50 //UniformGrid
/Window 9个
Window x:ClassModuleB.Views.ViewBxmlnshttp://schemas.microsoft.com/winfx/2006/xaml/presentationxmlns:xhttp://schemas.microsoft.com/winfx/2006/xamlxmlns:dhttp://schemas.microsoft.com/expression/blend/2008xmlns:mchttp://schemas.openxmlformats.org/markup-compatibility/2006xmlns:localclr-namespace:ModuleB.Viewsmc:IgnorabledTitleViewB Height450 Width800UniformGridTextBox Text1 FontSize50/TextBox Text2FontSize50 /TextBox Text3FontSize50 /TextBox Text4FontSize50 /TextBox Text5FontSize50 /TextBox Text6FontSize50 /TextBox Text7FontSize50 /TextBox Text8FontSize50 /TextBox Text9FontSize50 //UniformGrid
/Window 8个
Window x:ClassModuleB.Views.ViewBxmlnshttp://schemas.microsoft.com/winfx/2006/xaml/presentationxmlns:xhttp://schemas.microsoft.com/winfx/2006/xamlxmlns:dhttp://schemas.microsoft.com/expression/blend/2008xmlns:mchttp://schemas.openxmlformats.org/markup-compatibility/2006xmlns:localclr-namespace:ModuleB.Viewsmc:IgnorabledTitleViewB Height450 Width800UniformGridTextBox Text1 FontSize50/TextBox Text2FontSize50 /TextBox Text3FontSize50 /TextBox Text4FontSize50 /TextBox Text5FontSize50 /TextBox Text6FontSize50 /TextBox Text7FontSize50 /TextBox Text8FontSize50 //UniformGrid
/Window StackPanel
单方向布局配合Orientation 使用默认纵向布局.长宽会自动拉伸填满
Window x:ClassModuleB.Views.ViewBxmlnshttp://schemas.microsoft.com/winfx/2006/xaml/presentationxmlns:xhttp://schemas.microsoft.com/winfx/2006/xamlxmlns:dhttp://schemas.microsoft.com/expression/blend/2008xmlns:mchttp://schemas.openxmlformats.org/markup-compatibility/2006xmlns:localclr-namespace:ModuleB.Viewsmc:IgnorabledTitleViewBHeight450Width800GridGrid.ColumnDefinitionsColumnDefinition /ColumnDefinition //Grid.ColumnDefinitionsStackPanel OrientationHorizontalButton Content按钮FontSize50 /Button Content按钮FontSize50 /Button Content按钮FontSize50 /Button Content按钮FontSize50 /Button Content按钮FontSize50 //StackPanelStackPanel Grid.Column1Button Content按钮FontSize50 /Button Content按钮FontSize50 /Button Content按钮FontSize50 /Button Content按钮FontSize50 /Button Content按钮FontSize50 //StackPanel/Grid/Window WrapPanel
自动换行布局,也可以指定排版方向
Window x:ClassModuleB.Views.ViewBxmlnshttp://schemas.microsoft.com/winfx/2006/xaml/presentationxmlns:xhttp://schemas.microsoft.com/winfx/2006/xamlxmlns:dhttp://schemas.microsoft.com/expression/blend/2008xmlns:mchttp://schemas.openxmlformats.org/markup-compatibility/2006xmlns:localclr-namespace:ModuleB.Viewsmc:IgnorabledTitleViewB Height450 Width800GridGrid.ColumnDefinitionsColumnDefinition /ColumnDefinition //Grid.ColumnDefinitionsWrapPanelButton Content按钮FontSize50 /Button Content按钮FontSize50 /Button Content按钮FontSize50 /Button Content按钮FontSize50 /Button Content按钮FontSize50 /Button Content按钮FontSize50 /Button Content按钮FontSize50 /Button Content按钮FontSize50 /Button Content按钮FontSize50 //WrapPanelWrapPanel OrientationVertical Grid.Column1Button Content按钮FontSize50 /Button Content按钮FontSize50 /Button Content按钮FontSize50 /Button Content按钮FontSize50 /Button Content按钮FontSize50 /Button Content按钮FontSize50 /Button Content按钮FontSize50 /Button Content按钮FontSize50 /Button Content按钮FontSize50 //WrapPanel/Grid
/Window DockPanel
停靠布局使用DockPanel.Dock指定停靠方向
默认设置
Window x:ClassModuleB.Views.ViewBxmlnshttp://schemas.microsoft.com/winfx/2006/xaml/presentationxmlns:xhttp://schemas.microsoft.com/winfx/2006/xamlxmlns:dhttp://schemas.microsoft.com/expression/blend/2008xmlns:mchttp://schemas.openxmlformats.org/markup-compatibility/2006xmlns:localclr-namespace:ModuleB.Viewsmc:IgnorabledTitleViewBHeight450Width800DockPanel Button DockPanel.DockTopContent Top FontSize50/Button DockPanel.DockLeftContentLeftFontSize50 /Button DockPanel.DockRightContent RightFontSize50 /Button DockPanel.DockBottomContent BottomFontSize50 /Button Content CenterFontSize50 //DockPanel/Window放置顺序会影响覆盖逻辑
Window x:ClassModuleB.Views.ViewBxmlnshttp://schemas.microsoft.com/winfx/2006/xaml/presentationxmlns:xhttp://schemas.microsoft.com/winfx/2006/xamlxmlns:dhttp://schemas.microsoft.com/expression/blend/2008xmlns:mchttp://schemas.openxmlformats.org/markup-compatibility/2006xmlns:localclr-namespace:ModuleB.Viewsmc:IgnorabledTitleViewBHeight450Width800DockPanel Button DockPanel.DockBottomContent BottomFontSize50 /Button DockPanel.DockLeftContentLeftFontSize50 /Button DockPanel.DockTopContent Top FontSize50/Button DockPanel.DockRightContent RightFontSize50 /Button Content CenterFontSize50 //DockPanel/Window最后一个元素不填满布局
Window x:ClassModuleB.Views.ViewBxmlnshttp://schemas.microsoft.com/winfx/2006/xaml/presentationxmlns:xhttp://schemas.microsoft.com/winfx/2006/xamlxmlns:dhttp://schemas.microsoft.com/expression/blend/2008xmlns:mchttp://schemas.openxmlformats.org/markup-compatibility/2006xmlns:localclr-namespace:ModuleB.Viewsmc:IgnorabledTitleViewBHeight450Width800DockPanel LastChildFillFalseButton DockPanel.DockTopContent Top FontSize50 /Button DockPanel.DockLeftContentLeftFontSize50 /Button DockPanel.DockRightContent RightFontSize50 /Button DockPanel.DockBottomContent BottomFontSize50 /Button Content CenterFontSize50 //DockPanel/Window
