2010-05-13 17 views
6

Tengo un conjunto de botones dentro de un panel de pila. Quiero que todos tengan una imagen de fondo. ¿Cómo puedo hacerlo usando estilos? ya que no quiero configurar manualmente la Imagen de fondo para cada botón.¿Configurando la imagen de fondo de control WPF usando estilos?

Aquí es un fragmento de código:

<StackPanel Orientation="Horizontal" Height="100px" VerticalAlignment="Top"> 
     <StackPanel.Resources> 
      <Style TargetType="Button"> 
       <Setter Property="Margin" Value="2,4" /> 
      </Style> 
     </StackPanel.Resources> 
     <Button Width="127px" Height="79px" VerticalAlignment="Bottom"> 
      <Button.Background> 
       <ImageBrush ImageSource="images/Tab.png" /> 
      </Button.Background> 
     </Button> 
     <Button>A</Button> 
     <Button>R</Button> 
     <Button>S</Button> 
    </StackPanel> 

Gracias.

Respuesta

14

Bien, especifique un colocador para la propiedad Background dentro del estilo y establezca su valor en ImageBrush.

<StackPanel Orientation="Horizontal" Height="100px" VerticalAlignment="Top"> 
     <StackPanel.Resources> 
      <Style TargetType="Button"> 
       <Setter Property="Margin" Value="2,4"/> 
       <Setter Property="Background"> 
        <Setter.Value> 
        <ImageBrush ImageSource="images/Tab.png"/> 
        </Setter.Value> 
       </Setter> 
      </Style> 
     </StackPanel.Resources> 

     <Button Width="127px" Height="79px" VerticalAlignment="Bottom"/> 
     <Button>A</Button> 
     <Button>R</Button> 
     <Button>S</Button> 
    </StackPanel> 
1

A continuación se muestra el estilo de este botón y la imagen backgroung se establece en it.You puede cambiar la fuente de la ImageBrush a la que usted quería.

<Style x:Key="ButtonStyle1" TargetType="{x:Type Button}"> 
      <Setter Property="FocusVisualStyle" Value="{StaticResource ButtonFocusVisual}"/> 
      <Setter Property="Background" > 
       <Setter.Value> 
        <ImageBrush ImageSource="pic.png"></ImageBrush> 
       </Setter.Value> 
      </Setter> 

      <Setter Property="BorderBrush" Value="{StaticResource ButtonNormalBorder}"/> 
      <Setter Property="BorderThickness" Value="1"/> 
      <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/> 
      <Setter Property="HorizontalContentAlignment" Value="Center"/> 
      <Setter Property="VerticalContentAlignment" Value="Center"/> 
      <Setter Property="Padding" Value="1"/> 
      <Setter Property="Template"> 
       <Setter.Value> 
        <ControlTemplate TargetType="{x:Type Button}"> 
         <Microsoft_Windows_Themes:ButtonChrome x:Name="Chrome" BorderBrush="{TemplateBinding BorderBrush}" Background="{TemplateBinding Background}" RenderMouseOver="{TemplateBinding IsMouseOver}" RenderPressed="{TemplateBinding IsPressed}" RenderDefaulted="{TemplateBinding IsDefaulted}" SnapsToDevicePixels="true"> 
          <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/> 
         </Microsoft_Windows_Themes:ButtonChrome> 
         <ControlTemplate.Triggers> 
          <Trigger Property="IsKeyboardFocused" Value="true"> 
           <Setter Property="RenderDefaulted" TargetName="Chrome" Value="true"/> 
          </Trigger> 
          <Trigger Property="ToggleButton.IsChecked" Value="true"> 
           <Setter Property="RenderPressed" TargetName="Chrome" Value="true"/> 
          </Trigger> 
          <Trigger Property="IsEnabled" Value="false"> 
           <Setter Property="Foreground" Value="#ADADAD"/> 
          </Trigger> 
         </ControlTemplate.Triggers> 
        </ControlTemplate> 
       </Setter.Value> 
      </Setter> 
     </Style> 

Y entonces sólo lo utilizan:

<StackPanel Orientation="Horizontal" Height="100px" VerticalAlignment="Top"> 
     <StackPanel.Resources> 
      <Style TargetType="Button"> 
       <Setter Property="Margin" Value="2,4" /> 
      </Style> 
     </StackPanel.Resources> 
     <Button Width="127px" Height="79px" VerticalAlignment="Bottom" Style="{StaticResource ButtonStyle1}"> 
     </Button> 
     <Button Style="{StaticResource ButtonStyle1}" >A</Button> 
     <Button Style="{StaticResource ButtonStyle1}">R</Button> 
     <Button Style="{StaticResource ButtonStyle1}">S</Button> 
    </StackPanel> 
+0

De hecho la altura, anchura o cualquier propiedad se puede establecer en el estilo de un botón y luego simplemente aplicar el estilo a su botón – Malcolm

Cuestiones relacionadas