原文:潜移默化学会WPF(绚丽篇)--热烈欢迎RadioButton，改造成功，改造成ImageButton，新版导航

本样式 含有  触发器 和 动画    模板  ，多条件触发器，还有布局

本人博客园地址  http://www.cnblogs.com/Fresh-Air/

前台样式 ，我精心设计的

        <Style x:Key="RDOButton" TargetType="{x:Type RadioButton}">

            <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>

            <Setter Property="Background" Value="White"/>

            <Setter Property="BorderThickness" Value=""/>

            <Setter Property="Cursor" Value="Hand"/>

            <Setter Property="Template">

                <Setter.Value>

                    <ControlTemplate TargetType="{x:Type RadioButton}">

                        <ControlTemplate.Resources>

                            <Storyboard x:Key="Storyboard1">

                                <ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)" Storyboard.TargetName="bd">

                                    <EasingColorKeyFrame KeyTime="" Value="White"/>

                                    <EasingColorKeyFrame KeyTime="0:0:0.3" Value="#FFAFAFAF"/>

                                </ColorAnimationUsingKeyFrames>

                            </Storyboard>

                            <Storyboard x:Key="Storyboard2">

                                <ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)" Storyboard.TargetName="bd">

                                    <EasingColorKeyFrame KeyTime="" Value="#FFAFAFAF"/>

                                    <EasingColorKeyFrame KeyTime="0:0:0.5" Value="#D3D3D3"/>

                                </ColorAnimationUsingKeyFrames>

                            </Storyboard>

                        </ControlTemplate.Resources>

                        <BulletDecorator Background="Transparent">

                            <Border x:Name="bd"  HorizontalAlignment="Center" Background="White" CornerRadius="">

                                <Border.OpacityMask>

                                    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">

                                        <GradientStop Color="Black" Offset=""/>

                                        <GradientStop Color="White" Offset=""/>

                                    </LinearGradientBrush>

                                </Border.OpacityMask>

                                <ContentPresenter Width="{TemplateBinding Width}" Height="{TemplateBinding Height}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>

                            </Border>

                        </BulletDecorator>

                        <ControlTemplate.Triggers>

                            <Trigger Property="IsEnabled" Value="false">

                                <Setter TargetName="bd" Property="Background" Value="gray" />

                            </Trigger>

                            <Trigger Property="IsChecked" Value="false">

                                <Setter TargetName="bd" Property="Background" Value="{x:Null}" />

                            </Trigger>

                            <Trigger Property="IsChecked" Value="true">

                                <Trigger.EnterActions>

                                    <BeginStoryboard x:Name="Storyboard2_BeginStoryboard" Storyboard="{StaticResource Storyboard2}"/>

                                </Trigger.EnterActions>

                                <Setter TargetName="bd" Property="Background" Value="#FF606060" />

                            </Trigger>

                            <MultiTrigger>

                                <MultiTrigger.EnterActions>

                                    <BeginStoryboard Storyboard="{StaticResource Storyboard1}"/>

                                </MultiTrigger.EnterActions>

                                <MultiTrigger.Conditions>

                                    <Condition Property="IsMouseOver" Value="True"/>

                                    <Condition Property="IsChecked" Value="False"/>

                                </MultiTrigger.Conditions>

                                <Setter TargetName="bd" Property="Background" Value="Red" />

                            </MultiTrigger>

                        </ControlTemplate.Triggers>

                    </ControlTemplate>

                </Setter.Value>

            </Setter>

        </Style>

调用，例如

如下：特帅

单用就是radiobutton

 <RadioButton Width="" Height="" Margin="2,5" Cursor="Hand" Name="yingyetingToolBarButton" VerticalAlignment="Top" Click="YingyetingToolBarButton_Click" Style="{DynamicResource RDOButton}" SnapsToDevicePixels="True">

                    <StackPanel HorizontalAlignment="Center">

                        <Image Width="" Height="" Margin="0,5" Source="/MPCR.Client;component/Images/yingyeting.png"/>

                        <TextBlock><Run Text="营业厅"/></TextBlock>

                    </StackPanel>

                </RadioButton>

