对于开发Windows Phone和Store应用程序的开发者来说,创建自己的控件是一个令人兴奋的挑战。本文将指导如何使用Expressions Blend和Expressions Design工具来开发一个自定义评分控件,并添加自定义属性,以便初学者也能轻松上手。
在开始构建自定义控件之前,首先需要进行头脑风暴,草拟一个大致的设计图。分析需求,确定功能。制作一个草稿,然后开始开发。
正如一句谚语所说:“可以一口一口地吃掉一头大象。”将控件分解成子部分,例如在评分控件中,它包含一个滑块和5个星星,这些星星将决定评分的值。
每个自定义控件都需要一些自定义属性。在例子中,这是评分值。收集需求,并记录下控件可能需要的属性。
Expressions Design是微软推出的设计工具,类似于Adobe的Photoshop。推荐使用它,因为它是Expressions家族的一部分。
“由于Expressions Design是Expressions家族的一部分,如果Blend知道XAML,Design也知道XAML。在Expressions Design中创建的形状,可以直接复制其XAML并粘贴到Visual Studio或Expressions Blend中。”
对于控件,需要绘制星星,实际上是5个星星并排对齐。为此,使用了Expressions Design中的多边形工具。
当点击它时,它允许绘制一个多边形。首先,当绘制多边形时,会发现它绘制的是一个三角形。需要改变它的边数和内部深度,以便它绘制出星星的形状。
如上图所示,绘制了一个星星,现在使用这个星星并粘贴它的四个副本。
Expressions Design的一个非常有用的功能是,可以制作复合路径,因为在Expressions Design中绘制的每个形状都是一个路径,所以可以将所有星星制作成一个单一的复合路径。
现在需要给它一个渐变色,并管理它,使得两个颜色停止点在同一位置,就像在上图中看到的那样,它看起来像一个实心填充的颜色。
现在只需按下:Ctrl + Shift + C,复制XAML,然后可以将XAML粘贴到Expressions BLEND中。
现在已经准备好设计控件,已经准备好了所有的工件和绘制的形状,现在是Blend让开发者的生活变得轻松的时候了。
转到主网格的代码部分,按Ctrl + V粘贴控件,将能够看到控件,它是5个星星,带有颜色。
要将形状制作成用户控件,首先需要给星星上色,以便它更易于查看,因为黑色会造成混淆。将其着色为绿色。
现在在网格中放置一个滑块,以便根据滑块的值,星星的颜色会移动。
“这就是将渐变颜色的两个停止点都设置为相同的原因。”
创建滑块后,需要将渐变的数据绑定与滑块的值绑定,只需右键单击停止点,然后单击创建数据绑定,然后轻松选择属性。
需要为两个渐变停止点都这样做。下一步是根据评分操作滑块,即:
Step frequency = 0.1
Maximum = 1
Minimum = 0
这样它就变得流畅,用户更容易判断值,它将使UX(用户体验)更好。
不需要为这个创建用户控件文件,因为Blend让开发者的生活更轻松,只需要做简单的两次点击。
选择滑块和星星,然后右键单击。
然后单击制作成用户控件。
到目前为止,控件工作正常,但需要创建它的用户控件,这样就可以一次又一次地在许多项目中使用它。
正如看到的,控件工作得很好,但现在是添加自己的属性的时候了,它将是滑块值,它将出现在控件的属性中。
猜怎么实现的?
数据绑定?不!
MVVM?不!
在C#.NET中有一件非常神奇的东西,可以用它来提高控件中的自定义属性。这被称为“依赖属性”。
简单的两行代码就完成了工作。
将提高一个“滑块值”的属性,然后将其绑定到滑块。当创建一个自定义控件时,它为创建了两个文件。
Control.xaml和Control.xaml.cs。现在是时候写一点代码了。不需要切换到VS,可以在Expressions Blend中编写。
这是DEPENDENCY PROPERTY(MSDN文档)的文档:
这是一小段写的代码,现在让将其绑定到滑块。
转到Control中的Slider,在属性中的值,单击绑定框,然后单击创建数据绑定,就像在第一部分中为绑定渐变所做的那样。单击“自定义控件”,将找到一个名为“Slider Value”的属性。
将滑块的值绑定到那个属性上。恭喜,完成了!
哎呀,这是什么??
当转到MainPage.xaml时,它给一个警告之类的东西,嗯,不用担心。只需构建它。Expressions Blend解决方案需要经常构建。如果发现错误,第一件事就是构建解决方案。
现在可以使用控件了,因为它现在在资产中可用:
想用多少次就用多少次。
是的,如果开发了一个非常好的控件,可以导出它。怎么做?必须做所有相同的步骤,但不要创建电话或商店应用程序,而是创建Control Library项目。添加控件文件,复制已经制作的控件。在发布模式下构建它。
哇啦!现在在项目的Bin文件夹中有一个.dll文件。使用它并享受它,如果有人喜欢它,就给他.dll。
现在使用Expressions Blend创建自定义控件真的很容易。制作自己的自定义控件,使用自己的自定义属性。在项目中使用它们,让用户和开发者都感到惊讶。希望发现今天的文章真的很有趣。不要忘记在评论中给出反馈。