zoukankan      html  css  js  c++  java
  • silverlight 加强版GroupBox

    最近想要修改一下UI界面,发现Silverlight没有原生的GroupBox,于是百度了一下立马就发现了一些共享的很是受用,但是一用发现GroupBox的title必须有背景色颜色来遮挡住border ,这样在多种颜色背景的时候就会很悲催了,于是就有了这个GroupBox。

    不废话上图

    image 

    主要原理就是clip.上代码:

    /// <summary>
    /// 分组框
    /// </summary>
    [TemplatePart(Name = "PART_Header", Type = typeof(FrameworkElement)), TemplatePart(Name = "PART_Border", Type = typeof(FrameworkElement))]
    public class GroupBox : HeaderedContentControl
    {
         private FrameworkElement header;
         private FrameworkElement border;
         public GroupBox()
         {
             this.DefaultStyleKey = typeof(GroupBox);
         }
         public override void OnApplyTemplate()
         {
             base.OnApplyTemplate();
        
             this.header = (base.GetTemplateChild("PART_Header") as FrameworkElement);
             this.border = (base.GetTemplateChild("PART_Border") as FrameworkElement);
             if (this.header != null && this.border != null)
             {
                 this.header.Clip = null;
                 this.header.SizeChanged+=this.GroupBoxSizeChanged;
                 this.border.SizeChanged+=this.GroupBoxSizeChanged;
             }
         }
     
         private void GroupBoxSizeChanged(object sender, EventArgs e)
         {
             if (this.header != null && this.border != null)
             {
                 var geometryGroup = new GeometryGroup();
                 PresentationFrameworkCollection<Geometry> geometrys = geometryGroup.Children;
                 var rectangleGeometry = new RectangleGeometry
                     {
                         Rect = (new Rect(-1.0, -1.0, this.border.ActualWidth + 2.0, this.border.ActualHeight + 2.0))
                     };
                 geometrys.Add(rectangleGeometry);
                 var rect = new Rect(default(Point), new Point(this.header.ActualWidth, this.header.ActualHeight));
                 try
                 {
                     GeneralTransform generalTransform = this.header.TransformToVisual(this.border);
                     rect = generalTransform.TransformBounds(rect);
                 }
                 catch
                 {
                 }
                 PresentationFrameworkCollection<Geometry> geometrys2 = geometryGroup.Children;
                 var rectangleGeometry2 = new RectangleGeometry {Rect = rect};
                 geometrys2.Add(rectangleGeometry2);
                 this.border.Clip=geometryGroup;
             }
         }

    <Style TargetType="widgetUi:GroupBox">
           <Setter Property="Background" Value="{x:Null}"></Setter>
           <Setter Property="BorderBrush" Value="#687B8B"></Setter>
           <Setter Property="BorderThickness" Value="1"></Setter>
           <Setter Property="Foreground" Value="#FF000000"/>
           <Setter Property="Template">
               <Setter.Value>
                   <ControlTemplate TargetType="widgetUi:GroupBox">
                       <Grid>
                           <Grid.ColumnDefinitions>
                               <ColumnDefinition Width="6"/>
                               <ColumnDefinition Width="Auto"/>
                               <ColumnDefinition Width="*"/>
                               <ColumnDefinition Width="6"/>
                           </Grid.ColumnDefinitions>
                           <Grid.RowDefinitions>
                               <RowDefinition Height="Auto"/>
                               <RowDefinition Height="Auto"/>
                               <RowDefinition Height="*"/>
                               <RowDefinition Height="6"/>
                           </Grid.RowDefinitions>
                           <Border x:Name="Background" BorderBrush="{x:Null}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Grid.ColumnSpan="4" Grid.Column="0" CornerRadius="4" Grid.Row="1" Grid.RowSpan="3" />
                           <Border x:Name="PART_Header" Grid.Column="1" Padding="5 0 5 1" Grid.Row="0" Grid.RowSpan="2" >
                               <ContentPresenter ContentTemplate="{TemplateBinding HeaderTemplate}" Content="{TemplateBinding Header}" />
                           </Border>
                           <ContentPresenter x:Name="Content" Grid.ColumnSpan="2" Grid.Column="1" Margin="{TemplateBinding Padding}" Grid.Row="2" />
                           <Border x:Name="PART_Border" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Grid.ColumnSpan="4" CornerRadius="4" IsHitTestVisible="False" Margin="1 0 1 1" Grid.Row="1" Grid.RowSpan="3"/>
                       </Grid>
                   </ControlTemplate>
               </Setter.Value>
           </Setter>
       </Style>
    希望对大家有用~

  • 相关阅读:
    centos linux系统日常管理3 服务管理ntsysv,chkconfig,系统日志rsyslog,last ,lastb ,exec,xargs,dmesg,screen,nohup,curl,ping ,telnet,traceroute ,dig ,nc,nmap,host,nethogs,base64,jq 第十六节课
    centos Linux系统日常管理2 tcpdump,tshark,selinux,strings命令, iptables ,crontab,TCP,UDP,ICMP,FTP网络知识 第十五节课
    一个兼职DBA的数据库运维经验 小米科技 xx@xiaomi.com 2011
    centos Linux系统日常管理1 cpuinfo cpu核数 命令 w, vmstat, uptime ,top ,kill ,ps ,free,netstat ,sar, ulimit ,lsof ,pidof 第十四节课
    HTML5矢量实现文件上传进度条
    基于HTML5的WebGL呈现A星算法3D可视化
    基于HTML5的WebGL呈现A星算法的3D可视化
    基于HTML5的WebGL设计汉诺塔3D游戏
    基于HTML5树组件延迟加载技术实现
    基于HTML5的WebGL电信网管3D机房监控应用
  • 原文地址:https://www.cnblogs.com/aoldman/p/3121331.html
Copyright © 2011-2022 走看看