디자인 UserControl 사이에 내용이있는 스타일

Question

저는 Star, Ball, sky 등 다양한 모양의 UserControl 스타일을 디자인했습니다.이 모든 모양은 패스를 사용하여 디자인되었습니다. 스타일을 사용하여 usercontrol의 내용을 읽고 너비와 높이를 조정하고 내용을 표시해야합니다.

<Style TargetType="{x:Type UserControl}"> 
    <Setter Property="Background" Value="#CCC4C4" /> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="{x:Type UserControl}"> 
       <Path 
      Data="F1M37.3,41.5L24.0,34.8 10.7,41.4 13.2,27.3 2.5,17.3 17.4,15.3 24.0,2.5 30.6,15.3 45.5,17.4 34.7,27.3 37.3,41.5z" 
      Fill="White" 
      Height="{TemplateBinding Height}" 
      Width="{TemplateBinding Width}" 
      Stroke="#FFC4A000" 
      StrokeMiterLimit="4" 
      StrokeThickness="1"> 

     </Path> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 

Answer 1

당신은 ContentControl을 사용할 수 있습니다, 개별 콘텐츠로 채울 수 Container.

<Grid> 
    <Grid.Resources> 
     <Style TargetType="{x:Type ContentControl}"> 
     <Setter Property="Background" Value="#CCC4C4" /> 
     <Setter Property="Template"> 
      <Setter.Value> 
      <ControlTemplate TargetType="{x:Type ContentControl}"> 
       <Path 
      Data="F1M37.3,41.5L24.0,34.8 10.7,41.4 13.2,27.3 2.5,17.3 17.4,15.3 24.0,2.5 30.6,15.3 45.5,17.4 34.7,27.3 37.3,41.5z" 
      Fill="White" 
      Stretch="Fill" 
      Stroke="#FFC4A000" 
      StrokeMiterLimit="4" 
      StrokeThickness="1"> 

       </Path> 
      </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
     </Style> 
    </Grid.Resources> 

    <StackPanel> 
     <!-- the below ones become stars --> 
     <ContentControl></ContentControl> 
     <ContentControl></ContentControl> 
     <ContentControl></ContentControl> 
    </StackPanel> 

    </Grid> 

편집

: 당신이 사용 가능한 공간의 크기를 조정하는 스타를 원하는 경우

는, 대신에 높이 바인딩의, 스트레칭 = 채우기 사용 (즉, 변경 여기

은 예입니다 위).