WPF常用控件应用demo
WPF常用控件应用demo
一、Demo
1、Demo截图如下：
2、demo实现过程
- 总体布局：因放大缩小窗体，控件很根据空间是否足够改变布局，故用WrapPanel布局。
<ScrollViewer BorderBrush="BlueViolet">
<WrapPanel Margin="40,0,0,40">
</WrapPanel>
</ScrollViewer>
- 窗体资源：同一种控件多处使用会有重复代码，为减少代码冗余，在窗体资源中设置控件Style。在这里给出demo中的Button和ListBox控件的Style。
<Window.Resources>
<Style TargetType="Button"
x:Key="ButtonStyle">
<Setter Property="Width"
Value="" />
<Setter Property="Margin"
Value="0,15,0,0" />
<Setter Property="BorderBrush"
Value="CornflowerBlue" />
<Setter Property="Background">
<Setter.Value>
<LinearGradientBrush StartPoint="1,0"
EndPoint="0,1">
<GradientStop Color="Aqua"
Offset="0.0" />
<GradientStop Color="BlueViolet"
Offset="0.55" />
<GradientStop Color="White"
Offset="1.0" />
</LinearGradientBrush>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="ButtonColorStyle"
TargetType="Button"
BasedOn="{StaticResource ButtonStyle}">
<!--修改模板属性-->
<Setter Property="Template">
<Setter.Value>
<!--控件模板-->
<ControlTemplate TargetType="Button">
<Border x:Name="back"
Opacity="0.8"
CornerRadius=""
Background="{TemplateBinding Background}"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}">
<!--控件阴影效果-->
<Border.BitmapEffect>
<DropShadowBitmapEffect Color="BlueViolet"
ShadowDepth=""
Softness="0.8"
Noise=""
Opacity=""
Direction="" />
</Border.BitmapEffect>
<Border x:Name="fore"
BorderThickness=""
CornerRadius="">
<!--按钮内容-->
<ContentPresenter x:Name="content"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Content="{TemplateBinding Content}">
<ContentPresenter.BitmapEffect>
<DropShadowBitmapEffect Color="Blue"
Direction=""
ShadowDepth=""
Softness="0.1"
Opacity="0.3" />
</ContentPresenter.BitmapEffect>
</ContentPresenter>
</Border>
</Border>
<!--触发器-->
<ControlTemplate.Triggers>
<!--鼠标移入移出-->
<Trigger Property="IsMouseOver"
Value="True">
<Trigger.EnterActions>
<BeginStoryboard HandoffBehavior="Compose">
<Storyboard>
<DoubleAnimation To=""
Duration="0:0:0.1"
Storyboard.TargetName="back"
Storyboard.TargetProperty="Opacity" />
<ColorAnimation To="LawnGreen"
BeginTime="0:0:0.2"
Duration="0:0:0.2"
Storyboard.TargetName="back"
Storyboard.TargetProperty="(Border.BitmapEffect).(DropShadowBitmapEffect.Color)" />
<DoubleAnimation To="0.4"
Duration="0:0:0.2"
Storyboard.TargetName="back"
Storyboard.TargetProperty="(Border.BitmapEffect).(DropShadowBitmapEffect.Softness)" />
</Storyboard>
</BeginStoryboard>
</Trigger.EnterActions>
</Trigger>
<!--按钮按下弹起-->
<Trigger Property="IsPressed"
Value="True">
<Trigger.EnterActions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimation To="0.6"
Duration="0:0:0.3"
Storyboard.TargetName="back"
Storyboard.TargetProperty="Opacity" />
<ColorAnimation To="Red"
Duration="0:0:0.1"
Storyboard.TargetName="back"
Storyboard.TargetProperty="(Border.BitmapEffect).(DropShadowBitmapEffect.Color)" />
<DoubleAnimation To="0.2"
Duration="0:0:0.1"
Storyboard.TargetName="back"
Storyboard.TargetProperty="(Border.BitmapEffect).(DropShadowBitmapEffect.Softness)" />
</Storyboard>
</BeginStoryboard>
</Trigger.EnterActions>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style> <Style TargetType="ListBox"
x:Key="ListBoxStyle">
<Setter Property="Margin"
Value="0,0,40,0" />
<Setter Property="BorderBrush"
Value="White" />
</Style>
</Window.Resources>
- 控件使用，调用资源。在此只给出Button、ListView和DataGrid结合使用的代码，Button控件是包含在ListBox里面的。
<ListBox Style="{StaticResource ListBoxStyle}">
<Label Style="{StaticResource LableStyle}"
Content="Button" />
<Button Content="Hover"
Click="BtnHover"
ClickMode="Hover"
Command="{Binding HoverCommand}"
Style="{StaticResource ButtonStyle}"></Button>
<Button Content="Press"
Click="BtnPress"
ClickMode="Press"
Command="{Binding PressCommand}"
Style="{StaticResource ButtonStyle}"></Button>
<Button Content="Release"
Click="BtnRelease"
ClickMode="Release"
Command="{Binding ReleaseCommand}"
Style="{StaticResource ButtonStyle}"></Button>
<Button IsDefault="True"
Content="Default"
Style="{StaticResource ButtonStyle}"></Button>
<Button IsEnabled="False"
Content="Disabled"
Style="{StaticResource ButtonStyle}"></Button>
<Button Content="Color"
Style="{StaticResource ButtonColorStyle}"></Button>
</ListBox> <ListBox Style="{StaticResource ListBoxStyle}">
<Label Style="{StaticResource LableStyle}"
Content="ListView***DataGrid" />
<ListView>
<Grid>
<DataGrid Name="Data"
Width=""
Height=""
Margin=""
CanUserAddRows="False"
AutoGenerateColumns="False"
Style="{StaticResource DataGridStyle}"
ItemsSource="{Binding}">
<DataGrid.Columns>
<DataGridTextColumn Header="Name"
Binding="{Binding Name}" />
<DataGridTextColumn Header="Description"
Binding="{Binding Description}" />
<DataGridComboBoxColumn Header="Sex"
SelectedItemBinding="{Binding Sex}"
ItemsSource="{Binding Source={StaticResource sexEnum}}" />
<DataGridCheckBoxColumn Header="CheckBox"
Binding="{Binding CheckBox}" />
<DataGridHyperlinkColumn Header="Email"
Binding="{Binding Email}" />
</DataGrid.Columns>
<DataGrid.CellStyle>
<Style TargetType="DataGridCell">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="DataGridCell">
<TextBlock TextAlignment="Center"
VerticalAlignment="Center">
<ContentPresenter />
</TextBlock>
</ControlTemplate>
</Setter.Value>
</Setter>
<Style.Triggers>
<Trigger Property="IsSelected"
Value="True">
<Setter Property="Foreground"
Value="Black" />
</Trigger>
</Style.Triggers>
</Style>
</DataGrid.CellStyle>
<DataGrid.RowStyle>
<Style TargetType="{x:Type DataGridRow}">
<Setter Property="Background"
Value="#F2F2F2" />
<Setter Property="Height"
Value="" />
<Setter Property="Foreground"
Value="Black" />
<Style.Triggers>
<!--隔行换色-->
<Trigger Property="AlternationIndex"
Value="">
<Setter Property="Background"
Value="#e7e7e7" />
</Trigger>
<Trigger Property="AlternationIndex"
Value="">
<Setter Property="Background"
Value="#f2f2f2" />
</Trigger>
<Trigger Property="IsMouseOver"
Value="True">
<Setter Property="Background"
Value="LightGray" />
</Trigger>
<Trigger Property="IsSelected"
Value="True">
<Setter Property="Foreground"
Value="Black" />
</Trigger>
</Style.Triggers>
</Style>
</DataGrid.RowStyle>
</DataGrid>
</Grid>
</ListView>
</ListBox>
二、控件
1、WrapPanel布局控件：可以实现当空间不足时子控件自动往下一行布局，空间充足时又会自动调整行布局。常用布局控件还有StackPanel（设置其子元素是垂直排列还是水平排列）、Grid（通过定义行和列来绘制出一个表格）、Canvas（通过指定相对于其的坐标来指定子控件的位置）、DockPanel（设置其子元素如何停靠，DockPanel.Left、DockPanel.Right、DockPanel.Top、DockPanel.Bottom）。
2、ScrollViewer：滚动条，当内容显示不完整时可以通过滚动条查看余下内容。
3、ListBox：队列布局控件，可在其中添加队列内容，绑定数据，也可实现分页效果，也可添加其余控件。
4、Label：文本显示控件，快速获取少量数据。
5、Button：按钮控件，四种状态ClickMode：Hover：鼠标悬停在按钮上方引发单击事件；
Press：当单击按钮时引发单击事件；
Release：被按下然后松开时发生单击事件，默认为此。
6、CheckBox：bool，选择按钮，默认不选择，通过IsChecked="True"使其默认选择，Indeterminate达到选择按钮模糊。
7、RadioButton：与CheckBox类似，一般用于单选。
8、TextBox：文本显示，与Lable类似，但Lable不可用户不可在界面编辑，TextBox默认用户可编辑，也可设置为只读。
9、Password：密码显示框，输入字符后默认显示“*”。
10、DatePicker：日期控件，选择日期。
11、Calendar：日历控件，选择日期。
12、Slider：滑块，Slider控件继承自RangeBase类型，同继承自RangeBase的控件还有ProgressBar和ScrollBar，这类控件都是在一定数值范围内表示一个值的用途。
13、ToolBar：工具条，是一组通常在功能上相关的命令或控件的容器，在ToolBar中可添加button、textbox、image、comboBox等等控件。
14、TreeViewStyle：树形控件，可在其中添加节点。
15、DataGrid：数据表控件，表头数据类型有DataGridTextColumn、DataGridComboBoxColumn、DataGridCheckBoxColumn、DataGridHyperlinkColumn，其属性设置比较多，如SelectionUnit：包含Cell、FullRow 和CellOrRowHeader 三种单元选择模式。 Cell：选择单元格；FullRow：选择全行；CellOrRowHeader：可选择单元格，也可以通过点击行首选择全行。
16、Style：风格，可以使用Style来设置控件的某些属性值，并使该设置影响到指定范围内的所有该类控件或影响指定的某一控件。
附上控件之间继承关系图一张：
- 小结：Style、Template结合的灵活使用可以很好的改变控件样式，而变成你想要的样式。控件与控件之间的合理搭配是为了更好地展现界面。鄙人因初学WPF，不足之处请批评指正。
WPF常用控件应用demo的更多相关文章
- WPF常用控件样式( 内含一简单插件式开发示例)
最近离职,离职前面的一份外派然后又外包的工作,总觉得不妥,之后外派的办个入职手续都一再失约,干脆推了.恰逢清明时节,暴雨纷纷,于是打算先休息休息调整下状态,工作的事情还是谨慎点的好,免得影响心情.话说 ...
- WPF常用控件样式集锦
1.不规则形状按钮(通过更改path实现) <Style x:Key="ButtonStyleForPath" TargetType="{x:Type Button ...
- WPF 10天修炼 第六天- 系统属性和常用控件
WPF系统属性和常用控件 渐变的背景色 WPF中的前景色和背景色不同于传统Winform的设置,这些属性都是Brush类型的值.在XAML中,当为这些属性设置指定的颜色后将被转换为SolidColor ...
- WPF布局控件常用属性介绍
WPF布局控件常用属性介绍 其它 | 作者:慧都控件网 | 2011-04-06 13:41:57| 阅读 0次 有用(0) 评论(0) 概述:WPF布局控件都是派生自System.Windows ...
- Windows Phone开发（11）：常用控件（下）
原文:Windows Phone开发(11):常用控件(下) WP控件大部分都可以从Silverlight中继承过来,这里我也只能拿一部分作演示,对于其它控件如何使用,可以参考SDK相关说明以及Sil ...
- Windows Phone开发（10）：常用控件（上）
原文:Windows Phone开发(10):常用控件(上) Windows Phone的控件有几个来源,和传统的桌面应用程序开发或Web开发一样,有默认提供的控件和第三方开者发布的控件.一般而言,如 ...
- 两款不同应用场景的Wpf分页控件
简介 今天给大家分享两个Wpf分页控件,本篇博客主要介绍一些实现思路和使用方法,具体实现和应用代码请参考文末的Demo链接 废话不多说,先看一下效果~ (两款控件显示效果是一样的) 实现思路 一款控件 ...
- C# WPF DataGrid控件实现三级联动
利用DataGrid控件实现联动的功能,在数据库客户软件中是随处可见的,然而网上的资料却是少之又少,令人崩溃. 本篇博文将介绍利用DataGrid控件模板定义的三个ComboBox实现“省.市.区”的 ...
- Android音乐、视频类APP常用控件：DraggablePanel（2）
Android音乐.视频类APP常用控件:DraggablePanel(2) 附录文章1主要演示了如何使用DraggablePanel 的DraggableView.DraggablePanel ...
随机推荐
- tcp/ip体系-转载
如果还想在测试这条路上继续走下去的话,那么下面这些东西就是我们必须去掌握的,至少你还不想止步于简单的黑盒测试--其实,一直想去接触Linux下的应用测试,这样能学到东西会很多,而且会非常的受用.之前听 ...
- POJ 3186Treats for the Cows (区间DP）
详见代码 #include <stdio.h> #include <algorithm> #include <string.h> using namespace s ...
- JavaScript高级程序设计46.pdf
鼠标按钮 只有在主鼠标按钮被单击(或键盘回车键被按下)是才会触发click事件,对于mousedown和mouseup事件,其event对象存在一个button属性,表示按下或者释放按钮.DOM的bu ...
- Velocity 的工作原理
原文出处:http://www.blogjava.net/jackybu/articles/8803.html 这个程序很简单,但是它能让你清楚的了解Velocity的基本工作原理.程序中其他部分基本 ...
- Junit 断言 assertThat Hamcrest匹配器
junit断言总结本文参考了http://blog.csdn.net/wangpeng047/article/details/9628449一 junit断言1.JUnit框架用一组assert方法封 ...
- 微信小程序正式发布！这是最全的上手指南
2017 年 1 月 9 日,是一个值得载入互联网史册的日子. 这一天,零点刚过,张小龙和他的团队,在夜色笼罩下,正式发布了微信小程序. 所以,从这一刻开始,只要有开发者登录小程序后台,并在「开发管理 ...
- Android基础知识回顾
- 普通身份运行Tomcat
普通身份运行Tomcat 转载1 权限分配问题 su - username -c “command”这样的形式可以使用任意一个有执行权限的用户执行 -c后边的命令. 注意,- username中间 ...
- angularjs开发常见问题-1（持续更新中...）
angularJs中学习中- 1.刷新当前页面数据:$state.reload service.create(data).then(function (newItem) { flash.success ...
- Oracle约束操作
约束的概念: 约束是在表中定义的用于维护数据库完整性的一些规则.通过为表中的字段定义约 束,可以防止将错误的数据插入到表中. 注意: 1.如果某个约束只作用于单独的字段,既可以在字段级定义约束,也可以 ...