这样就是一个toolbar了，自定义的

  <StackPanel Height="" Orientation="Horizontal" Focusable="True">

                <StackPanel.Background>

                    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">

                        <GradientStop Color="#FF727272" Offset="" />

                        <GradientStop Color="#FFFFFF" Offset="0.654" />

                        <GradientStop Color="#FEFEFE" Offset="" />

                        <GradientStop Color="#FFFFFFFB" Offset="0.994" />

                    </LinearGradientBrush>

                </StackPanel.Background>

                <RadioButton Width="" Height="" Margin="2,5" Cursor="Hand" Name="yingyetingToolBarButton" VerticalAlignment="Top" Click="YingyetingToolBarButton_Click" Style="{DynamicResource RDOButton}" SnapsToDevicePixels="True">

                    <StackPanel HorizontalAlignment="Center">

                        <Image Width="" Height="" Margin="0,5" Source="/MPCR.Client;component/Images/yingyeting.png"/>

                        <TextBlock><Run Text="营业厅"/></TextBlock>

                    </StackPanel>

                </RadioButton>

                <RadioButton Width="" Height="" Margin="2,5"  Cursor="Hand" Name="yingyechaxunToolBarButton" VerticalAlignment="Top" Click="YingyetingToolBarButton_Click" Style="{DynamicResource RDOButton}" SnapsToDevicePixels="True">

                    <StackPanel HorizontalAlignment="Center">

                        <Image Width="" Height="" Margin="0,5" Source="/MPCR.Client;component/Images/yingyechaxun.png"/>

                        <TextBlock><Run Text="营业查询"/></TextBlock>

                    </StackPanel>

                </RadioButton>

                <RadioButton Width="" Height="" Margin="2,5" Cursor="Hand" Name="jiaojiebanToolBarButton" VerticalAlignment="Top" Click="JiaojiebanToolBarButton_Click" Style="{DynamicResource RDOButton}" SnapsToDevicePixels="True">

                    <StackPanel HorizontalAlignment="Center">

                        <Image Width="" Height="" Margin="0,5" Source="/MPCR.Client;component/Images/jiaojieban.png"/>

                        <TextBlock><Run Text="交接班"/></TextBlock>

                    </StackPanel>

                </RadioButton>

                <RadioButton Width="" Height="" Cursor="Hand" Margin="2,5"  Name="caipinshezhiToolBarButton" VerticalAlignment="Top" Click="CaipinshezhiToolBarButton_Click" Style="{DynamicResource RDOButton}" SnapsToDevicePixels="True">

                    <StackPanel HorizontalAlignment="Center">

                        <Image Width="" Height="" Margin="0,5" Source="/MPCR.Client;component/Images/caipinshezhi.png"/>

                        <TextBlock><Run Text="菜品设置"/></TextBlock>

                    </StackPanel>

                </RadioButton>

                <RadioButton Width="" Height="" Cursor="Hand" Margin="2,5"  Name="tingshishezhiToolBarButton"  VerticalAlignment="Top" Click="TingshishezhiToolBarButton_Click"  Style="{DynamicResource RDOButton}" SnapsToDevicePixels="True">

                    <StackPanel HorizontalAlignment="Center">

                        <Image Width="" Height="" Margin="0,5" Source="/MPCR.Client;component/Images/tingshishezhi.png"/>

                        <TextBlock><Run Text="厅室设置"/></TextBlock>

                    </StackPanel>

                </RadioButton>

                <RadioButton Width="" Height="" Cursor="Hand" Margin="2,5"  Name="xiazaiToolBarButton"  VerticalAlignment="Top" Click="xiazaiToolBarButton_Click" Style="{DynamicResource RDOButton}" SnapsToDevicePixels="True">

                    <StackPanel HorizontalAlignment="Center">

                        <Image Width="" Height="" Margin="0,5" Source="/MPCR.Client;component/Images/jiaojieban.png"/>

                        <TextBlock><Run Text="更新菜品"/></TextBlock>

                    </StackPanel>

                </RadioButton>

                <RadioButton Width="" Height="" Cursor="Hand" Margin="2,5"  Name="exportToolBarButton"  VerticalAlignment="Top" Click="exportToolBarButton_Click" Style="{DynamicResource RDOButton}" SnapsToDevicePixels="True">

                    <StackPanel HorizontalAlignment="Center">

                        <Image Width="" Height="" Margin="0,5" Source="/MPCR.Client;component/Images/MakeupMenu.png"/>

                        <TextBlock><Run Text="制作菜谱"/></TextBlock>

                    </StackPanel>

                </RadioButton>

            </StackPanel>

个人非常喜欢，原创

效果图

最典型的应用 360 导航

自己感觉的，能做的，再和其他控件组合到一起，就帅了，是不是想到用它做个假的tab控件

