最近想要修改一下UI界面,发现Silverlight没有原生的GroupBox,于是百度了一下立马就发现了一些共享的很是受用,但是一用发现GroupBox的title必须有背景色颜色来遮挡住border ,这样在多种颜色背景的时候就会很悲催了,于是就有了这个GroupBox。
不废话上图
主要原理就是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>希望对大家有用~
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 [email protected] 举报,一经查实,本站将立刻删除。