WFP 응용 프로그램의 단추 다시 사용

Question

첫 번째 win8 응용 프로그램을 개발하고 있습니다. 여러 페이지에 로그 오프 버튼을 만들어야합니다. 일반적으로이 버튼은 텍스트 및 이미지가 포함 된 버튼입니다.

어떤 접근 방식을 선택해야합니까? 템플릿, 리소스 또는 스타일을 크레이트합니까?

Answer 1

style을 사용하여 단추를 다시 사용할 수 있습니다. 스타일은 template을 정의해야하고 resource은 정의 된 위치를 기준으로 사용할 수 있습니다.

x:Key으로 정의한 단추를 대상으로하는 스타일 샘플은 다른 곳에서 재사용 할 수 있습니다. x:Key을 지정하지 않고 style이 Application Resources에 정의 된 경우 모든 버튼에 스타일이 적용됩니다.

<Style x:Key="CustomStyleButton" TargetType="{x:Type Button}"> 
<Setter Property="Background" Value="#373737" /> 
<Setter Property="Foreground" Value="White" /> 
<Setter Property="FontSize" Value="15" /> 
<Setter Property="SnapsToDevicePixels" Value="True" /> 

<Setter Property="Template"> 
    <Setter.Value> 
     <ControlTemplate TargetType="{x:Type Button}"> 
      <Border CornerRadius="4" Background="{TemplateBinding Background}"> 
       <Grid> 
        <Path x:Name="PathIcon" Width="15" Height="25" Stretch="Fill" Fill="#4C87B3" HorizontalAlignment="Left" Margin="17,0,0,0" Data="F1 M 30.0833,22.1667L 50.6665,37.6043L 50.6665,38.7918L 30.0833,53.8333L 30.0833,22.1667 Z "/> 
        <ContentPresenter x:Name="MyContentPresenter" Content="{TemplateBinding Content}" HorizontalAlignment="Center" VerticalAlignment="Center" Margin="0,0,0,0" />         
       </Grid> 
      </Border> 

      <ControlTemplate.Triggers> 
       <Trigger Property="IsMouseOver" Value="True"> 
        <Setter Property="Background" Value="#E59400" /> 
        <Setter Property="Foreground" Value="White" /> 
        <Setter TargetName="PathIcon" Property="Fill" Value="Black" /> 
       </Trigger> 

       <Trigger Property="IsPressed" Value="True"> 
        <Setter Property="Background" Value="OrangeRed" /> 
        <Setter Property="Foreground" Value="White" /> 
       </Trigger> 
      </ControlTemplate.Triggers> 
     </ControlTemplate> 
    </Setter.Value> 
</Setter> 

샘플 사용은

<Button Width="200" Height="50" Style="{StaticResource CustomStyleButton}" VerticalAlignment="Top" Margin="0,20,0,0" /> 
<Button.Content> 
    <StackPanel> 
     <TextBlock Text="Watch Now" FontSize="20" /> 
     <TextBlock Text="Duration: 50m" FontSize="12" Foreground="Gainsboro" /> 
    </StackPanel> 
</Button.Content>