Microsoft Expression Blend 4制作简单的按钮
在博客园混了这么久了,第一次写博客。本人标准的理工男,文笔不敢说一般,只能用还学过语文。勉强达意而已。见笑!!
由于本人能有有限,错误之处在所难免,望大牛们批评指正,共同进步。^_^!!!!!!!!!!!!!!!!!!!!!!
觉得此篇博文对你有用,欢迎阅读,同时欢迎喜欢拍砖的同学。哥们脑袋硬。
书归正传,由于第一次写博客、加上个人技术有限,只能简单把自己曾经用的一些技术在这里做下简单的纪录。作为一个攻城狮,那就先慢慢的攻城吧,总有一天要成为狮!!嘿嘿
制作圆角的按钮:
step by step:建立wpf项目工程,首先在窗体上画一个矩形,设置其Fill为no brush,RadiusX、RadiusY的值2(圆角效果),右键选中矩形,构成控件,如下图:

在控件类型中选中Button,修改名称为myBtnStyle,确定。下面就来制作button的样式,鼠标滑动,点击的各种效果。

在上图的触发器选项卡下面有以上的触发事件,下面分别设置IsDefaulted,IsMouseOver,IsPressed来设置Button的默认、鼠标滑过、按下的样式。

IsDefaulted:设置如上图,背景填充为绿色,边框为无样式。
其他触发选项如IsDefaulted一样,设置自己喜欢的颜色。
设置完成活按F5,运行,看下效果:
默认:
鼠标滑过:
点击样式:
(运行点击没有虚线,截图就出现了,嘿嘿)
ok,一个简单的按钮的样式就写完了。
xaml代码如下:
<Style x:Key="myBtnStyle" TargetType="{x:Type Button}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition x:Name="columnDefinition1" Width="0.982*"/>
<ColumnDefinition x:Name="columnDefinition" Width="0.018*"/>
</Grid.ColumnDefinitions>
<Rectangle x:Name="rectangle" RadiusY="2" RadiusX="2" Stroke="{x:Null}" Fill="#FF0DAD5F" Grid.ColumnSpan="2"/>
<ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsFocused" Value="True">
<Setter Property="Stroke" TargetName="rectangle" Value="{x:Null}"/>
<Setter Property="Fill" TargetName="rectangle" Value="#FF0EED80"/>
</Trigger>
<Trigger Property="IsDefaulted" Value="True">
<Setter Property="Fill" TargetName="rectangle" Value="#FF0DAD5F"/>
<Setter Property="Stroke" TargetName="rectangle" Value="{x:Null}"/>
</Trigger>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Stroke" TargetName="rectangle" Value="{x:Null}"/>
<Setter Property="Fill" TargetName="rectangle" Value="#FF83D245"/>
</Trigger>
<Trigger Property="IsPressed" Value="True">
<Setter Property="Stroke" TargetName="rectangle" Value="{x:Null}"/>
<Setter Property="Fill" TargetName="rectangle" Value="#FF17D256"/>
<Setter Property="Width" TargetName="columnDefinition" Value="Auto"/>
<Setter Property="MinWidth" TargetName="columnDefinition" Value="0"/>
<Setter Property="Width" TargetName="columnDefinition1" Value="*"/>
</Trigger>
<Trigger Property="IsEnabled" Value="False">
<Setter Property="Stroke" TargetName="rectangle" Value="{x:Null}"/>
<Setter Property="Fill" TargetName="rectangle" Value="{x:Null}"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
就这样非常简单的Button样式就这样搞定了,第一次写,有点仓促,更有点无从下手,总算写了一篇了,哎,再接再厉吧!!!
Microsoft Expression Blend 4制作简单的按钮的更多相关文章
- 在Microsoft Expression Blend 2 中绘制圆角矩形按钮
原文:在Microsoft Expression Blend 2 中绘制圆角矩形按钮 /* 声明:转载请保留此信息:http://www.BrawDraw.com, http://www.ZPXP.c ...
- 在Expression Blend中制作侧面为梯形的类棱柱体
原文:在Expression Blend中制作侧面为梯形的类棱柱体 在上一篇"在WPF设计工具Blend2中制作立方体图片效果"( http://blog.csdn.net/joh ...
- WPF动画制作简单的按钮动画
主界面的代码 <StackPanel ButtonBase.Click="Grid_Click"> <Button Content="逐渐变大缩小&qu ...
- Motion Paths in WPF 4 using Expression Blend 4
原文 Motion Paths in WPF 4 using Expression Blend 4 Posted by: Pravinkumar Dabade , on 3/19/2011, in C ...
- Expression Blend制作自定义按钮(转)
来源:http://www.cnblogs.com/iChina/archive/2011/11/25/2262854.html Expression Blend制作自定义按钮 1.从Blend工具箱 ...
- WPF学习笔记-用Expression Blend制作自定义按钮
1.从Blend工具箱中添加一个Button,按住shift,将尺寸调整为125*125; 2.右键点击此按钮,选择Edit control parts(template)>Edit a cop ...
- Expression Blend创建自定义按钮
在 Expression Blend 中,我们可以在美工板上绘制形状.路径和控件,然后修改其外观和行为,从而直观地设计应用程序.Button按钮也是Expression Blend最常用的控件之一,在 ...
- 【全面解禁!真正的Expression Blend实战开发技巧】第七章 MVVM初体验-在DataGrid行末添加按钮
原文:[全面解禁!真正的Expression Blend实战开发技巧]第七章 MVVM初体验-在DataGrid行末添加按钮 博客更新较慢,先向各位读者说声抱歉.这一节讲解的依然是开发中经常遇到的一种 ...
- 零元学Expression Blend 4 - Chapter 47 超简单!运用StackPanel配合OpacityMask做出倒影效果
原文:零元学Expression Blend 4 - Chapter 47 超简单!运用StackPanel配合OpacityMask做出倒影效果 有网友问我如何在Blend内制作出倒影效果 我提供了 ...
随机推荐
- jQuery moblie 配合jQuery 实现移动端下拉刷新
<script type="text/javascript" src="http://bj.jiaju001.com/static/js/jquery-1.9.0. ...
- 第一节:Maven 下载,安装和配置
Maven是Apache的一个产品所以要下载Maven的话可以到https://www.apache.org网站上下载 进入到APache这个网站后看一下几部操作 第一: 选择点击导航栏上面的proj ...
- 关于直接创建视图UITableViewController显示(初学)
今天渣渣想直接创建一个UITableView视图作为根视图来用结果发现有警告,才明白TableView和view是不能直接作为根视图的,需要放在ViewController上.做个笔记详细了解下. 参 ...
- poj 2446 二分图最大匹配
思路:由(i+j)为偶数的点向(i+j)为奇数的点建边.求一次最大匹配,若正好为空格数(不包含洞)的一半,即输出YES. #include<iostream> #include<cs ...
- SQLite的查询
using System;using System.Collections.Generic;using System.ComponentModel;using System.Data;using Sy ...
- Linux 命令 - at: 在指定的时间执行任务
在指定的时间执行任务. 命令格式 at [-V] [-q queue] [-f file] [-mldbv] TIMEat [-V] [-q queue] [-f file] [-mldbv] -t ...
- HTTP - 持久连接
Web 客户端经常会打开到同一个站点的连接.比如,一个 Web 页面上的大部分内嵌图片通常都是来自同一个 Web 站点,而且相当一部分指向其他对象的超链接通常都指向同一个站点.因此,初始化了对某服务器 ...
- web工程中URL地址的写法
在开发中我们不可避免的要碰到许多需要写URL地址的情况,这常常让我们感到头疼.下面笔者推荐一种简单的做法.URL地址分为绝对路径和相对路径两种.相对路径又分为相对资源路径和相对根路径.显然绝对路径在开 ...
- android输入框显示在软键盘上边
有时候在界面需要输入的时候,如果输入框在界面的下方,软键盘弹出的时候会遮挡输入框界面,对用户的体验不是很好. 在网上找的别人的解决方案 首先: 清单文件里面配置:android:windowSoftI ...
- Entity Framework 6.1-Database First介绍
原文:Entity Framework 6.1-Database First介绍 这种方式是比较传统的以数据库为核心的开发模式.比较适合有数据库DBA的团队.或者数据库已存在的情况. 优缺点: 1.优 ...