gpt4 book ai didi

wpf - 如何将手动创建的 WPF Menuitem 转换为模板/样式资源/控件模板

转载 作者:行者123 更新时间:2023-12-04 21:16:11 28 4
gpt4 key购买 nike

我已经手动创建了一个 MenuItem。现在我想要它作为模板/样式资源/控制模板 - 无论是最适合这个任务的。

我的 MenuItem 看起来像这样(我知道短代码):

<MenuItem
x:Name="Quit" << OUTSIDE TEMPLATE
Command="{Binding ShutdownCommand}"> << OUTSIDE TEMPLATE
<MenuItem.Header>
<StackPanel
Orientation="Horizontal">
<TextBlock
Width="150"
Text="Quit ERD Builder"/> << OUTSIDE TEMPLATE
<TextBlock
Width="80"
Margin="0,2,0,0"
TextAlignment="Right">
<Border
Padding="4,0,4,0"
BorderBrush="#B0B0B0"
Background="#fff"
BorderThickness="1"
CornerRadius="6">
<TextBlock
Width="Auto"
Text="Alt+F4" << OUTSIDE TEMPLATE
FontSize="10"
Foreground="#555" />
</Border>
</TextBlock>
</StackPanel>
</MenuItem.Header>
<MenuItem.Icon>
<Image
Width="16"
Height="16"
Margin="0,0,5,0"
HorizontalAlignment="Center"
VerticalAlignment="Center"
RenderOptions.BitmapScalingMode="HighQuality"
SnapsToDevicePixels="True">
<Image.Source>
<BitmapImage
UriSource="/ERDBuilder;component/icons/bw/102-walk.png" /> << OUTSIDE TEMPLATE
</Image.Source>
</Image>
</MenuItem.Icon>

我用 << OUTSIDE TEMPLATE 声明的行是我想在 MenuItem 中声明的行,而不是在 Template 中声明的行.

我已经尝试过一些样式,但例如“背景”由于某种原因不会工作。我可以更改“FontSize”但不能更改“背景”颜色:
<Style 
x:Key="TopTaskBarMenuitem"
TargetType="MenuItem">
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Background" Value="#ffff00" /> << DONT WORK
<Setter Property="FontSize" Value="20" /> << WORKS
</Trigger>
</Style.Triggers>
<Setter Property="Foreground" Value="#000" /> << WORKS
<Setter Property="BorderThickness" Value="1" /> << WORKS
<Setter Property="Width" Value="150"/> << WORKS

这是菜单如果我手动“XAML”它的外观:

Manualy created Menuitem (我不允许在这里上传图片?!)

这是带有静态样式资源的 Menuitem:

Menuitem with Style Resource

如您所见,“背景”颜色不会影响菜单项。

如果我能希望我得到一些东西,我会在“菜单项”侧有这样的东西:
<MenuItem
Style="{StaticResource TopTaskBarMenuitem}" << TEMPLATE / STYLE BINDING
x:Name="Quit" << OUTSIDE TEMPLATE
Command="{Binding ShutdownCommand}" << OUTSIDE TEMPLATE
MyHeaderText="Quit ERD Builder"/> << OUTSIDE TEMPLATE
MyShortcutText="Alt+F4" << OUTSIDE TEMPLATE
MyUriSource="/ERDBuilder;component/icons/bw/102-walk.png" /> << OUTSIDE TEMPLATE

非常感谢他们会提供帮助!

PS:这里的所有三个代码发布都缺少最后一个代码行。我不知道为什么。我无法解决这个问题。

短剑

最佳答案

要获得此功能,您必须创建自己的从 MenuItem 派生的控件。

您需要做的就是使用 DependencyProperties 创建控件类以利用其所有优点,请阅读 this更多:

namespace MyControls
{
class MyMenuItem : MenuItem
{
public string MyHeaderText
{
get { return (string)GetValue(MyHeaderTextProperty); }
set { SetValue(MyHeaderTextProperty, value); }
}
public static readonly DependencyProperty MyHeaderTextProperty = DependencyProperty.Register("MyHeaderText", typeof(string), typeof(MyMenuItem));

public string MyShortcutText
{
get { return (string)GetValue(MyShortcutTextProperty); }
set { SetValue(MyShortcutTextProperty, value); }
}
public static readonly DependencyProperty MyShortcutTextProperty = DependencyProperty.Register("MyShortcutText", typeof(string), typeof(MyMenuItem));

public string MyUriSource
{
get { return (string)GetValue(MyUriSourceProperty); }
set { SetValue(MyUriSourceProperty, value); }
}
public static readonly DependencyProperty MyUriSourceProperty = DependencyProperty.Register("MyUriSource", typeof(string), typeof(MyMenuItem));
}
}

现在您可以实例化您的控件,但您仍然需要“重新模板化”它:
<mc:MyMenuItem MyHeaderText="Quit ERD Builder" MyShortcutText="Alt+F4" MyUriSource="/ERDBuilder;component/icons/bw/102-walk.png">
<mc:MyMenuItem.Style>
<Style TargetType="mc:MyMenuItem">
<Style.Setters>
<Setter Property="HeaderTemplate">
<Setter.Value>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<TextBlock Width="150" Text="{Binding Mode=TwoWay, Path=MyHeaderText, RelativeSource={RelativeSource FindAncestor, AncestorType=mc:MyMenuItem}}"/>
<TextBlock Width="80" Margin="0,2,0,0" TextAlignment="Right">
<Border Padding="4,0,4,0" BorderBrush="#B0B0B0" Background="#fff" BorderThickness="1" CornerRadius="6">
<TextBlock Width="Auto" Text="{Binding Mode=TwoWay, Path=MyShortcutText, RelativeSource={RelativeSource FindAncestor, AncestorType=mc:MyMenuItem}}" FontSize="10" Foreground="#555" />
</Border>
</TextBlock>
</StackPanel>
</DataTemplate>
</Setter.Value>
</Setter>
<Setter Property="Icon">
<Setter.Value>
<Image Width="16" Height="16" Margin="0,0,5,0" HorizontalAlignment="Center" VerticalAlignment="Center" RenderOptions.BitmapScalingMode="HighQuality" SnapsToDevicePixels="True" Source="{Binding Mode=OneWay, Path=MyUriSource, RelativeSource={RelativeSource FindAncestor, AncestorType=mc:MyMenuItem}}" />
</Setter.Value>
</Setter>
</Style.Setters>
</Style>
</mc:MyMenuItem.Style>
</mc:MyMenuItem>

不要忘记在您的窗口(或您可以放置​​此控件的任何地方)标记中引用此新控件的命名空间:
xmlns:mc="clr-namespace:MyControls"

可以在 ResourceDictionary 中插入此样式,因此您无需在每次使用此控件时都引用它。
<Style TargetType="mc:MyMenuItem">
<!-- Style comes here -->
</Style>

然后你可以得到你所问的:
<mc:MyMenuItem MyHeaderText="Quit ERD Builder" MyShortcutText="Alt+F4" MyUriSource="/ERDBuilder;component/icons/bw/102-walk.png" />

我希望它可以帮助你!

关于wpf - 如何将手动创建的 WPF Menuitem 转换为模板/样式资源/控件模板,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12955983/

28 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com