原文:潜移默化学会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. 【48.47%】【POJ 2524】Ubiquitous Religions

    Time Limit: 5000MS Memory Limit: 65536K Total Submissions: 32364 Accepted: 15685 Description There a ...

  2. Intent七在属性之一:ComponentName 分类： H1_ANDROID 2013-11-10 10:54 1184人阅读 评论(1) 收藏

    注:在<疯狂android讲义>中,此属性称为Component,官方文档中称为ComponentName. 1.The name of the component that should ...

  3. XxPay支付系统-boot版本了解一下

    了解一下 之前看了龙果支付系统,也没看透,用公司框架改写,然后就改的比较乱

  4. jquery中ajax中post方法（多学习：洞悉原理，触类旁通）（函数封装思想）

    jquery中ajax中post方法(多学习:洞悉原理,触类旁通)(函数封装思想) 一.总结 1.多看学习视频:洞悉原理,触类旁通, 2.函数封装:$.post(URL,data,callback); ...

  5. 使用Kotlin开发Android

    查看我的所有开源项目[开源实验室] 欢迎增加我的QQ群:[201055521],本博客client源代码下载[请点击] 摘要 我首先声明我并没有使用Kotlin非常长时间,我差点儿是在学习的同一时候写 ...

  6. springMVC中前台ajax传json数据后台controller接受对象为null

    在jquery的ajax中,如果没加contentType:"application/json",那么data就应该对应的是json对象,反之,如果加了contentType:&q ...

  7. [NativeScript] Style NativeScript views using the default core theme

    The default core theme comes preinstalled and ready to go with every new project. Learn how to use s ...

  8. JS类型转换规则详解

    JS类型转换规则详解 一.总结 一句话总结:JS强制类型转换中的类型名强制类型转换和其它语言不同,是类型类的构造方法,Number(mix) 一句话总结(JS类型本质):因为js是弱类型语言,所以它相 ...

  9. ios9 xcode7以后编译需要进行的几项设置

    http://blog.csdn.net/hero82748274/article/details/48629461 1.库后缀变了:.dylib->tbd libsqlite3.0.dylib ...

  10. 【基础练习】【线性DP】codevs1576 最长严格上升子序列题解

    连题目都不放了,就是标题中说的那样.裸题 于是直接上代码 暑假要来了 好好学习 --炉火照天地,红星乱紫烟. 赧郎明月夜.歌曲动寒川.