Áp dụng kiểu cho đường dẫn bên trong ContentPresenter (BasedOn không hoạt động!)

Question

Tôi không thể áp dụng kiểu MouseOver cho Đường dẫn bên trong một ContentPresenter.

Tôi có một phong cách nút chứa một ContentPresenter:

<Style x:Key="ContentButton" TargetType="{x:Type Button}"> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="{x:Type Button}"> 
       <ContentPresenter 
       x:Name="contentPresenter" 
       Content="{TemplateBinding Content}"> 
        <ContentPresenter.Resources> 
        <Style TargetType="{x:Type Path}" 
         BasedOn="{StaticResource ContentButtonPathStyle}"/> 
        </ContentPresenter.Resources> 
       </ContentPresenter> 

Đây là một phong cách để tôi có thể có một hiệu ứng rollover trên Đường dẫn:

<Style x:Key="ContentButtonPathStyle" TargetType="{x:Type Path}"> 
    <Style.Triggers> 
     <Trigger Property="IsMouseOver" Value="True"> 
      <Setter Property="Fill" Value="#FF00FF10"/> 
      <Setter Property="Stroke" Value="Red"/> 
      <Setter Property="StrokeThickness" Value="6"/> 
     </Trigger> 
    </Style.Triggers> 
    <Setter Property="Stroke" Value="Red"/> 
    <Setter Property="Fill"> 
     <Setter.Value> 
      <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"> 
       <GradientStop Color="#FFB4B3E7" Offset="0"/> 
       <GradientStop Color="#FF0800FF" Offset="1"/> 
      </LinearGradientBrush> 
     </Setter.Value> 
    </Setter> 
</Style> 

Tôi cũng có một tập tin tài nguyên cho các biểu tượng với Hộp nhìn có chứa đường dẫn:

<Viewbox x:Key="MyIcon"> 
    <Grid> 
     <Path Data="M78,296 L37.5,306.5 45.5,354.5 123.5,343.5 z" /> 
    </Grid> 
</Viewbox> 

Và cuối cùng, tôi tạo nút và gán Vi ewbox tài nguyên để nội dung:

<Button Style="{DynamicResource ContentButton}"> 
    <ContentPresenter Content="{DynamicResource MyIcon}"/> 
</Button> 

Việc sử dụng "Basedon" để tạo kiểu nội dung của ContentPresenter là một kỹ thuật mà tôi tìm thấy ở đây:

http://social.msdn.microsoft.com/forums/en-US/wpf/thread/412b1747-60e9-4b9a-8f8f-bd56f3aff875/

Tuy nhiên, nó không hoạt động đối với tôi ... Tôi đã dành nhiều giờ cố gắng tìm ra điều này!

Bất kỳ ý tưởng nào?

Cảm ơn!

---

OK dựa trên câu trả lời tuyệt vời của Mackho, đây là XAML cuối cùng của tôi.

Tôi cũng đã thêm một DataTriggeer cho IsPressed, hoạt động tuyệt vời!

Tôi hy vọng điều này sẽ giúp người ...

Thứ nhất, phong cách:

<Style x:Key="ContentButtonPathStyle" TargetType="{x:Type Path}"> 
     <Style.Triggers> 
      <DataTrigger Binding="{Binding RelativeSource= 
       {RelativeSource Mode=FindAncestor, AncestorType={x:Type Button}}, Path=IsMouseOver}" Value="True"> 
       <Setter Property="Fill" Value="Yellow"/> 
       <Setter Property="Stroke" Value="Blue"/> 
      </DataTrigger> 
      <DataTrigger Binding="{Binding RelativeSource= 
       {RelativeSource Mode=FindAncestor, AncestorType={x:Type Button}}, Path=IsPressed}" Value="True"> 
       <Setter Property="Fill" Value="Red"/> 
       <Setter Property="Stroke" Value="Black"/> 
      </DataTrigger> 
     </Style.Triggers> 
     <Setter Property="Fill" Value="Green"/> 
     <Setter Property="Stroke" Value="Red"/> 
    </Style> 

Tiếp theo, biểu tượng riêng của mình:

<Viewbox Stretch="Fill" x:Shared="False" x:Key="MyIcon"> 
     <Path StrokeThickness="6" Data="M160.26077,0.5 L196.5,36.739223 232.73923,0.5 251.12399,18.884777 214.88478,55.124001 251.12399,91.363222 232.73923,109.748 196.5,73.508779 160.26077,109.748 141.87601,91.363222 178.11522,55.124001 141.87601,18.884777 z" Stretch="Fill"/> 
    </Viewbox> 

Sau đó, các mẫu:

<Style x:Key="ContentButton" TargetType="{x:Type Button}"> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="{x:Type Button}"> 
        <ControlTemplate.Resources> 
         <Style TargetType="{x:Type Path}" BasedOn="{StaticResource ContentButtonPathStyle}"/> 
        </ControlTemplate.Resources> 
        <Grid Background="Transparent"><ContentPresenter /></Grid> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 

