通过把定义的样式加入资源字典(Style.xaml)的方法大大方便的我们后续的工作,我们再次使用时只 有选择“样式库”标签就可以快速设置,同时有利于设计的统一性;
但是当我们尝试用我们定义的样式来填充一个按钮时,发现他还是白色的,几乎没什么变化:
(分别是:Border,Grid,Canvas,StackPanel,Button)
那么下面我们就来研究下 button的样式制作?
开始之前我们准备足够用的“库样式”;
在这里纠正一下我发现在新的方法来定义资源字典(我很菜的,也才研究,请原谅)
在填充后面会有一个小白色的框,点击以后里面有转换为新资源这一项
同时我们准备几个将要用到的“单色填充”,做完以后 ColorCard.xaml 页面是这样:
ColorCard.xaml代码:
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
Style.xaml代码:
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
这样我们的色卡就走完了,这个页面留着到时候参考用;
突然发现还没进入 关于 button 的主题,
》 1. 好新建一个 UserControlCard.xaml;
》 2. 从左边选择 button 工具创建一个button;
》 3. 选择这个button 从左上角依次点开到 》 编辑副本见下图:
确认后进入编辑页面:在左下角依次选择他们,然后在右边设置相应的画笔:(使用我们刚才定义的 资源库)
从上面下来,大概分别是(我也不太确定):
背景》
》 鼠标移动到上面时的动画
》 好像是类似于遮罩
文本》
不可用时》
获得焦点时》
最后效果看起来是这样:
如果不满意可以反复修改,(反复修改? 设计师的痛!):
》 选择按钮以后,
》 依次展开到编辑当前模板
恩,蓝色按钮就到这里,最重要是反复研究,而且最好编译一下在浏览器里面看实际鼠标动作的样子 !
放代码了:
UserControlCard.xaml
1
2
3
4
Style.xaml 中自动生成的:
01
谢谢收看~~~