分享一个以前项目中用到的简单的TabItem样式。

效果图如下:

        <SolidColorBrush x:Key="TabItemDisabledBackground" Color="#F4F4F4"/>
<SolidColorBrush x:Key="TabItemDisabledBorderBrush" Color="#FFC9C7BA"/> <Style TargetType="{x:Type TabItem}">
<!--<Setter Property="FocusVisualStyle" Value="{x:null}"/>-->
<Setter Property="Foreground" Value="#333333"/>
<Setter Property="FontSize" Value="16"/>
<Setter Property="BorderBrush" Value="{StaticResource TabControlNormalBorderBrush}"/>
<Setter Property="Background" Value="{StaticResource ButtonNormalBackground}"/>
<Setter Property="HorizontalContentAlignment" Value="Stretch"/>
<Setter Property="VerticalContentAlignment" Value="Stretch"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type TabItem}">
<Grid SnapsToDevicePixels="true" Height="40" MinWidth="110">
<Path Margin="0 0 0 -12" x:Name="PATH" Visibility="Collapsed" Data="M0.5,0.5 L109.5,0.5 109.5,39.5 64,40 57,51 49,40 0.5,39.5 z" Fill="#FF0FAF46" Height="51.5" Stretch="Fill" Stroke="Transparent" Width="110"/>
<Border x:Name="Bd" Background="#dfe9f6">
<ContentPresenter Margin="5 0 5 0" x:Name="Content" ContentSource="Header" HorizontalAlignment="{Binding HorizontalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{Binding VerticalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}"/>
</Border>
</Grid>
<ControlTemplate.Triggers>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsSelected" Value="true"/>
<Condition Property="TabStripPlacement" Value="Top"/>
</MultiTrigger.Conditions>
<Setter Property="Visibility" Value="visible" TargetName="PATH"/>
<Setter Property="Foreground" Value="White"></Setter>
<Setter Property="Background" Value="#FF0FAF46" TargetName="Bd"/>
</MultiTrigger>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Background" TargetName="Bd" Value="{StaticResource TabItemDisabledBackground}"/>
<Setter Property="BorderBrush" TargetName="Bd" Value="{StaticResource TabItemDisabledBorderBrush}"/>
<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>

  这里只实现了标签方向在Top的实现,其它动画或者显示效果都是可以随意增加的!

一个简单的TabItem样式。的更多相关文章

  1. WPF一个简单的垂直菜单样式的实现

    以前制作类似于垂直菜单功能的控件我都是Listbox和一个Popup实现的,今天尝试着用Menu做了一个简单垂直菜单,就当是做了个小练习写了这篇随笔~: 有什么不对的地方希望大家指正,分享和记录也是一 ...

  2. Prism for WPF 搭建一个简单的模块化开发框架(三) 给TreeView加样式做成菜单

    原文:Prism for WPF 搭建一个简单的模块化开发框架(三) 给TreeView加样式做成菜单 昨天晚上把TreeView的样式做了一下,今天给TreeView绑了数据,实现了切换页面功能 上 ...

  3. Expression Blend4经验分享:制作一个简单的图片按钮样式

    这次分享如何做一个简单的图片按钮经验 在我的个人Silverlight网页上,有个Iphone手机的效果,其中用到大量的图片按钮 http://raimon.6.gwidc.com/Iphone/de ...

  4. 如何开发一个简单的HTML5 Canvas 小游戏

    原文:How to make a simple HTML5 Canvas game 想要快速上手HTML5 Canvas小游戏开发?下面通过一个例子来进行手把手教学.(如果你怀疑我的资历, A Wiz ...

  5. 使用MongoDB和JSP实现一个简单的购物车系统

    目录 1 问题描述  2 解决方案  2.1  实现功能  2.2  最终运行效果图  2.3  系统功能框架示意图  2.4  有关MongoDB简介及系统环境配置  2.5  核心功能代码讲解  ...

  6. 自己动手模拟开发一个简单的Web服务器

    开篇:每当我们将开发好的ASP.NET网站部署到IIS服务器中,在浏览器正常浏览页面时,可曾想过Web服务器是怎么工作的,其原理是什么?“纸上得来终觉浅,绝知此事要躬行”,于是我们自己模拟一个简单的W ...

  7. 无聊的人用JS实现了一个简单的打地鼠游戏

    直入正题,用JS实现一个简单的打地鼠游戏 因为功能比较简单就直接裸奔JS了,先看看效果图,或者 在线玩玩 吧 如果点击颜色比较深的那个(俗称坏老鼠),将扣分50:如果点击颜色比较浅的那个(俗称好老鼠) ...

  8. 用JS做一个简单的电商产品放大镜功能

    使用js制作一个简单的产品放大图 购物网站的产品页经常会放有一个产品展示图区.该图区有一个功能就是产品图的放大功能,移动左侧的焦点区域,可以放大细节部分观看,详情如下图.实现该功能的方法也非常简单. ...

  9. Quartz2D之绘制一个简单的机器猫

    学习iOS有一段时间了,在博客园也默默的潜水了两个月,见识了很多大神,收获不少. 今天整理笔记,发现忘记的不少,我感觉需要及时的整理一下了,同时也把做的小东西贴上来和大家分享一下. 最近学习了Quar ...

随机推荐

  1. Angularjs directive

    .directive('mydir',function(){ return{ multiElement: true/false, priority: number, //default: 0 term ...

  2. Hammer.js--转载自李林峰的园子

    一.前言 移动端框架当前还处在初级阶段,但相对于移动端的应用来说已经有很长时间了.虽然暂时还没有PC端开发的需求量大,但移动端的Web必然是一种趋势,在接触移动端脚本的过程中,最开始想到的是juqer ...

  3. 通过源码成功启动odoo 10.0

  4. alpha 发布评论

    1.飞天小女警:礼物挑选小工具. 这一组的项目是个人最为感兴趣的,核心功能的实现比较有实际意义,希望所能挑选的礼物范围尽量足够大,界面期待完善后的效果. 2.nice!:约跑app.这一款面向喜爱运动 ...

  5. java项目调用kettleJob和Trans

    1.调用本地Job和Trans 较简单不用多说没有遇到任何问题,以下是代码: import org.pentaho.di.core.KettleEnvironment; import org.pent ...

  6. [llvm] Call the LLVM Jit from c program

    stackoverflow: http://stackoverflow.com/questions/1838304/call-the-llvm-jit-from-c-program Another t ...

  7. iOS_地图之显示附近微博

          1.首先需要新建一个MKMapView地图对象,在storyBoard中拖拽一个,在工程中导入MapKit.framework: 2.遵守MKMapViewDelegate协议,设定显示地 ...

  8. 远程调试js注意事项

    1:使用host切换工具,先注释掉93服务器的地址,打开链接,点击高级选项,进去后登陆账号密码(如果不行重启浏览器): 2:进入后,增加93服务器上的host地址,重启浏览器,css样式生效: 3:使 ...

  9. TTS通过JavaScript调用

    <script type="text/ecmascript"> var VoiceObj = new ActiveXObject("Sapi.SpVoice& ...

  10. Java中引用类型变量,对象,值类型,值传递,引用传递 区别与定义

    一.Java中什么叫做引用类型变量?引用:就是按内存地址查询       比如:String s = new String();这个其实是在栈内存里分配一块内存空间为s,在堆内存里new了一个Stri ...