Contenuto pulsante di riutilizzo in XAML

Question

Ho il pulsante Contenuto che desidero utilizzare in più pulsanti su un controllo utente nella mia applicazione Silverlight. Ecco il codice per un pulsante:

<Grid x:Name="LayoutRoot" Background="White"> 

    <Button Grid.Column="1" IsEnabled="{Binding PrivilegeChanged}" Height="24" Width="24"> 
     <Button.Content> 
      <Canvas xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
       x:Name="UndoIcon" Width="16" Height="16" Clip="F1 M 0,0L 16,0L 16,16L 0,16L 0,0" UseLayoutRounding="False"> 
       <Canvas x:Name="Arrow_2" Width="16" Height="16" Canvas.Left="0" Canvas.Top="0"> 
        <Path Width="17.0154" Height="17" Canvas.Left="-0.5" Canvas.Top="-0.499999" Stretch="Fill" 
         StrokeLineJoin="Round" Stroke="#FF006432" Fill="#FF00C800" 
         Data="F1 M 12.5819,16C 14.1685,12.7951 14.1052,6.14911 11.0969,4.25C 9.23816,3.07665 6.71915,3.4789 5.40404,5.25L 8.12669,8.25L 0,8.91667L 0,9.53674e-007L 3.17642,3.25C 4.16648,1.91667 5.52584,0.61155 7.13664,0.25C 9.85332,-0.359774 13.4395,0.629333 15.0571,2.91667C 17.402,6.23256 15.0026,12.7401 12.5819,16"/> 
       </Canvas> 
      </Canvas> 
     </Button.Content> 
    </Button> 

</Grid> 

Come posso fare Button.Content riutilizzabile senza rimuovere il pulsante di contorno?

Answer 1

L'approccio più semplice sarebbe quella di attaccare il vostro disegno contenuti pulsante nel proprio UserControl : -

<UserControl x:Class="SilverlightApplication1.MyButton" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" > 
    <Canvas Width="16" Height="16" Clip="F1 M 0,0L 16,0L 16,16L 0,16L 0,0" UseLayoutRounding="False"> 
     <Canvas Width="16" Height="16" Canvas.Left="0" Canvas.Top="0"> 
      <Path Width="17.0154" Height="17" Canvas.Left="-0.5" Canvas.Top="-0.499999" Stretch="Fill" 
         StrokeLineJoin="Round" Stroke="#FF006432" Fill="#FF00C800" 
         Data="F1 M 12.5819,16C 14.1685,12.7951 14.1052,6.14911 11.0969,4.25C 9.23816,3.07665 6.71915,3.4789 5.40404,5.25L 8.12669,8.25L 0,8.91667L 0,9.53674e-007L 3.17642,3.25C 4.16648,1.91667 5.52584,0.61155 7.13664,0.25C 9.85332,-0.359774 13.4395,0.629333 15.0571,2.91667C 17.402,6.23256 15.0026,12.7401 12.5819,16"/> 
     </Canvas> 
    </Canvas> 
</UserControl> 

Ora è possibile creare più istanze di questo utente controllo dove mai hai bisogno di questo contenuto: -

<UserControl x:Class="SilverlightApplication1.Test" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     xmlns:local="clr-namespace:SilverlightApplication1" 
    Width="400" Height="300"> 
    <Grid x:Name="LayoutRoot" Background="White"> 
     <StackPanel Orientation="Horizontal"> 
      <Button Grid.Column="1" IsEnabled="{Binding PrivilegeChanged}" Height="24" Width="24" Margin="2"> 
       <local:MyButton /> 
      </Button> 
      <Button Grid.Column="1" IsEnabled="{Binding SomethingElseChanged}" Height="24" Width="24" Margin="2"> 
       <local:MyButton /> 
      </Button> 
     </StackPanel> 

    </Grid> 
</UserControl> 

Answer 2

Normalmente si crea un Template che crea il layout personalizzato per il pulsante. Una soluzione più rapida e più immediata per te sarebbe quella di impostare il contenuto all'interno di uno Style e applicare lo stile ai pulsanti di cui hai bisogno.

definire lo stile con il suo sito web:

<Window.Resources> 
    <Style x:Key="ButtonArrowStyle" TargetType="Button"> 
     <Setter Property="Content"> 
      <Setter.Value> 
       <Canvas xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
      x:Name="UndoIcon" Width="16" Height="16" Clip="F1 M 0,0L 16,0L 16,16L 0,16L 0,0" UseLayoutRounding="False"> 
        <Canvas x:Name="Arrow_2" Width="16" Height="16" Canvas.Left="0" Canvas.Top="0"> 
         <Path Width="17.0154" Height="17" Canvas.Left="-0.5" Canvas.Top="-0.499999" Stretch="Fill" 
        StrokeLineJoin="Round" Stroke="#FF006432" Fill="#FF00C800" 
        Data="F1 M 12.5819,16C 14.1685,12.7951 14.1052,6.14911 11.0969,4.25C 9.23816,3.07665 6.71915,3.4789 5.40404,5.25L 8.12669,8.25L 0,8.91667L 0,9.53674e-007L 3.17642,3.25C 4.16648,1.91667 5.52584,0.61155 7.13664,0.25C 9.85332,-0.359774 13.4395,0.629333 15.0571,2.91667C 17.402,6.23256 15.0026,12.7401 12.5819,16"/> 
        </Canvas> 
       </Canvas> 
      </Setter.Value> 
     </Setter> 
    </Style> 
</Window.Resources> 

e quindi definire un pulsante per utilizzare lo stile:

<Button Style="{StaticResource ButtonArrowStyle}"/>