动手试验：创建变换按钮
.png "此页仅适用于 WPF 项目")
可根据用户交互来更改按钮的外观，从而在按钮模板中创建变换效果。除了触发动画时间线或触发属性更改来产生变换效果以外，还可以按照以下操作步骤创建多个“网格”面板，以分别代表按钮的每个状态，然后切换各个“网格”面板的“Visibility”属性。
在按钮上创建变换效果
在 Microsoft Expression Blend 中，在美工板上绘制“SimpleButton”。
.gif "提示")
提示：“资源库”
.png "Cc294737.0224cabd-5da1-4e01-bddd-4a647401a098(zh-cn,Expression.10).png")
中的“控件”选项卡的“简单样式”类别中提供了简单样式控件。从列表中选择简单样式控件后，即可在美工板上进行绘制。在“对象和时间线”下右键单击该按钮，指向“编辑控件部件(模板)”，然后单击“编辑模板”。如果不希望更改 SimpleStyles.xaml 资源字典，则可以单击“编辑副本”而不是“编辑模板”，以创建新模板并将其保存到文档中。有关创建副本的详细信息，请参阅创建资源。
提示：若要退出模板编辑模式并返回到文档范围：请单击位于“交互”面板中的元素树上方的“范围上移”
.png "Cc294737.55844eb3-ed98-4f20-aa66-a6f5b23eeb2b(zh-cn,Expression.10).png")
按钮。若要返回到现有模板的模板编辑模式：请在“对象和时间线”下，右键单击要编辑其模板的元素，指向“编辑控件部件(模板)”，然后单击“编辑模板”。
在控件模板的编辑范围中，删除“Grid”的“Border”子元素。
双击“Grid”元素将其激活，以便您可以添加子元素。
从“工具栏”中，将三个“Grid”控件
.png "Cc294737.a87ee957-7fbf-4135-a6ab-6de7e63160aa(zh-cn,Expression.10).png")
添加到模板的网格中。双击“工具箱”中的 Grid 图标，再在“对象和时间线”下右键单击每个 Grid 控件，指向“自动调整大小”，然后单击“填充”，即可快速添加它们。右键单击“ContentPresenter”元素，指向“排序”，然后单击“置于顶层”，以将 ContentPresenter 放到新的“Grid”对象之前。
在“对象和时间线”下，右键单击每个新的网格对象，然后单击“重命名”，以将这些对象分别重命名为“Default”、“Pressed”和“MouseOver”。
若要设置触发器行为，需要让每个触发器仅显示一个网格对象。例如，在“交互”面板中的“触发器”下选择“Default”，然后在按住 Ctrl 键的同时单击“Pressed”和“MouseOver”网格对象，即可选择这些对象。然后，在“属性”面板的“外观”下，将“Visibility”属性设置为“Hidden”。
在“交互”面板中的“触发器”下单击“IsMouseOver = True”，选择“Pressed”和“Default”网格对象，然后在“属性”面板的“外观”下，将“Visibility”属性设置为“Hidden”。
最后，在“触发器”下选择“IsPressed = True”后，选择“MouseOver”和“Default”网格对象，然后在“属性”面板中的“外观”下，将“Visibility”属性设置为“Hidden”。
此时便可以设计每个网格对象，以便在不同的情况下显示这些对象。可以使用绘图工具和动画时间线来创建独特的按钮行为。若要在设计某个网格对象时隐藏其他网格对象，可以在“对象和时间线”下，单击其他网格对象旁边的“隐藏/显示”
.png "Cc294737.3df73f86-a06e-4df8-b696-261c23fac3cc(zh-cn,Expression.10).png")
按钮。测试应用程序 (F5) 以查看效果。