2016-04-11 11 views
0

WPF uygulamasında düğmeler için özel stiller kullanıyorum; bu, farenin önündeki rengi değiştirir. Bu davranış, yalnızca metin içeren düğmelerde iyi çalışır, ancak bu davranışı vektör simgeleri içeren düğmelerde nasıl gerçekleştireceğimi bilmiyorum.WPF düğmelerine yerleştirilen vektör simgeleri için düğmenin ön plan rengini kullan

Ben mesela benim app çapında kaynak sözlükte (Glyphs.xaml) tanımlanan tüm uygulama vektör simgeler,:

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"> 
    <Canvas x:Key="IconResume" x:Shared="False" Width="28" Height="28"> 
     <Path Fill="#444" Data="M14.811 0.308l12.876 12.876q0.345 0.345 0.345 0.816t-0.345 0.816l-12.876 12.876q-0.345 0.345-0.58 0.236t-0.236-0.58v-26.694q0-0.471 0.236-0.58t0.58 0.236zM4.71 26.767v-25.534q0-0.471 0.345-0.816t0.816-0.345h4.643q0.471 0 0.816 0.345t0.345 0.816v25.534q0 0.471-0.345 0.816t-0.816 0.345h-4.643q-0.471 0-0.816-0.345t-0.345-0.816z" /> 
    </Canvas> 
</ResourceDictionary> 

Sonra düğme olarak:

<Button Command="{Binding ResumeCommand}" Style="{StaticResource BorderlessButton}"> 
    <StackPanel Orientation="Horizontal"> 
     <Viewbox Child="{StaticResource IconResume}" Height="10" Margn="0,0,8,0" /> 
     <TextBlock Text="Resume" /> 
    </StackPanel> 
</Button> 

Ne zaman fare Düğme üzerinde konumlandırılmış olan metin,BorderlessButton stilindeki tetiklemede tanımlanan ön plan rengine doğru renk değiştirir. Ancak vektör simgesi hala renk # 444 (Path.Fill'da tanımlandığı gibi). Vektör simgesinin rengini (tüm kanvas yolları) düğmenin ön plan rengine bağlamak için kolay bir yol var mı?

+0

lütfen, gösteri XAML – StepUp

cevap

1

doğrudan ana Düğme Foreground

<Canvas x:Key="IconResume" x:Shared="False" Width="28" Height="28"> 
    <Path Fill="{Binding Foreground, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=Button}}" Data="M14.811 0.308l12.876 12.876q0.345 0.345 0.345 0.816t-0.345 0.816l-12.876 12.876q-0.345 0.345-0.58 0.236t-0.236-0.58v-26.694q0-0.471 0.236-0.58t0.58 0.236zM4.71 26.767v-25.534q0-0.471 0.345-0.816t0.816-0.345h4.643q0.471 0 0.816 0.345t0.345 0.816v25.534q0 0.471-0.345 0.816t-0.816 0.345h-4.643q-0.471 0-0.816-0.345t-0.345-0.816z" /> 
</Canvas> 

için Path.Fill bağlayabilir VEYA sizin ihtiyacına göre doldurun ayarlamak için Path için çok tetikler koyabilirsiniz: BorderlessButton` `arasında

<Canvas x:Key="IconResume" x:Shared="False" Width="28" Height="28"> 
     <Path x:Name="myPath" Data="M14.811 0.308l12.876 12.876q0.345 0.345 0.345 0.816t-0.345 0.816l-12.876 12.876q-0.345 0.345-0.58 0.236t-0.236-0.58v-26.694q0-0.471 0.236-0.58t0.58 0.236zM4.71 26.767v-25.534q0-0.471 0.345-0.816t0.816-0.345h4.643q0.471 0 0.816 0.345t0.345 0.816v25.534q0 0.471-0.345 0.816t-0.816 0.345h-4.643q-0.471 0-0.816-0.345t-0.345-0.816z"> 
      <Path.Style> 
       <Style TargetType="Path"> 
        <Setter Property="Fill" Value="#444"></Setter> 
        <Style.Triggers> 
         <DataTrigger Binding="{Binding IsMouseOver, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Button}}}" Value="True"> 
          <Setter Property="Fill" Value="Blue"></Setter> 
         </DataTrigger> 
        </Style.Triggers> 
       </Style> 
      </Path.Style> 
     </Path> 
    </Canvas> 
İlgili konular