如何在C# WPF中更新MenuItem控件模板

huangapple go评论60阅读模式
英文:

How to update MenuItem Control Template in c# wpf

问题

我是新手c# wpf应用程序,我试图在c# wpf应用程序中使用样式更新默认的MenuItem控件模板。我试图在xaml中使用Tag来更新材料设计图标Kind为User。

<MenuItem Header="测试菜单项" Style="{StaticResource MenuItemCustomStyle}" Tag="User"/>

在样式中,我使用模板绑定来更新PackIcon的Kind。

<Style x:Key="MenuItemCustomStyle" TargetType="{x:Type MenuItem}">
    <Setter Property="Height" Value="40"/>
    <Setter Property="HorizontalAlignment" Value="Stretch"/>
    <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
    <Setter Property="VerticalAlignment" Value="Stretch"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type MenuItem}">
                <StackPanel x:Name="stackpanel" HorizontalAlignment="Stretch" Orientation="Horizontal" VerticalAlignment="Stretch">
                    <materialDesign:PackIcon x:Name="menuItemIcon" Height="25" Kind="{TemplateBinding Tag}" Margin="10,5,5,10" Width="25"/>
                    <TextBlock x:Name="menuItemTitle" Foreground="Gray" FontSize="16" Margin="0,7" Text="{TemplateBinding Header}"/>
                </StackPanel>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="True">
                        <Setter Property="Foreground" TargetName="menuItemIcon" Value="White"/>
                        <Setter Property="Background" TargetName="stackpanel" Value="DarkGray"/>
                        <Setter Property="Foreground" TargetName="menuItemTitle" Value="White"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

我该如何在c# wpf应用程序中实现它?我是否漏掉了什么?我应该使用依赖属性来实现吗?如果是的话,如何做到?

英文:

I am new to c# wpf application and I am trying to update default MenuItem control template using style in c# wpf application. I am trying to update material design icon Kind to User using Tag in xaml.

&lt;MenuItem Header=&quot;Test Menu Item&quot; Style=&quot;{StaticResource MenuItemCustomStyle}&quot; Tag=&quot;User&quot;/&gt;

In the styles I am using template binding to update Kind of PackIcon.

        &lt;Style x:Key=&quot;MenuItemCustomStyle&quot; TargetType=&quot;{x:Type MenuItem}&quot;&gt;
        &lt;Setter Property=&quot;Height&quot; Value=&quot;40&quot;/&gt;
        &lt;Setter Property=&quot;HorizontalAlignment&quot; Value=&quot;Stretch&quot;/&gt;
        &lt;Setter Property=&quot;HorizontalContentAlignment&quot; Value=&quot;Stretch&quot;/&gt;
        &lt;Setter Property=&quot;VerticalAlignment&quot; Value=&quot;Stretch&quot;/&gt;
        &lt;Setter Property=&quot;Template&quot;&gt;
            &lt;Setter.Value&gt;
                &lt;ControlTemplate TargetType=&quot;{x:Type MenuItem}&quot;&gt;
                    &lt;StackPanel x:Name=&quot;stackpanel&quot; HorizontalAlignment=&quot;Stretch&quot; Orientation=&quot;Horizontal&quot; VerticalAlignment=&quot;Stretch&quot;&gt;
                        &lt;materialDesign:PackIcon x:Name=&quot;menuItemIcon&quot; Height=&quot;25&quot; Kind=&quot;{TemplateBinding Tag}&quot; Margin=&quot;10,5,5,10&quot; Width=&quot;25&quot;/&gt;
                        &lt;TextBlock x:Name=&quot;menuItemTitle&quot; Foreground=&quot;Gray&quot; FontSize=&quot;16&quot; Margin=&quot;0,7&quot; Text=&quot;{TemplateBinding Header}&quot;/&gt;
                    &lt;/StackPanel&gt;
                    &lt;ControlTemplate.Triggers&gt;
                        &lt;Trigger Property=&quot;IsMouseOver&quot; Value=&quot;True&quot;&gt;
                            &lt;Setter Property=&quot;Foreground&quot; TargetName=&quot;menuItemIcon&quot; Value=&quot;White&quot;/&gt;
                            &lt;Setter Property=&quot;Background&quot; TargetName=&quot;stackpanel&quot; Value=&quot;DarkGray&quot;/&gt;
                            &lt;Setter Property=&quot;Foreground&quot; TargetName=&quot;menuItemTitle&quot; Value=&quot;White&quot;/&gt;
                        &lt;/Trigger&gt;
                    &lt;/ControlTemplate.Triggers&gt;
                &lt;/ControlTemplate&gt;
            &lt;/Setter.Value&gt;
        &lt;/Setter&gt;
    &lt;/Style&gt;