潜移默化学会WPF(绚丽篇)--热烈欢迎RadioButton，改造成功，改造成ImageButton，新版导航的更多相关文章

  1. 潜移默化学会WPF(转载篇)--屏幕显示Label，鼠标移上去变成textBox

    原文:潜移默化学会WPF(转载篇)--屏幕显示Label,鼠标移上去变成textBox <Window x:Class="WpfApplication1.Window1" x ...

  2. 潜移默化学会WPF（难点控件treeview）--改造TreeView（CheckBox多选择版本），递归绑定数据

    原文:潜移默化学会WPF(难点控件treeview)--改造TreeView(CheckBox多选择版本),递归绑定数据 目前自己对treeview的感慨很多 今天先讲 面对这种 表结构的数据 的其中 ...

  3. WPF 精修篇 数据触发器

    原文:WPF 精修篇 数据触发器 数据触发器 可以使用Binding 来绑定控件 或者数据源 来触发相关动作 举栗子 <Window.Resources> <Style Target ...

  4. WPF 精修篇 动态资源

    原文:WPF 精修篇 动态资源 动态资源 使用 DynamicResource 关键字 静态 就是 StaticResource 原则上是 能用静态就用静态 动态会让前台界面压力很大~ 动态资源引用 ...

  5. 潜移默化学会WPF--值转换器

    原文:潜移默化学会WPF--值转换器 1. binding 后面的stringFormat的写法----连接字符串 <TextBlock Text="{Binding Path=Qty ...

  6. WPF 精修篇 属性触发器

    原文:WPF 精修篇 属性触发器 属性触发器是通过  某个条件触发改变属性 通过无代码实现功能 <Style TargetType="{x:Type Label}"> ...

  7. WPF 精修篇 样式继承

    原文:WPF 精修篇 样式继承 这个 是新知识 样式可以继承 <Style x:Key="TextBlockStyleBase" TargetType="{x:Ty ...

  8. WPF 精修篇 自定义控件

    原文:WPF 精修篇 自定义控件 自定义控件 因为没有办法对界面可视化编辑 所以用来很少 现在实现的是 自定义控件的 自定义属性 和自定义方法 用VS 创建自定义控件后 会自动创建 Themes 文件 ...

  9. WPF 精修篇 用户控件

    原文:WPF 精修篇 用户控件 增加用户控件 数据绑定还是用依赖属性 使用的事件 就委托注册一下 public delegate void ButtonClick(object b,EventArgs ...

随机推荐

  1. Win10安装后必做的优化，解决磁盘100%占用

    Win10安装后必做的优化,解决磁盘100%占用 01关闭家庭组 控制面板–管理工具–服务– HomeGroup Listener和HomeGroup Provider禁用. 02关闭磁盘碎片整理.自 ...

  2. Codeforces 138C(区间更新+离散化)

    题意:有n棵树在水平线上,给出每棵树的坐标和高度,然后向左倒的概率和向右倒的概率,和为1,然后给出了m个蘑菇的位置,每一个蘑菇都有一个魔法值,假设蘑菇被压死了,也就是在某棵树[a[i] - h[i], ...

  3. SAP 中的popup dialog (弹出对话框) 常见实现方法

      方法1: FM:POPUP_TO_CONFIRM(标准对话弹出消息) 有三个button:YES-NO-CANL,可进行对应的逻辑推断 可设定标题,描写叙述问题,不方便对文本进行换行等排版,不能改 ...

  4. html5-5 HTML5表单元素和内嵌框架

    html5-5   HTML5表单元素和内嵌框架 一.总结 一句话总结:单选框和多选框选的时候外面加label就可以实现选后面文字也可以选中了 1.html5如何实现文件上传? 必须加上enctype ...

  5. 关于IT增值服务"拜师学艺"价格调整的通知

    经过几天的探索,在与若干潜在付费客户交流的基础上,决定对IT增值服务"拜师学艺"价格进行调整. 当前价格:年费1000元,月付100元-1年付10个月. 2015年1月1日起,年费 ...

  6. Java中的浮点数-科学计数法-加减乘除

    上次,提到"元转分"这个浮点数问题,boss倾向于手动把1.23元这种格式,转换成123分.    但实际上,浮点数很容易遇到精度问题.    比如,System.out.prin ...

  7. Hive的日期函数

    1.unix时间戳转时间函数 语法: from_unixtime(bigint unixtime[, string format]) 返回值: string 说明: 转化UNIX时间戳(从1970-0 ...

  8. erlang局域网内节点通信——艰难四步曲

    http://blog.chinaunix.net/uid-22566367-id-382011.html 在Programming Erlang这本书中,在写到第十章中,主要实现的是不同节点之间的通 ...

  9. DYNAMIC CONTEXT SWITCHING BETWEEN ARCHITECTURALLY DISTINCT GRAPHICS PROCESSORS

    FIELD OF INVENTION This invention relates to computer graphics processing, and more specifically to ...

  10. 二分图之最小边覆盖（poj3020）

    题目:poj3020 题意:给出一个图,让你用最少的1*2的纸片覆盖掉图中的全部*出现过的地方. 基本裸的最小边覆盖. 分析: 最小边覆盖 = 点总数 - 最大匹配 所以就是转化为求最大匹配. 跟前面 ...