实例介绍
【实例简介】
WPF 左侧菜单 Tab(可关闭)
【实例截图】
【核心代码】
<Window
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:WpfApp_Tab"
x:Class="WpfApp_Tab.MainWindow"
mc:Ignorable="d"
Title="MainWindow" Height="450" Width="800">
<Window.Resources>
<Style x:Key="BorderStyle" TargetType="Border">
<Setter Property="Control.BorderBrush" Value="Black"></Setter>
<Setter Property="Control.BorderThickness" Value="1"></Setter>
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="true">
<Setter Property="Background" Value="AliceBlue"/>
<Setter Property="Height" Value="25"></Setter>
</Trigger>
<Trigger Property="IsMouseOver" Value="false">
<Setter Property="Background" Value="White"/>
<Setter Property="Height" Value="20"></Setter>
</Trigger>
</Style.Triggers>
</Style>
<Style x:Key="BorderStyle_menu" TargetType="Border">
<Setter Property="Control.BorderBrush" Value="Black"></Setter>
<Setter Property="Control.BorderThickness" Value="1"></Setter>
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="true">
<Setter Property="Background" Value="BlanchedAlmond"/>
<Setter Property="Height" Value="25"></Setter>
</Trigger>
<Trigger Property="IsMouseOver" Value="false">
<Setter Property="Background" Value="White"/>
<Setter Property="Height" Value="20"></Setter>
</Trigger>
</Style.Triggers>
</Style>
<Style x:Key="BorderStyle_Button" TargetType="Border">
<Setter Property="Control.BorderBrush" Value="Black"></Setter>
<Setter Property="Control.BorderThickness" Value="1"></Setter>
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="true">
<Setter Property="Background" Value="AliceBlue"/>
</Trigger>
<Trigger Property="IsMouseOver" Value="false">
<Setter Property="Background" Value="#DDD"/>
</Trigger>
</Style.Triggers>
</Style>
</Window.Resources>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="150"></ColumnDefinition>
<ColumnDefinition Width="150*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="40"></RowDefinition>
<RowDefinition Height="40*"></RowDefinition>
<RowDefinition Height="30"></RowDefinition>
</Grid.RowDefinitions>
<ToolBar Grid.Column="0" Grid.Row="0" Grid.ColumnSpan="2"></ToolBar>
<StackPanel Grid.Row="1" Grid.Column="0">
<StackPanel>
<Border BorderBrush="#DDD" BorderThickness="1" Background="#DDD" Style="{StaticResource BorderStyle_menu}" VerticalAlignment="Center" HorizontalAlignment="Center">
<TextBlock MouseDown="menu_fold" Block.TextAlignment="Center" VerticalAlignment="Center" Width="{Binding RelativeSource={RelativeSource FindAncestor,AncestorLevel=1,AncestorType=Border},Path=ActualWidth}">子菜单</TextBlock>
</Border>
<Border BorderBrush="#DDD" BorderThickness="1" Style="{StaticResource BorderStyle}" VerticalAlignment="Center" HorizontalAlignment="Center">
<TextBlock MouseDown="Synchronization_Click" Block.TextAlignment="Center" VerticalAlignment="Center" Width="{Binding RelativeSource={RelativeSource FindAncestor,AncestorLevel=1,AncestorType=Border},Path=ActualWidth}">页面样例</TextBlock>
</Border>
</StackPanel>
</StackPanel>
<TabControl x:Name="tab1" Grid.Column="1" Grid.Row="1">
<TabControl.Resources>
<ResourceDictionary>
<!--菜单样式-->
<ControlTemplate x:Key="menuTemplate" TargetType="ContextMenu">
<Border Name="bd" Background="#99001133">
<ItemsPresenter/>
</Border>
</ControlTemplate>
<ControlTemplate x:Key="menuSeperatorTemplate" TargetType="Separator">
<Border Background="#6fff">
</Border>
</ControlTemplate>
<ControlTemplate x:Key="menuItemTemplate" TargetType="MenuItem">
<Border Name="bd" Height="30" Background="Transparent">
<StackPanel Orientation="Horizontal">
<Image x:Name="img" Width="20" Height="20" Stretch="Fill" Margin="10,0,10,0" Source="./Resources/left.png"></Image>
<TextBlock x:Name="tb" Margin="0,0,10,0" Foreground="#fff" VerticalAlignment="Center" Text="{Binding Header, RelativeSource={RelativeSource TemplatedParent}}"/>
</StackPanel>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter TargetName="bd" Property="Background" Value="#99001133" />
<Setter TargetName="tb" Property="Foreground" Value="#ff5e5e" />
<Setter TargetName="tb" Property="Margin" Value="0,0,9,0" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</ResourceDictionary>
</TabControl.Resources>
<TabControl.Template>
<ControlTemplate TargetType="TabControl" >
<ControlTemplate.Resources>
<Style TargetType="TabItem">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="TabItem">
<Grid x:Name="gridTabItem" Tag="{Binding ElementName=tabCloseBtn}" HorizontalAlignment="Center" MouseLeftButtonDown="tabItem_MouseLeftButtonDown" MouseRightButtonUp="tabItem_MouseRightButtonUp" >
<Grid.ColumnDefinitions>
<ColumnDefinition></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
<ColumnDefinition Width="16"></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
</Grid.ColumnDefinitions>
<Path x:Name="pathLeft" Height="4" Width="5" Data="M 0,4 L 5,4 5,0 C 5,0 5,4 0,4 Z" Fill="#F3F3F3" StrokeThickness="0" VerticalAlignment="Bottom" Visibility="Collapsed" SnapsToDevicePixels="True" >
</Path>
<Path x:Name="pathRight" Height="4" Width="5" Data="M 0,0 L 0,4 5,4 C 5,4 0,4 0,0 Z" Grid.Column="3" Fill="#F3F3F3" StrokeThickness="0" VerticalAlignment="Bottom" Visibility="Collapsed" SnapsToDevicePixels="True" >
</Path>
<Border x:Name="bdText" Grid.Column="1" Margin="0 0 0 0" Background="#F3F3F3" CornerRadius="3 0 0 0" SnapsToDevicePixels="True" >
<TextBlock x:Name="txt" Margin="15 0 10 0" FontSize="12" Foreground="#fff" FontFamily="微软雅黑,黑体" Text="{TemplateBinding Header}" VerticalAlignment="Center"></TextBlock>
</Border>
<Border x:Name="bdBtn" Grid.Column="2" Margin="0 0 0 0" Background="#F3F3F3" CornerRadius="0 3 0 0" SnapsToDevicePixels="True" >
</Border>
<Button x:Name="btnTabItemClose" Grid.Column="2" Width="15" Height="15" HorizontalAlignment="Right" Click="btnTabItemClose_Click" VerticalAlignment="Top" Margin="0,5,0,0">
<Button.Template>
<ControlTemplate TargetType="{x:Type Button}">
<Border Background="Transparent">
<Image Stretch="Fill" x:Name="imgTabClose" Source="./Resources/Colse.png" ></Image>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsPressed" Value="true">
<Setter TargetName="imgTabClose" Property="Margin" Value="1"></Setter>
</Trigger>
<Trigger Property="IsMouseOver" Value="true">
<Setter TargetName="imgTabClose" Property="Margin" Value="1"></Setter>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Button.Template>
</Button>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsSelected" Value="true">
<Setter TargetName="bdText" Property="Background" Value="#DDD"></Setter>
<Setter TargetName="bdBtn" Property="Background" Value="#DDD"></Setter>
<Setter TargetName="pathLeft" Property="Fill" Value="#DDD"></Setter>
<Setter TargetName="pathRight" Property="Fill" Value="#DDD"></Setter>
<Setter TargetName="pathLeft" Property="Visibility" Value="Visible"></Setter>
<Setter TargetName="pathRight" Property="Visibility" Value="Visible"></Setter>
<Setter TargetName="gridTabItem" Property="Margin" Value="0 0 -8 0"></Setter>
</Trigger>
<Trigger Property="IsSelected" Value="false">
<Setter TargetName="gridTabItem" Property="Margin" Value="5 0 -3 0"></Setter>
<Setter TargetName="txt" Property="Foreground" Value="#000"></Setter>
</Trigger>
<Trigger Property="IsMouseOver" Value="true">
<Setter TargetName="txt" Property="Foreground" Value="#FFF"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ControlTemplate.Resources>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="26"></RowDefinition>
<RowDefinition Height="1*"></RowDefinition>
</Grid.RowDefinitions>
<Border>
<StackPanel MinWidth="{TemplateBinding Property=ActualWidth}" Orientation="Horizontal" Margin="2,0,0,0" IsItemsHost="True"></StackPanel>
</Border>
<Border Grid.Row="1" Background="#DDD" CornerRadius="2" >
<ContentPresenter Content="{TemplateBinding Property=SelectedContent }">
</ContentPresenter>
</Border>
</Grid>
</ControlTemplate>
</TabControl.Template>
<TabControl.ContextMenu>
<ContextMenu Name="menu" Template="{StaticResource menuTemplate}">
<MenuItem Header="Colse标签" Template="{StaticResource menuItemTemplate}" CommandParameter="0" Click="menuItemClick"></MenuItem>
<Separator Height="1" Template="{StaticResource menuSeperatorTemplate}" Margin="1 0 1 0"></Separator>
<MenuItem Header="Colse其他标签" Template="{StaticResource menuItemTemplate}" CommandParameter="1" Click="menuItemClick"></MenuItem>
<MenuItem Header="Colse左侧标签" Template="{StaticResource menuItemTemplate}" CommandParameter="2" Click="menuItemClick"></MenuItem>
<MenuItem Header="Colse右侧标签" Template="{StaticResource menuItemTemplate}" CommandParameter="3" Click="menuItemClick"></MenuItem>
</ContextMenu>
</TabControl.ContextMenu>
</TabControl>
<StatusBar Grid.Row="2" Grid.ColumnSpan="2" Grid.Column="0"></StatusBar>
</Grid>
</Window>
相关软件
小贴士
感谢您为本站写下的评论,您的评论对其它用户来说具有重要的参考价值,所以请认真填写。
- 类似“顶”、“沙发”之类没有营养的文字,对勤劳贡献的楼主来说是令人沮丧的反馈信息。
- 相信您也不想看到一排文字/表情墙,所以请不要反馈意义不大的重复字符,也请尽量不要纯表情的回复。
- 提问之前请再仔细看一遍楼主的说明,或许是您遗漏了。
- 请勿到处挖坑绊人、招贴广告。既占空间让人厌烦,又没人会搭理,于人于己都无利。
关于好例子网
本站旨在为广大IT学习爱好者提供一个非营利性互相学习交流分享平台。本站所有资源都可以被免费获取学习研究。本站资源来自网友分享,对搜索内容的合法性不具有预见性、识别性、控制性,仅供学习研究,请务必在下载后24小时内给予删除,不得用于其他任何用途,否则后果自负。基于互联网的特殊性,平台无法对用户传输的作品、信息、内容的权属或合法性、安全性、合规性、真实性、科学性、完整权、有效性等进行实质审查;无论平台是否已进行审查,用户均应自行承担因其传输的作品、信息、内容而可能或已经产生的侵权或权属纠纷等法律责任。本站所有资源不代表本站的观点或立场,基于网友分享,根据中国法律《信息网络传播权保护条例》第二十二与二十三条之规定,若资源存在侵权或相关问题请联系本站客服人员,点此联系我们。关于更多版权及免责申明参见 版权及免责申明
网友评论
我要评论