How do I achieve it in c# wpf application. Am I missing something. Should I be using Dependency property to achieve it. If yes, How?

答案1

得分: 1

RelativeSource=&quot;{RelativeSource TemplatedParent}&quot;将绑定的源设置为父级,即此情况下的MenuItem。这允许您在控件模板中访问MenuItem的属性。

<materialDesign:PackIcon x:Name=&quot;menuItemIcon&quot; Height=&quot;25&quot; Margin=&quot;10,5,5,10&quot; Width=&quot;25&quot;>
    <materialDesign:PackIcon.Kind>
        <Binding RelativeSource=&quot;{RelativeSource TemplatedParent}&quot; Path=&quot;Tag&quot;/>
    </materialDesign:PackIcon.Kind>
</materialDesign:PackIcon>

完整示例:

<Window x:Class=&quot;WpfApp12.MainWindow&quot;
        xmlns=&quot;http://schemas.microsoft.com/winfx/2006/xaml/presentation&quot;
        xmlns:x=&quot;http://schemas.microsoft.com/winfx/2006/xaml&quot;
        xmlns:d=&quot;http://schemas.microsoft.com/expression/blend/2008&quot;
        xmlns:mc=&quot;http://schemas.openxmlformats.org/markup-compatibility/2006&quot;
        xmlns:materialDesign=&quot;http://materialdesigninxaml.net/winfx/xaml/themes&quot;
        mc:Ignorable=&quot;d&quot;
        Title=&quot;MainWindow&quot; Height=&quot;450&quot; Width=&quot;800&quot;>
    <Window.Resources>
        <Style x:Key=&quot;MenuItemCustomStyle&quot; TargetType=&quot;{x:Type MenuItem}&quot;>
            <Setter Property=&quot;Height&quot; Value=&quot;40&quot;/>
            <Setter Property=&quot;HorizontalAlignment&quot; Value=&quot;Stretch&quot;/>
            <Setter Property=&quot;HorizontalContentAlignment&quot; Value=&quot;Stretch&quot;/>
            <Setter Property=&quot;VerticalAlignment&quot; Value=&quot;Stretch&quot;/>
            <Setter Property=&quot;Template&quot;>
                <Setter.Value>
                    <ControlTemplate TargetType=&quot;{x:Type MenuItem}&quot;>
                        <StackPanel x:Name=&quot;stackpanel&quot; HorizontalAlignment=&quot;Stretch&quot; Orientation=&quot;Horizontal&quot; VerticalAlignment=&quot;Stretch&quot;>
                            <materialDesign:PackIcon x:Name=&quot;menuItemIcon&quot; Height=&quot;25&quot; Margin=&quot;10,5,5,10&quot; Width=&quot;25&quot;>
                                <materialDesign:PackIcon.Kind>
                                    <Binding RelativeSource=&quot;{RelativeSource TemplatedParent}&quot; Path=&quot;Tag&quot;/>
                                </materialDesign:PackIcon.Kind>
                            </materialDesign:PackIcon>
                            <TextBlock x:Name=&quot;menuItemTitle&quot; Foreground=&quot;Gray&quot; FontSize=&quot;16&quot; Margin=&quot;0,7&quot; Text=&quot;{TemplateBinding Header}&quot;/>
                        </StackPanel>
                        <ControlTemplate.Triggers>
                            <Trigger Property=&quot;IsMouseOver&quot; Value=&quot;True&quot;>
                                <Setter Property=&quot;Foreground&quot; TargetName=&quot;menuItemIcon&quot; Value=&quot;White&quot;/>
                                <Setter Property=&quot;Background&quot; TargetName=&quot;stackpanel&quot; Value=&quot;DarkGray&quot;/>
                                <Setter Property=&quot;Foreground&quot; TargetName=&quot;menuItemTitle&quot; Value=&quot;White&quot;/>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </Window.Resources>
    <Grid>
        <MenuItem Header=&quot;Test Menu Item&quot; Style=&quot;{StaticResource MenuItemCustomStyle}&quot; Tag=&quot;User&quot;/>
    </Grid>
</Window>
英文:

RelativeSource=&quot;{RelativeSource TemplatedParent}&quot; sets the source of the binding to the parent, which is the MenuItem in this case. This allows you to access properties of the MenuItem within the control template.

