Karsten
Karsten

Reputation: 406

How to inherit from a style and to reach a deep element?

I have a MenuItem-Style called "Home". The new MenuItem-Style "Right" shall inherit from it. The only thing which shall be overwritten is the ImageSource of the Image inside the style. This fancy trick from the last answer isn't doable here, because a style itself does not have a ImageSource-Property.

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
                    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d">
    <Style x:Key="Home" TargetType="{x:Type MenuItem}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type MenuItem}">
                    <ControlTemplate.Resources>
                        <Storyboard x:Key="OnMouseEnter" />
                    </ControlTemplate.Resources>
                    <Grid x:Name="Grid" d:DesignWidth="150" d:DesignHeight="150">
                        <Image x:Name="Image" HorizontalAlignment="Center" VerticalAlignment="Center"
                   Source="/WpfControlLibrary_Battleship;component/Resources/MenuItemBackgrounds/Home.gif" />
                        <Viewbox x:Name="Viewbox">
                            <Label x:Name="Label" Content="{TemplateBinding Header}" />
                        </Viewbox>
                    </Grid>
                    <ControlTemplate.Triggers>
                        <EventTrigger RoutedEvent="Mouse.MouseEnter" SourceName="Grid">
                            <BeginStoryboard x:Name="OnMouseEnter_BeginStoryboard" Storyboard="{StaticResource OnMouseEnter}" />
                        </EventTrigger>
                        <EventTrigger RoutedEvent="Mouse.MouseLeave" SourceName="Grid">
                            <StopStoryboard BeginStoryboardName="OnMouseEnter_BeginStoryboard" />
                        </EventTrigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
        <Setter Property="MinHeight" Value="0" />
        <Setter Property="Padding" Value="0" />
        <Setter Property="VerticalContentAlignment" Value="Center" />
        <Setter Property="HorizontalContentAlignment" Value="Center" />
        <Setter Property="Background" Value="{x:Null}" />
        <Setter Property="Foreground" Value="{x:Null}" />
        <Setter Property="MinWidth" Value="0" />
        <Setter Property="Header" Value="" />
    </Style>
    <Style x:Key="Right" TargetType="{x:Type MenuItem}" BasedOn="{StaticResource Home}">

    </Style>
</ResourceDictionary>


The last question and its solution: How to inherit from a style and to overwrite something?
(The following solution isn't adoptable in this case.)

<Style x:Key="Water" TargetType="Button">
    <Setter Property="Background">
        <Setter.Value>
            <ImageBrush ImageSource="/WpfControlLibrary_Battleship;component/Resources/ButtonBackgrounds/Water.jpg"/>
        </Setter.Value>
    </Setter>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="Grid">
                <Grid Background="{TemplateBinding Background}" ...
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

<Style x:Key="SomeOtherWaterStyle" BasedOn="{StaticResource WaterStyle" TargetType="Grid">
    <Setter Property="Background" Value="Red"/>
</Style>

Upvotes: 0

Views: 190

Answers (1)

flusser
flusser

Reputation: 77

In your case why dont you just use the Icon property of MenuItem to set the image? Use this instead of your Image:

 <ContentPresenter HorizontalAlignment="Center" 
                      VerticalAlignment="Center"
                      ContentSource="Icon" />

and set the Icon property

 <Setter Property="Icon">
      <Setter.Value>
        <Image x:Name="Image"  
               Source="/WpfControlLibrary_Battleship;component/Resources/MenuItemBackgrounds/Home.gif" />
      <Setter.Value>
 </Setter>

Then you can change the Image easily in your inherited Style:

<Style x:Key="Right" TargetType="{x:Type MenuItem}" BasedOn="{StaticResource Home}">
   <Setter Property="Icon">
      <Setter.Value>
        <Image x:Name="Image"  
               Source="/WpfControlLibrary_Battleship;component/Resources/MenuItemBackgrounds/Right.gif" />
      <Setter.Value>
 </Setter>
</Style>

As a general solution or if you could not use the Icon property to this problem i would externd the MenuItem Control, add my desired property and bind to that property in the template.

regards flusser

Upvotes: 1

Related Questions