你的位置:首页 > ASP.net教程

[ASP.net教程]WPF 自定义标题栏 自定义菜单栏


自定义标题栏

 

一、设计界面样式

<UserControl x:Class="WpfApplication6.TitleListControl"       ="http://schemas.microsoft.com/winfx/2006/xaml/presentation"       ="http://schemas.microsoft.com/winfx/2006/xaml"       ="http://schemas.open       ="http://schemas.microsoft.com/expression/blend/2008"       mc:Ignorable="d"       d:DesignHeight="200" d:DesignWidth="800" Loaded="TitleListControl_OnLoaded" >  <UserControl.Resources>    <Style x:Key="FirstButtonStyle" TargetType="RadioButton">      <Setter Property="Margin" Value="0.5,2"></Setter>      <Setter Property="Template">        <Setter.Value>          <ControlTemplate TargetType="{x:Type RadioButton}">            <Grid>              <Border x:Name="ButtonBorder" Height="35" Width="100" Background="#FF286E9E" CornerRadius="15,0,0,15"></Border>              <TextBlock Text="{TemplateBinding Content}" Foreground="White" FontSize="18" VerticalAlignment="Center" HorizontalAlignment="Center"></TextBlock>            </Grid>            <ControlTemplate.Triggers>              <Trigger Property="IsChecked" Value="True">                <Setter TargetName="ButtonBorder" Property="Background" Value="DeepSkyBlue"></Setter>              </Trigger>            </ControlTemplate.Triggers>          </ControlTemplate>        </Setter.Value>      </Setter>    </Style>    <Style TargetType="RadioButton">        <Setter Property="Margin" Value="0.5,2"></Setter>        <Setter Property="Template">          <Setter.Value>            <ControlTemplate TargetType="{x:Type RadioButton}">              <Grid>                <Border x:Name="ButtonBorder" Height="35" Width="100" Background="#FF286E9E"></Border>                <TextBlock Text="{TemplateBinding Content}" Foreground="White" FontSize="18" VerticalAlignment="Center" HorizontalAlignment="Center"></TextBlock>              </Grid>              <ControlTemplate.Triggers>                <Trigger Property="IsChecked" Value="True">                  <Setter TargetName="ButtonBorder" Property="Background" Value="DeepSkyBlue"></Setter>                </Trigger>              </ControlTemplate.Triggers>            </ControlTemplate>          </Setter.Value>        </Setter>      </Style>    <Style x:Key="LastButtonStyle" TargetType="RadioButton">        <Setter Property="Margin" Value="0.5,2"></Setter>        <Setter Property="Template">          <Setter.Value>            <ControlTemplate TargetType="{x:Type RadioButton}">              <Grid>                <Border x:Name="ButtonBorder" Height="35" Width="100" Background="#FF286E9E" CornerRadius="0,15,15,0"></Border>                <TextBlock Text="{TemplateBinding Content}" Foreground="White" FontSize="18" VerticalAlignment="Center" HorizontalAlignment="Center"></TextBlock>              </Grid>              <ControlTemplate.Triggers>                <Trigger Property="IsChecked" Value="True">                  <Setter TargetName="ButtonBorder" Property="Background" Value="DeepSkyBlue"></Setter>                </Trigger>              </ControlTemplate.Triggers>            </ControlTemplate>          </Setter.Value>        </Setter>      </Style>  </UserControl.Resources>  <Grid>    <Border x:Name="ControlBorder" VerticalAlignment="Center" HorizontalAlignment="Center" CornerRadius="16,16,16,16">      <Border.Background>        <LinearGradientBrush StartPoint="0,1" EndPoint="1,1">          <GradientStop Color="White" Offset="0.2"></GradientStop>          <GradientStop Color="DeepSkyBlue" Offset="1"></GradientStop>        </LinearGradientBrush>      </Border.Background>      <StackPanel x:Name="SpTitleList" Orientation="Horizontal" Background="Transparent" Margin="2,0">      </StackPanel>    </Border>  </Grid></UserControl>

View Code

 二、控件后台代码

