首页 > Linux操作系统 > Linux操作系统 > 使用WPF创建炫亮按钮
1. 创建三个按钮(创建多个按钮的目的是作对比及样式演示)
(1)打开Microsoft Expression Blend 2(我这里是August Preview版本,以下简称Blend)
(2)File -> New Project,默认选中的是第一个:WPF Applications(.exe),进行相关设置后按OK,如图:
(3)此时回到刚才创建位置C:\Books\ButtonDemos目录中查看时,文件结构如下图:
注意其中的App.xaml,Window1.xaml系列文件(此处之系列代表以之开头的所有文件,比如App.xaml, App.xaml.cs文件,下同)。
(4)在Blend操作窗右边的Project中将Window1.xaml更名为ButtonDemos.xaml,改名之后相应的cs文件也自动更改为新的文件名,比如ButtonDemos.xaml.cs。
(5)从左边工具箱中点击“Button”按钮,在中间内容区拖出一个按钮,同理,在右边Properties选项卡中将Name改为:btnDemo1, Common Properties项的Content框中输入"Demo 1",这将是按钮显示的文字内容。
(6)选中此按钮,按右键,点View Xaml,将看到如下代码:
(7)转到Design模式,选中刚才这个名为“btnDemo1”的按钮,复制,粘贴,拖动到下面位置,设置Name为:btnDemo2, Content: Demo 2;
(8)再重复步骤(7),做Demo 3按钮。
2、制作一个漂亮的按钮
(1)在Design模式下,选中刚才这个名为“btnDemo1”的按钮,复制,粘贴,拖动到右边位置,设置Name为:btnDemo1_Copy, Content: Demo 1 Copy;
(2)设置右边这个btnDemo1_Copy按钮:
在Properties选项卡中Brushes折叠选项内点击Backgound项,之后点击下面的Gradient Brush(再按照Photoshop做渐变画笔一样)选择/调整颜色设置,如下图:(如果你用过Photoshop,你会发现是何等的相似,而操作方法亦是如此)
在上图Options处选择Reflect(即保持其前面被勾选),得到如下按钮样式:
(3)让我们来看看这个按钮的代码:
(关于代码中的含义,以及如何使用C#代码一一实现它,我有时间的话,再一一道来,在此按下不表)
(4)如法炮制,制作另外一个按钮:
3、使用Application.Resources设置按钮属性(类似CSS样式单):
(1)定义Application.Resources块:打开 app.xaml 文件,我们可以看到里面有下面XML片段:
<!-- Resources scoped at the Application level should be defined here. -->
(2)将中间<!-- -->部分换成以下代码(敬请留意:其中黄色底且加粗的部分是上面第2步中(3)中按钮的XAML代码,但在标签的开头处加了一个x:Key的属性,其值是“GrayBlueGradientBrush”):
值得一提的是,x:Key用来是渐变画刷的唯一名称。
这里有必要解释一下红色文字部分中Style标记的内容:
首先,Style的TargetType属性值中“{}”括起的部分内容是要表明Style所要发挥作用的控件类型名称;其次,Style标签中,有一项
至此,完整的XAML内容为:
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
x:Class="ButtonDemos.Window1"
x:Name="Window"
Title="Window1"
Width="640" Height="480" Background="#FF000000">
(3)好了,按F5,得到下面的结果:
我们发现,所有只要是那些没有设置过Background属性的所有Button的背景全部换成了与Demo 1 Copy按钮一样的背景色了!
来自 “ ITPUB博客 ” ,链接:https://blog.itpub.net/14601556/viewspace-528480/ ,如需转载,请注明出处,否则将追究法律责任。