2010-05-13 10 views
6

Yığın panelinde bir dizi düğme var. Hepsinin arka plan görüntüsü olmasını istiyorum. Stilleri kullanarak nasıl yapabilirim? her düğme için Arka plan resmini elle ayarlamak istemediğimden.WPF denetimi arka plan görüntüsünü stilleri kullanarak ayarlama?

<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> 

Teşekkür: Burada

bir kod parçacığı olduğunu.

cevap

14

Stil içinde Background özelliği için bir ayar belirtin ve değerini ImageBrush olarak ayarlayın.

<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şağıda buton için tarzıdır ve backgroung görüntü istediğini birine ImageBrush'taki kaynağını değiştirebilirsiniz it.You ayarlanır.

<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> 

Ve sonra sadece bunu kullanın:

<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

Infact yükseklik, genişlik veya herhangi tesis düğmeye tarzında ayarlayın ve sonra sadece düğmeye stili uygulayabilirsiniz – Malcolm