一、内容版本控制
1、项目内容管理的必要性
项目开发：项目立项-->代码开发-->运维 产生很多文档
2、常见的版本控制工具
Git/SVN
3、Git 与 GitHub/GitLab
4、代码管理实操
二、界面布局控件
1、从应用开发流程说起
WPF：业务逻辑
UI：窗口/控件
2、桌面应用的窗口布局
3、WPF 布局原理与够原则
不用显示的方式设定元素的尺寸
不用屏幕坐标来指定位置
4、WPF 常用布局控件与布局构成
Gride
特点：
功能强大，布局灵活的容器
两行四列表格
<Grid > <Grid.ColumnDefinitions> <ColumnDefinition Width="auto"></ColumnDefinition> <ColumnDefinition Width="auto"></ColumnDefinition> <ColumnDefinition Width="auto"></ColumnDefinition> <ColumnDefinition Width="auto"></ColumnDefinition> </Grid.ColumnDefinitions> <Grid.RowDefinitions> <RowDefinition Height="auto"></RowDefinition> <RowDefinition></RowDefinition> </Grid.RowDefinitions> <Button Grid.Column="1" Grid.Row="0" Grid.ColumnSpan="2" Grid.RowSpan="2">提交</Button> </Grid> 属性备注： Width= "auto" 列宽自适应 MinWidth 最小宽度 MaxWidth 最大宽度 Height="auto" 行高自适应 MinHeight 最小高度 MaxHeight 最大高度 Grid.Column 按钮所在哪列 从0开始 Grid.Row 按钮所在哪行 从0开始 Grid.ColumnSpan 跨列 从当前列往右跨 Grid.RowSpan 跨行 从当前行往下跨
复制代码
项目中常用的列表数据布局：
<Grid Background="Orange" Grid.IsSharedSizeScope="True"> <Grid.RowDefinitions> <RowDefinition Height="30"></RowDefinition> <RowDefinition Height="30"></RowDefinition> </Grid.RowDefinitions> <!--表头--> <Grid > <Grid.ColumnDefinitions> <ColumnDefinition Width="100" SharedSizeGroup="A"> </ColumnDefinition> <ColumnDefinition ></ColumnDefinition> <ColumnDefinition ></ColumnDefinition> </Grid.ColumnDefinitions> <Border VerticalAlignment="Center" > <TextBlock FontSize="15" VerticalAlignment="Center">用户名</TextBlock></Border> <Border Grid.Column="1"> <TextBlock VerticalAlignment="Center" FontSize="15">邮箱号</TextBlock> </Border> <Border Grid.Column="2"> <TextBlock VerticalAlignment="Center" FontSize="15">状态</TextBlock> </Border> <GridSplitter HorizontalAlignment="Right" Width="5" Background="Black" VerticalAlignment="Stretch" ></GridSplitter> <GridSplitter HorizontalAlignment="Right" Width="5" Background="Black" VerticalAlignment="Stretch" Grid.Column="1"></GridSplitter> </Grid> <!--数据--> <Grid Grid.Row="1" Background="White"> <Grid.ColumnDefinitions> <ColumnDefinition SharedSizeGroup="A"></ColumnDefinition> <ColumnDefinition ></ColumnDefinition> <ColumnDefinition ></ColumnDefinition> </Grid.ColumnDefinitions> <Border VerticalAlignment="Center" > <TextBlock FontSize="15" VerticalAlignment="Center">小明</TextBlock> </Border> <Border Grid.Column="1"> <TextBlock VerticalAlignment="Center" FontSize="15">1142105884@qq.com</TextBlock> </Border> <Border Grid.Column="2"> <TextBlock VerticalAlignment="Center" FontSize="15" >注销</TextBlock> </Border> </Grid> </Grid> 备注： Grid.IsSharedSizeScope="True" :允许尺寸共享 SharedSizeGroup="A" ：设置尺寸共享列 （哪一列和哪一列共享 [表头和数据列都得加]） //设置列拖动块 <GridSplitter HorizontalAlignment="Right" Width="5" Background="Black" VerticalAlignment="Stretch" ></GridSplitter>
复制代码
使用场景：无处不在，工具栏 ToolBar、菜单栏
缺点：不换行
- DockPanel 【容器】
通过Dock停靠进行布局。
附加属性：
DockPanel.Dock Top/
LastChildFill ：true/false 最后一个控件是否填充剩余的空间。```C# <DockPanel LastChildFill="True"> <Button Content="button1" DockPanel.Dock="Top"></Button> <Button Content="button2" DockPanel.Dock="Bottom"></Button> <Button Content="button3" ></Button> <Button Content="button4" DockPanel.Dock="Right"></Button> <Button Content="button5" ></Button> </DockPanel> 备注：DockPanel.Dock="Top" ：button 顶部 这个属性是DockPanel里面的。 LastChildFill="True" : 最后一个控件是否填充剩余的空间。
复制代码
使用场景：功能区域划分
<WrapPanel Orientation="Horizontal"> <Button Content="button" Width="100"></Button> <Button Content="button1" Width="150"></Button> <Button Content="button2" Width="50"></Button> <Button Content="button3" Width="80"></Button> </WrapPanel>
复制代码
<UniformGrid Rows="5" Columns="2"> <Button Content="button1"></Button> <Button Content="button2"></Button> <Button Content="button3"></Button> <Button Content="button4"></Button> <Button Content="button5"></Button> <Button Content="button6"></Button> <Button Content="button7"></Button> <Button Content="button8"></Button> <Button Content="button9"></Button> </UniformGrid>
复制代码
<Canvas > <Button Content="button1" Canvas.Top="200" ></Button> <Button Content="button2" Canvas.Top="20" Canvas.Left="400"></Button> <Button Content="button3"></Button> </Canvas>
复制代码
InkCanvas
支持任意笔画的输入控件
使用场景：画板
<InkCanvas EditingMode="Ink"> <InkCanvas.DefaultDrawingAttributes> <DrawingAttributes Color="Red" Width="10"></DrawingAttributes> </InkCanvas.DefaultDrawingAttributes> <Button Content="button1" InkCanvas.Top="50"></Button> <Button Content="button2" InkCanvas.Left="100"></Button> <Button Content="button3"></Button> </InkCanvas> EditingMode="Ink" 手写笔画 EditingMode="Select" 放大控件 EditingMode="GestureOnly" Strokes ：获取笔画 DefaultDrawingAttributes ：设置笔画的颜色与宽度
复制代码
Border
最基础的装饰控件
主要属性配置： CornerRadius 设置圆角
使用场景：绘制边线以及背景色 圆角 使用频繁
<Border CornerRadius="4"> <Grid> </Grid> </Border>
复制代码
扩展布局控件
TabControl TabItem TabPanel
Toolbar Panel ToolbarOverflowPanel
VirtualizingStackPanel（虚拟化的 StackPanel） 性能优
特殊容器
Scrollviewer
GroupBox
Expander
5、布局原理与自定义实践
从布局原理到布局过程
所有布局控件都有自己的特定方式
都是继承自 Panel
两个过程：测量+排列
评论