Và cuối cùng, hãy đặt một vài nút sử dụng mẫu và kiểu:

<Grid> 
    <Button Style="{DynamicResource ContentButton}" HorizontalAlignment="Left" Width="128" Height="128" VerticalAlignment="Top" Margin="85.5,87,0,0"> 
     <ContentPresenter Content="{DynamicResource MyIcon}" d:IsLocked="True"/> 
    </Button> 
    <Button Style="{DynamicResource ContentButton}" Height="64" VerticalAlignment="Top" Margin="0,87,204.5,0" HorizontalAlignment="Right" Width="64"> 
     <ContentPresenter Content="{DynamicResource MyIcon}" d:IsLocked="True"/> 
    </Button> 
    <Button Style="{DynamicResource ContentButton}" Height="96" VerticalAlignment="Bottom" Margin="234,0,0,66.5" HorizontalAlignment="Left" Width="96"> 
     <ContentPresenter Content="{DynamicResource MyIcon}" d:IsLocked="True"/> 
    </Button> 
    <Button Style="{DynamicResource ContentButton}" Height="32" VerticalAlignment="Bottom" Margin="0,0,138.5,130.5" HorizontalAlignment="Right" Width="32"> 
     <ContentPresenter Content="{DynamicResource MyIcon}" d:IsLocked="True"/> 
    </Button> 
</Grid> 

Answer 1

Vấn đề không phải là "BasedOn", bạn có thể xác định toàn bộ kiểu thay vì sử dụng baseon và nó vẫn không hoạt động.Bạn chỉ cần di chuyển stile của bạn trong nguồn ControlTemplate, và nó sẽ làm việc chắc chắn

 <Style x:Key="ContentButton" TargetType="{x:Type Button}"> 
      <Setter Property="Template"> 
       <Setter.Value> 
        <ControlTemplate TargetType="{x:Type Button}"> 
         <ControlTemplate.Resources> 
          <Style TargetType="{x:Type Path}" BasedOn="{StaticResource ContentButtonPathStyle}"/> 
         </ControlTemplate.Resources> 
         <ContentPresenter x:Name="contentPresenter" Content="{TemplateBinding Content}"> 
         </ContentPresenter> 
        </ControlTemplate> 
       </Setter.Value> 
      </Setter> 
     </Style> 

Thành thật mà nói tôi không biết tại sao ta không làm việc bên trong các nguồn lực ContentPresenter :)

Sửa

Nếu bạn muốn thay đổi phong cách đường dựa trên nút di chuột bạn cần để ràng buộc tài sản ismouseover nút một và di chuyển theo phong cách bộ sưu tập con đường bên trong bạn, hãy xem dưới đây

 <Style x:Key="ContentButtonPathStyle" TargetType="{x:Type Path}"> 
      <Style.Triggers> 
       <DataTrigger Binding="{Binding RelativeSource= 
        {RelativeSource Mode=FindAncestor, AncestorType={x:Type Button}}, Path=IsMouseOver}" Value="True"> 
        <Setter Property="Fill" Value="#FF00FF10"/> 
        <Setter Property="Stroke" Value="Red"/> 
        <Setter Property="StrokeThickness" Value="6"/> 
       </DataTrigger> 
      </Style.Triggers> 
      <Setter Property="Stroke" Value="Red"/> 
      <Setter Property="Fill"> 
       <Setter.Value> 
        <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"> 
         <GradientStop Color="#FFB4B3E7" Offset="0"/> 
         <GradientStop Color="#FF0800FF" Offset="1"/> 
        </LinearGradientBrush> 
       </Setter.Value> 
      </Setter> 
     </Style> 


     <Style x:Key="ContentButton" TargetType="{x:Type Button}"> 
      <Setter Property="Template"> 
       <Setter.Value> 
        <ControlTemplate TargetType="{x:Type Button}"> 
         <ContentPresenter x:Name="contentPresenter" /> 
        </ControlTemplate> 
       </Setter.Value> 
      </Setter> 
     </Style> 


     <Viewbox x:Key="MyIcon"> 
      <Grid Background="Transparent"> 
       <Grid.Resources> 
        <Style TargetType="{x:Type Path}" BasedOn="{StaticResource ContentButtonPathStyle}"/> 
       </Grid.Resources> 
       <Path Data="M78,296 L37.5,306.5 45.5,354.5 123.5,343.5 z" /> 
      </Grid> 
     </Viewbox> 

Và chỉ cho bạn biết, nó khá vô dụng căn cứ một phong cách khác và thêm gì cả, bạn có thể sử dụng:

<Path Style="{StaticResource ContentButtonPathStyle}" Data="...." /> 

Hope this helps