控件模板的ResourceDictionary中的WPF事件 [英] WPF Events in ResourceDictionary for a ControlTemplate
问题描述
我目前正在尝试实现一个Metro样式的窗口。
所以我已经在ResourceDictionary中创建了以下样式:
I'm currently trying to implement a Metro styled Window.
So i've made the following styles inside a ResourceDictionary:
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<!-- Brushes -->
<SolidColorBrush x:Key="BackgroundColor" Color="#FFFFFFFF" />
<!-- Buttons -->
<Style x:Key="MetroControlBoxButton" TargetType="Button">
<Setter Property="Background" Value="{StaticResource BackgroundColor}" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Button">
<ContentPresenter />
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<!-- Windows -->
<Style x:Key="MetroWindow" TargetType="Window">
<Setter Property="UseLayoutRounding" Value="True" />
<Setter Property="WindowStyle" Value="None" />
<Setter Property="ResizeMode" Value="NoResize" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Window">
<Grid Background="{StaticResource BackgroundColor}">
<Grid.RowDefinitions>
<RowDefinition Height="6" />
<RowDefinition Height="24" />
<RowDefinition Height="*" />
<RowDefinition Height="24" />
<RowDefinition Height="6" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="6" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="6" />
</Grid.ColumnDefinitions>
<Rectangle Name="topLeftBorderRectangle" Fill="Red" Grid.Row="0" Grid.Column="0" />
<Rectangle Name="topCenterBorderRectangle" Fill="Orange" Grid.Row="0" Grid.Column="1" />
<Rectangle Name="topRightBorderRectangle" Fill="Red" Grid.Row="0" Grid.Column="2" />
<Rectangle Name="middleLeftBorderRectangle" Fill="Orange" Grid.Row="1" Grid.RowSpan="3" Grid.Column="0" />
<Rectangle Name="middleRightBorderRectangle" Fill="Orange" Grid.Row="1" Grid.RowSpan="3" Grid.Column="2" />
<Rectangle Name="bottomLeftBorderRectangle" Fill="Red" Grid.Row="4" Grid.Column="0" />
<Rectangle Name="bottomCenterBorderRectangle" Fill="Orange" Grid.Row="4" Grid.Column="1" />
<Rectangle Name="bottomRightBorderRectangle" Fill="Red" Grid.Row="4" Grid.Column="2" />
<Rectangle Name="statusBarRectangle" Fill="Yellow" Grid.Row="3" Grid.Column="1" />
<Grid Grid.Row="1" Grid.Column="1">
<Grid.RowDefinitions>
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="28" />
<ColumnDefinition Width="28" />
<ColumnDefinition Width="28" />
</Grid.ColumnDefinitions>
<Rectangle Name="dragRectangle" Fill="Yellow" Grid.Row="0" Grid.Column="1" />
<Button Name="minimizeButton" Content="_" Grid.Row="0" Grid.Column="2" Style="{StaticResource MetroControlBoxButton}" Command="{Binding Path=DataContext.MinimizeCommand, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Window}}}" />
<Button Name="maximizeButton" Content="[]" Grid.Row="0" Grid.Column="3" Style="{StaticResource MetroControlBoxButton}" Command="{Binding Path=DataContext.MaximizeNormalizeCommand, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Window}}}" />
<Button Name="closeButton" Content="X" Grid.Row="0" Grid.Column="4" Style="{StaticResource MetroControlBoxButton}" Command="{Binding Path=DataContext.CloseCommand, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Window}}}" />
</Grid>
<ContentPresenter Grid.Row="2" Grid.Column="1" />
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ResourceDictionary>
我的问题是我不知道如何实现拖动功能。
我的dragRectangle没有Command属性,那么如何使用MVVM在Rectangle上对MouseLeftButtonDown调用DragMove()?
My problem is that i have no idea how to implement de drag feature.
My dragRectangle doesn't have a Command property so how can i call DragMove() on MouseLeftButtonDown on a Rectangle using MVVM?
感谢
推荐答案
ResourceDictionary可以有像Windows等代码,所以你可以添加一个事件处理程序,并调用 DragMove
A ResourceDictionary can have code behind just like Windows etc. so you could add an event handler and call DragMove
from there
Setting up the code behind requires a couple of steps.
>如果您的ResourceDictionary名为 MetroStyleResourceDictionary.xaml
,则在Visual Studio中在 MetroStyleResourceDictionary.xaml.cs
文件中的代码应该如下所示:
- If your ResourceDictionary is called
MetroStyleResourceDictionary.xaml
you add a new file in Visual Studio in the same folder calledMetroStyleResourceDictionary.xaml.cs
The code behind file should then look like this
public partial class MetroStyleResourceDictionary
{
//...
}
之后,您需要将 x:Class
属性添加到Xaml文件中
After that you need to add the x:Class
attribute to the Xaml file
<ResourceDictionary x:Class="YourNamespace.MetroStyleResourceDictionary"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<!--...-->
</ResourceDictionary>
现在,您可以向dragRectangle for MouseLeftButtonDown
。您还需要保留 Window
这样绑定到标记
可能是一个好主意
Now you can add an event handler to the dragRectangle for MouseLeftButtonDown
. You'll also need to get a hold of the Window
so binding that to Tag
might be a good idea
<Rectangle Name="dragRectangle"
MouseLeftButtonDown="dragRectangle_MouseLeftButtonDown"
Tag="{Binding RelativeSource={RelativeSource AncestorType={x:Type Window}}}"
.../>
最后,您可以将事件处理程序添加到代码后面的文件中,如下所示:
And finally you can add the event handler to the code behind file which will look like this
public partial class MetroStyleResourceDictionary
{
void dragRectangle_MouseLeftButtonDown(object sender, System.Windows.Input.MouseButtonEventArgs e)
{
Rectangle dragRectangle = sender as Rectangle;
Window window = dragRectangle.Tag as Window;
if (window != null)
{
window.DragMove();
}
}
}
这篇关于控件模板的ResourceDictionary中的WPF事件的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!