&lt;materialDesign:PackIcon x:Name=&quot;menuItemIcon&quot; Height=&quot;25&quot; Margin=&quot;10,5,5,10&quot; Width=&quot;25&quot;&gt;
&lt;materialDesign:PackIcon.Kind&gt;
&lt;Binding RelativeSource=&quot;{RelativeSource TemplatedParent}&quot; Path=&quot;Tag&quot;/&gt;
&lt;/materialDesign:PackIcon.Kind&gt;
&lt;/materialDesign:PackIcon&gt;

Full sample:

&lt;Window x:Class=&quot;WpfApp12.MainWindow&quot;
xmlns=&quot;http://schemas.microsoft.com/winfx/2006/xaml/presentation&quot;
xmlns:x=&quot;http://schemas.microsoft.com/winfx/2006/xaml&quot;
xmlns:d=&quot;http://schemas.microsoft.com/expression/blend/2008&quot;
xmlns:mc=&quot;http://schemas.openxmlformats.org/markup-compatibility/2006&quot;
xmlns:materialDesign=&quot;http://materialdesigninxaml.net/winfx/xaml/themes&quot;
mc:Ignorable=&quot;d&quot;
Title=&quot;MainWindow&quot; Height=&quot;450&quot; Width=&quot;800&quot;&gt;
&lt;Window.Resources&gt;
&lt;Style x:Key=&quot;MenuItemCustomStyle&quot; TargetType=&quot;{x:Type MenuItem}&quot;&gt;
&lt;Setter Property=&quot;Height&quot; Value=&quot;40&quot;/&gt;
&lt;Setter Property=&quot;HorizontalAlignment&quot; Value=&quot;Stretch&quot;/&gt;
&lt;Setter Property=&quot;HorizontalContentAlignment&quot; Value=&quot;Stretch&quot;/&gt;
&lt;Setter Property=&quot;VerticalAlignment&quot; Value=&quot;Stretch&quot;/&gt;
&lt;Setter Property=&quot;Template&quot;&gt;
&lt;Setter.Value&gt;
&lt;ControlTemplate TargetType=&quot;{x:Type MenuItem}&quot;&gt;
&lt;StackPanel x:Name=&quot;stackpanel&quot; HorizontalAlignment=&quot;Stretch&quot; Orientation=&quot;Horizontal&quot; VerticalAlignment=&quot;Stretch&quot;&gt;
&lt;materialDesign:PackIcon x:Name=&quot;menuItemIcon&quot; Height=&quot;25&quot; Margin=&quot;10,5,5,10&quot; Width=&quot;25&quot;&gt;
&lt;materialDesign:PackIcon.Kind&gt;
&lt;Binding RelativeSource=&quot;{RelativeSource TemplatedParent}&quot; Path=&quot;Tag&quot;/&gt;
&lt;/materialDesign:PackIcon.Kind&gt;
&lt;/materialDesign:PackIcon&gt;
&lt;TextBlock x:Name=&quot;menuItemTitle&quot; Foreground=&quot;Gray&quot; FontSize=&quot;16&quot; Margin=&quot;0,7&quot; Text=&quot;{TemplateBinding Header}&quot;/&gt;
&lt;/StackPanel&gt;
&lt;ControlTemplate.Triggers&gt;
&lt;Trigger Property=&quot;IsMouseOver&quot; Value=&quot;True&quot;&gt;
&lt;Setter Property=&quot;Foreground&quot; TargetName=&quot;menuItemIcon&quot; Value=&quot;White&quot;/&gt;
&lt;Setter Property=&quot;Background&quot; TargetName=&quot;stackpanel&quot; Value=&quot;DarkGray&quot;/&gt;
&lt;Setter Property=&quot;Foreground&quot; TargetName=&quot;menuItemTitle&quot; Value=&quot;White&quot;/&gt;
&lt;/Trigger&gt;
&lt;/ControlTemplate.Triggers&gt;
&lt;/ControlTemplate&gt;
&lt;/Setter.Value&gt;
&lt;/Setter&gt;
&lt;/Style&gt;
&lt;/Window.Resources&gt;
&lt;Grid&gt;
&lt;MenuItem Header=&quot;Test Menu Item&quot; Style=&quot;{StaticResource MenuItemCustomStyle}&quot; Tag=&quot;User&quot;/&gt;
&lt;/Grid&gt;
&lt;/Window&gt;

huangapple
  • 本文由 发表于 2023年6月22日 17:03:05
  • 转载请务必保留本文链接:https://go.coder-hub.com/76530219.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定