public partial class TitleListControl : UserControl  {    public TitleListControl()    {      InitializeComponent();    }    /// <summary>    /// get or set the items    /// </summary>    public List<TitleListItemModel> TitleListItems    {      get { return (List<TitleListItemModel>) GetValue(TitleListItemsProperty); }      set{SetValue(TitleListItemsProperty,value);}    }    public static readonly DependencyProperty TitleListItemsProperty = DependencyProperty.Register("TitleListItems", typeof(List<TitleListItemModel>),      typeof(TitleListControl),new PropertyMetadata(new List<TitleListItemModel>()));    public UIElementCollection Items    {      get { return SpTitleList.Children; }    }    private void TitleListControl_OnLoaded(object sender, RoutedEventArgs e)    {      if (TitleListItems!=null)      {        var items = TitleListItems;        int index = 0;        foreach (var item in items)        {          var radiaoButton=new RadioButton()          {            Content = item.Name          };          if (index == 0)          {            radiaoButton.Style = GetStyle("first");          }          else if (index == items.Count - 1)          {            radiaoButton.Style = GetStyle("last");          }          item.Index = index;          radiaoButton.DataContext = item;          radiaoButton.Checked += ToggleButton_OnChecked;          SpTitleList.Children.Add(radiaoButton);          index++;        }      }    }    private Style GetStyle(string type)    {      Style style = null;      switch (type)      {        case "first":        {          style = this.Resources["FirstButtonStyle"] as Style;        }          break;        case "last":        {          style = this.Resources["LastButtonStyle"] as Style;        }          break;      }      return style;    }    private void ToggleButton_OnChecked(object sender, RoutedEventArgs e)    {      var radioButton=sender as RadioButton;      var dataModel=radioButton.DataContext as TitleListItemModel;      int index = dataModel.Index;      int count = SpTitleList.Children.Count;      var linerBrush = new LinearGradientBrush(){StartPoint=new Point(0,1),EndPoint = new Point(1,1)};      if (index==0)      {        linerBrush.GradientStops.Add(new GradientStop()        {          Color = Colors.White,          Offset = 0.2        });        linerBrush.GradientStops.Add(new GradientStop()        {          Color = Colors.DeepSkyBlue,          Offset = 1        });      }      else if (index == count - 1)      {        linerBrush.GradientStops.Add(new GradientStop()        {          Color = Colors.DeepSkyBlue,          Offset = 0        });        linerBrush.GradientStops.Add(new GradientStop()        {          Color = Colors.White,          Offset = 0.8        });      }      else      {        double offsetValue = Convert.ToDouble(index) / count;        linerBrush.GradientStops.Add(new GradientStop()        {          Color = Colors.DeepSkyBlue,          Offset = 0        });        linerBrush.GradientStops.Add(new GradientStop()        {          Color = Colors.White,          Offset = offsetValue        });        linerBrush.GradientStops.Add(new GradientStop()        {          Color = Colors.DeepSkyBlue,          Offset = 1        });      }      ControlBorder.Background = linerBrush;    }  }  public class TitleListItemModel  {    public int Index { get; set; }    public string Name { get; set; }    public string Remark { get; set; }  }

View Code

三、引用UserControl

<Window x:Class="WpfApplication6.MainWindow"    ="http://schemas.microsoft.com/winfx/2006/xaml/presentation"    ="http://schemas.microsoft.com/winfx/2006/xaml"    ="clr-namespace:WpfApplication6"    Title="MainWindow" Height="350" Width="800" Background="LightGray">  <Grid>    <wpfApplication6:TitleListControl VerticalAlignment="Center" HorizontalAlignment="Center">      <wpfApplication6:TitleListControl.TitleListItems>        <wpfApplication6:TitleListItemModel Name="综合" ></wpfApplication6:TitleListItemModel>        <wpfApplication6:TitleListItemModel Name="语音体验" ></wpfApplication6:TitleListItemModel>        <wpfApplication6:TitleListItemModel Name="网页浏览"></wpfApplication6:TitleListItemModel>        <wpfApplication6:TitleListItemModel Name="视频播放" ></wpfApplication6:TitleListItemModel>        <wpfApplication6:TitleListItemModel Name="综合覆盖"></wpfApplication6:TitleListItemModel>        <wpfApplication6:TitleListItemModel Name="速率性能"></wpfApplication6:TitleListItemModel>        <wpfApplication6:TitleListItemModel Name="网络延时"></wpfApplication6:TitleListItemModel>      </wpfApplication6:TitleListControl.TitleListItems>    </wpfApplication6:TitleListControl>  </Grid></Window>

View Code

 如需要控件的SelectionChanged方法,在UserControl中添加个委托或者注册一个事件即可。