自定义控件定义自定义属性
public class CustomDetails : Control{static CustomDetails(){DefaultStyleKeyProperty.OverrideMetadata(typeof(CustomDetails), new FrameworkPropertyMetadata(typeof(CustomDetails)));}public ImageSource Source{get { return (ImageSource)GetValue(SourceProperty); }set { SetValue(SourceProperty, value); }}public static readonly DependencyProperty SourceProperty =DependencyProperty.Register("Source", typeof(ImageSource), typeof(CustomDetails), new PropertyMetadata(null));public CornerRadius CornerRadius{get { return (CornerRadius)GetValue(CornerRadiusProperty); }set { SetValue(CornerRadiusProperty, value); }}public static readonly DependencyProperty CornerRadiusProperty =DependencyProperty.Register("CornerRadius", typeof(CornerRadius), typeof(CustomDetails), new PropertyMetadata(new CornerRadius(0)));public string TextOne{get { return (string)GetValue(TextOneProperty); }set { SetValue(TextOneProperty, value); }}public static readonly DependencyProperty TextOneProperty =DependencyProperty.Register("TextOne", typeof(string), typeof(CustomDetails), new PropertyMetadata(null));public string TextTwo{get { return (string)GetValue(TextTwoProperty); }set { SetValue(TextTwoProperty, value); }}public static readonly DependencyProperty TextTwoProperty =DependencyProperty.Register("TextTwo", typeof(string), typeof(CustomDetails), new PropertyMetadata(null));public bool Status{get { return (bool)GetValue(StatusProperty); }set { SetValue(StatusProperty, value); }}public static readonly DependencyProperty StatusProperty =DependencyProperty.Register("Status", typeof(bool), typeof(CustomDetails), new PropertyMetadata(true));}
界面调用
<WrapPanel Width="1621" Height="699" HorizontalAlignment="Center" VerticalAlignment="Center"><local1:CustomDetails Source="/Image/工序.png" CornerRadius="20" TextOne="{Binding Process.StepId1}" TextTwo="读取周转标签" Status="{Binding Process.StepStatus1}" Margin="20"></local1:CustomDetails><local1:CustomDetails Source="/Image/工序 (2).png" CornerRadius="20" TextOne="{Binding Process.StepId2}" TextTwo="缠泡棉/保护带" Status="{Binding Process.StepStatus2}" Margin="20"></local1:CustomDetails><local1:CustomDetails Source="/Image/工序 (3).png" CornerRadius="20" TextOne="{Binding Process.StepId3}" TextTwo="卷盘贴标盖章" Status="{Binding Process.StepStatus3}" Margin="20"></local1:CustomDetails><local1:CustomDetails Source="/Image/工序 (4).png" CornerRadius="20" TextOne="{Binding Process.StepId4}" TextTwo="包装袋贴标盖章" Status="{Binding Process.StepStatus4}" Margin="20"></local1:CustomDetails><local1:CustomDetails Source="/Image/工序 (5).png" CornerRadius="20" TextOne="{Binding Process.StepId5}" TextTwo="摆放湿度卡/干燥剂 " Status="{Binding Process.StepStatus5}" Margin="20"></local1:CustomDetails><local1:CustomDetails Source="/Image/工序 (6).png" CornerRadius="20" TextOne="{Binding Process.StepId6}" TextTwo="装入包装袋" Status="{Binding Process.StepStatus6}" Margin="20"></local1:CustomDetails><local1:CustomDetails Source="/Image/工序 (7).png" CornerRadius="20" TextOne="{Binding Process.StepId7}" TextTwo="抽真空/热封合包装袋" Status="{Binding Process.StepStatus7}" Margin="20"></local1:CustomDetails><local1:CustomDetails Source="/Image/工序 (8).png" CornerRadius="20" TextOne="{Binding Process.StepId8}" TextTwo="卷盘装入内盒" Status="{Binding Process.StepStatus8}" Margin="20"></local1:CustomDetails><local1:CustomDetails Source="/Image/工序11.png" CornerRadius="20" TextOne="{Binding Process.StepId9}" TextTwo="粘贴内盒标签" Status="{Binding Process.StepStatus9}" Margin="20"></local1:CustomDetails><local1:CustomDetails Source="/Image/工序 (9).png" CornerRadius="20" TextOne="{Binding Process.StepId10}" TextTwo="粘贴内盒封条 " Status="{Binding Process.StepStatus10}" Margin="20"></local1:CustomDetails></WrapPanel>
样式调整
<Page.Resources><Style TargetType="{x:Type local1:CustomDetails}"><Setter Property="Template"><Setter.Value><ControlTemplate TargetType="{x:Type local1:CustomDetails}"><WrapPanel Width="281" Height="316" ><Border Width="280" Height="280" CornerRadius="{TemplateBinding CornerRadius}" Background="#E0EAF6" ><Canvas><Image Source="{TemplateBinding Source}" Width="280" Height="280"/><StackPanel><Label Content="{TemplateBinding TextOne}" FontWeight="Bold" FontSize="18" Margin="150 0 0 0"></Label></StackPanel><StackPanel><Image Width="38" Height="38" Margin="240 240 0 0"><Image.Style><Style TargetType="Image"><Style.Triggers><DataTrigger Binding="{Binding Status,RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=local1:CustomDetails}}" Value="True"><Setter Property="Source" Value="/Image/对号1@2x.png"></Setter></DataTrigger><DataTrigger Binding="{Binding Status,RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=local1:CustomDetails}}" Value="False"><Setter Property="Source" Value="/Image/椭圆 3@2x.png"></Setter></DataTrigger></Style.Triggers></Style></Image.Style></Image></StackPanel></Canvas></Border><StackPanel Width="280"><Label Content="{TemplateBinding TextTwo}" FontSize="20" FontWeight="Bold" HorizontalAlignment="Center" VerticalAlignment="Center"></Label></StackPanel></WrapPanel> </ControlTemplate></Setter.Value></Setter></Style></Page.Resources>
