在代码后面处理事件以及在某些事件

时间:2015-12-02 06:27:31

标签: wpf mvvm routed-events

以下是概述:

我正在使用自定义控件(CusCtrl)来显示任务栏图标,它还具有弹出属性。因此,当您单击图标时,CusCtrl会显示弹出窗口。

我正在使用UserControl设置弹出窗口的子项(假设 UC1 )。

我使用ViewModel设置CusCtrl的DataContext,因此即使UC1与相应的ViewModel绑定(假设 VM1

现在UC1有一些元素 - 一个标签,点击标签我需要做两件事:

  1. 在视图模型VM1上调用命令 -

    从命令我需要将一些视图模型的属性作为参数传递并打开一些窗口UI。

  2. 关闭PopUp -

    为此,我想到在UserControl&的代码后面监听MouseUp事件。然后触发路由事件( FirePopUpClose - 此事件在UserControl UC1中定义),该事件将由app&然后从内部 处理程序,将调用Custom Conntrol的ClosePopUp方法。

  3. 我知道如何使用Interactivity dll在标签上调用MouseUp事件的命令,但是如何引发FirePopUpClose路由事件呢?

    或者如何在标签上应用MouseUp事件处理程序以及将命令绑定到该标签?

    我是否认为这是正确的方法,或者有更好的方法来做一些UI动作以及通过坚持MVVM来关闭PopUp?

1 个答案:

答案 0 :(得分:0)

下一个解决方案呢?尝试使用Popup.IsOpen属性(here is the information about,这是使用#867 – Controlling Whether a Popup Is Open Using Data Binding)的示例。直接将它绑定到UC1 DataContext或通过CusCtrl用户控件的DependencyProperty绑定(您必须在控件中创建封装Popup的属性)。总而言之,通过这种方式,您可以管理弹出窗口,无需事件即可打开或关闭。

<强>更新 尝试下一个:  1.主要Xaml:

<Window x:Class="PopupIsOpenDataBindingHelpAttempt.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:popupIsOpenDataBindingHelpAttempt="clr-namespace:PopupIsOpenDataBindingHelpAttempt"
    xmlns:system="clr-namespace:System;assembly=mscorlib"
    Title="MainWindow" Height="350" Width="525">
<Window.DataContext>
    <popupIsOpenDataBindingHelpAttempt:DemoMainViewModel/>
</Window.DataContext>
<Window.Resources>
    <DataTemplate x:Key="PopupInnerControlDataTemplateKey" DataType="{x:Type popupIsOpenDataBindingHelpAttempt:TaskBarDemoViewModel}">
        <Grid Width="150" Height="85">
            <Grid.RowDefinitions>
                <RowDefinition></RowDefinition>
                <RowDefinition></RowDefinition>
            </Grid.RowDefinitions>
            <TextBlock Grid.Row="0" Text="{Binding TextString}"
                       Margin="5" Foreground="Red"
                       Width="150" TextWrapping="WrapWithOverflow"
                       VerticalAlignment="Stretch" HorizontalAlignment="Stretch"/>
            <Button    Grid.Row="1" Content="Press to close" Command="{Binding PopupInnerButtonCommand}"
                    VerticalAlignment="Stretch" HorizontalAlignment="Stretch"/>
        </Grid>
    </DataTemplate>
    <Image x:Key="ImageControl" Source="Pic/2015_10_16_Bing_en-US.jpg" IsHitTestVisible="False"/>
</Window.Resources>
<Grid Width="75" Height="75" HorizontalAlignment="Center" VerticalAlignment="Center">
    <popupIsOpenDataBindingHelpAttempt:TaskBarIconProjectDemo 
        ButtonContentProperty="{StaticResource ImageControl}"
        ButtonCommandProperty="{Binding ShowPopupCommand}"
        PopupIsOpenProperty="{Binding IsPopupOpen, UpdateSourceTrigger=PropertyChanged}"
        PopupInnerContentControlDataContext="{Binding TaskBarDemoViewModel, UpdateSourceTrigger=PropertyChanged}"
        PopupInnerContentControlContentTemplate="{StaticResource PopupInnerControlDataTemplateKey}"/>
</Grid>

 2.弹出封装XAMl:

<UserControl x:Class="PopupIsOpenDataBindingHelpAttempt.TaskBarIconProjectDemo"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
         mc:Ignorable="d" 
         d:DesignHeight="300" d:DesignWidth="300" x:Name="This">
<Grid>
    <Button Style="{StaticResource SpecialButtonStyle}" Command="{Binding ElementName=This, Path=ButtonCommandProperty}" 
            Content="{Binding ElementName=This, Path=ButtonContentProperty}"></Button>
    <Popup IsOpen="{Binding ElementName=This, Path=PopupIsOpenProperty}">
        <ContentControl Content="{Binding ElementName=This, Path=PopupInnerContentControlDataContext}" 
                        ContentTemplate="{Binding ElementName=This, Path=PopupInnerContentControlContentTemplate}"/>
    </Popup>
</Grid>

 3.弹出封装控制代码(依赖属性):

public partial class TaskBarIconProjectDemo : UserControl
{
    public static readonly DependencyProperty ButtonCommandPropertyProperty = DependencyProperty.Register("ButtonCommandProperty", typeof (ICommand), typeof (TaskBarIconProjectDemo), new PropertyMetadata(default(ICommand)));
    public static readonly DependencyProperty PopupIsOpenPropertyProperty = DependencyProperty.Register("PopupIsOpenProperty", typeof (bool), typeof (TaskBarIconProjectDemo), new PropertyMetadata(default(bool)));
    public static readonly DependencyProperty PopupInnerContentControlDataContextProperty = DependencyProperty.Register("PopupInnerContentControlDataContext", typeof (object), typeof (TaskBarIconProjectDemo), new PropertyMetadata(default(object)));
    public static readonly DependencyProperty PopupInnerContentControlContentTemplateProperty = DependencyProperty.Register("PopupInnerContentControlContentTemplate", typeof (DataTemplate), typeof (TaskBarIconProjectDemo), new PropertyMetadata(default(DataTemplate)));
    public static readonly DependencyProperty ButtonContentPropertyProperty = DependencyProperty.Register("ButtonContentProperty", typeof (object), typeof (TaskBarIconProjectDemo), new PropertyMetadata(default(object)));

    public TaskBarIconProjectDemo()
    {
        InitializeComponent();
    }

    public ICommand ButtonCommandProperty
    {
        get { return (ICommand) GetValue(ButtonCommandPropertyProperty); }
        set { SetValue(ButtonCommandPropertyProperty, value); }
    }

    public bool PopupIsOpenProperty
    {
        get { return (bool) GetValue(PopupIsOpenPropertyProperty); }
        set { SetValue(PopupIsOpenPropertyProperty, value); }
    }

    public object PopupInnerContentControlDataContext
    {
        get { return (object) GetValue(PopupInnerContentControlDataContextProperty); }
        set { SetValue(PopupInnerContentControlDataContextProperty, value); }
    }

    public DataTemplate PopupInnerContentControlContentTemplate
    {
        get { return (DataTemplate) GetValue(PopupInnerContentControlContentTemplateProperty); }
        set { SetValue(PopupInnerContentControlContentTemplateProperty, value); }
    }

    public object ButtonContentProperty
    {
        get { return (object) GetValue(ButtonContentPropertyProperty); }
        set { SetValue(ButtonContentPropertyProperty, value); }
    }
}

4。查看模特:

    public class DemoMainViewModel:BaseObservableObject
{
    private bool _isOpen;
    private TaskBarDemoViewModel _taskBarDemoViewModel;
    private ICommand _showPopupCommnad;

    public DemoMainViewModel()
    {
        TaskBarDemoViewModel = new TaskBarDemoViewModel(ClosePopup, "Here you can put your content. Go for it...");
    }

    private void ClosePopup()
    {
        IsPopupOpen = false;
    }

    public bool IsPopupOpen
    {
        get { return _isOpen; }
        set
        {
            _isOpen = value;
            OnPropertyChanged();
        }
    }

    public TaskBarDemoViewModel TaskBarDemoViewModel    
    {
        get { return _taskBarDemoViewModel; }
        set
        {
            _taskBarDemoViewModel = value;
            OnPropertyChanged();
        }
    }

    public ICommand ShowPopupCommand
    {
        get { return _showPopupCommnad ?? (_showPopupCommnad = new RelayCommand(ShowPopup)); }
    }

    private void ShowPopup()
    {
        IsPopupOpen = true;
    }
}

public class TaskBarDemoViewModel:BaseObservableObject
{
    private readonly Action _closePopupCommand;
    private ICommand _command;
    private string _textString;

    public TaskBarDemoViewModel(Action closePopupCommand, string content)
    {
        _closePopupCommand = closePopupCommand;
        TextString = content;
    }

    public ICommand PopupInnerButtonCommand
    {
        get { return _command ?? (_command = new RelayCommand(TargetMethod)); }
    }

    private void TargetMethod()
    {
        //add your logic here
        if(_closePopupCommand == null) return;
        _closePopupCommand();
    }

    public string TextString
    {
        get { return _textString; }
        set
        {
            _textString = value;
            OnPropertyChanged();
        }
    }
}

5。按钮样式(根据需要更改):

    <Color x:Key="ButtonLowerPartKey">#FFD5E0EE</Color>
    <Color x:Key="ButtonUpperPartKey">#FFEAF1F8</Color>
    <Color x:Key="PressedColorButtonLowerPartKey">#FFF4C661</Color>
    <Color x:Key="PressedButtonUpperPartKey">#FFF4CC87</Color>
    <Color x:Key="HooveredButtonLowerPartKey">#FFFFD06D</Color>
    <Color x:Key="HooveredButtonUpperPartKey">#FFFFF0DF</Color>
    <Style x:Key="SpecialButtonStyle" TargetType="Button" BasedOn="{StaticResource {x:Type Button}}">
        <Setter Property="Padding" Value="5">
        </Setter>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate>
                    <Grid x:Name="Grid">
                        <Ellipse x:Name="ButtonControlBorder" Stroke="{TemplateBinding BorderBrush}" 
                                 StrokeThickness="{TemplateBinding BorderThickness}" 
                                 Width="{TemplateBinding Width}" Height="{TemplateBinding Height}">
                            <Ellipse.Fill>
                                <LinearGradientBrush x:Name="BrushKey" MappingMode="RelativeToBoundingBox" SpreadMethod="Repeat" StartPoint="0.5,0" EndPoint="0.5,1">
                                    <LinearGradientBrush.GradientStops>
                                        <GradientStop Offset="0.5" Color="{StaticResource ButtonUpperPartKey}" />
                                        <GradientStop Offset="0.5" Color="{StaticResource ButtonUpperPartKey}" />
                                        <GradientStop Offset="0.5" Color="{StaticResource ButtonLowerPartKey}" />
                                    </LinearGradientBrush.GradientStops>
                                </LinearGradientBrush>
                            </Ellipse.Fill>
                        </Ellipse>
                        <Ellipse x:Name="Pressed" Width="{TemplateBinding Width}" Height="{TemplateBinding Height}" Opacity="0">
                            <Ellipse.Fill>
                                <LinearGradientBrush x:Name="PressedBrushKey" MappingMode="RelativeToBoundingBox" SpreadMethod="Repeat" StartPoint="0.5,0" EndPoint="0.5,1">
                                    <LinearGradientBrush.GradientStops>
                                        <GradientStop Offset="0.5" Color="{StaticResource PressedButtonUpperPartKey}" />
                                        <GradientStop Offset="0.5" Color="{StaticResource PressedButtonUpperPartKey}" />
                                        <GradientStop Offset="0.5" Color="{StaticResource PressedColorButtonLowerPartKey}" />
                                    </LinearGradientBrush.GradientStops>
                                </LinearGradientBrush>
                            </Ellipse.Fill>
                        </Ellipse>
                        <Ellipse x:Name="InnerPressed" 
                                Width="{Binding ElementName=Pressed, Path=Width}" Height="{Binding ElementName=Pressed, Path=Height}" 
                                Stroke="DarkOrange" Opacity="0" StrokeThickness="1" SnapsToDevicePixels="True" Fill="Transparent"/>
                        <ContentPresenter Content="{TemplateBinding Button.Content}" HorizontalAlignment="Center" VerticalAlignment="Center">
                            <ContentPresenter.OpacityMask>
                                <VisualBrush Visual="{Binding ElementName=ButtonControlBorder}" />
                            </ContentPresenter.OpacityMask>
                        </ContentPresenter>
                        <Grid.Triggers>
                            <EventTrigger RoutedEvent="Mouse.MouseEnter">
                                <BeginStoryboard x:Name="MouseEnterStoryboard">
                                    <Storyboard>
                                        <ColorAnimation Storyboard.TargetName="BrushKey" Storyboard.TargetProperty="GradientStops[0].Color" From="{StaticResource ButtonUpperPartKey}" To="{StaticResource HooveredButtonUpperPartKey}" Duration="0:0:0.3" AutoReverse="False" />
                                        <ColorAnimation Storyboard.TargetName="BrushKey" Storyboard.TargetProperty="GradientStops[2].Color" From="{StaticResource ButtonLowerPartKey}" To="{StaticResource HooveredButtonLowerPartKey}" Duration="0:0:0.3" />
                                    </Storyboard>
                                </BeginStoryboard>
                            </EventTrigger>
                            <EventTrigger RoutedEvent="Mouse.MouseLeave">
                                <BeginStoryboard>
                                    <Storyboard>
                                        <ColorAnimation Storyboard.TargetName="BrushKey" Storyboard.TargetProperty="GradientStops[0].Color" From="{StaticResource HooveredButtonUpperPartKey}" To="{StaticResource ButtonUpperPartKey}" Duration="0:0:1" AutoReverse="False" />
                                        <ColorAnimation Storyboard.TargetName="BrushKey" Storyboard.TargetProperty="GradientStops[2].Color" From="{StaticResource HooveredButtonLowerPartKey}" To="{StaticResource ButtonLowerPartKey}" Duration="0:0:1" />
                                    </Storyboard>
                                </BeginStoryboard>
                            </EventTrigger>
                        </Grid.Triggers>
                    </Grid>
                    <ControlTemplate.Resources>
                        <Storyboard x:Key="MouseUpTimeLine">
                            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="Pressed" Storyboard.TargetProperty="Opacity">
                                <SplineDoubleKeyFrame KeyTime="00:00:00.25" Value="0" />
                            </DoubleAnimationUsingKeyFrames>
                        </Storyboard>
                        <Storyboard x:Key="MouseDownTimeLine">
                            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="Pressed" Storyboard.TargetProperty="Opacity">
                                <SplineDoubleKeyFrame KeyTime="00:00:00.05" Value="0.8" />
                            </DoubleAnimationUsingKeyFrames>
                        </Storyboard>
                        <Storyboard x:Key="InnerPressedMouseUpTimeLine">
                            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="InnerPressed" Storyboard.TargetProperty="Opacity">
                                <SplineDoubleKeyFrame KeyTime="00:00:00.25" Value="0" />
                            </DoubleAnimationUsingKeyFrames>
                        </Storyboard>
                        <Storyboard x:Key="InnerPressedMouseDownTimeLine">
                            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="InnerPressed" Storyboard.TargetProperty="Opacity">
                                <SplineDoubleKeyFrame KeyTime="00:00:00.05" Value="1" />
                            </DoubleAnimationUsingKeyFrames>
                        </Storyboard>
                    </ControlTemplate.Resources>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsMouseOver" SourceName="Grid" Value="True">
                            <Setter Property="Stroke" TargetName="ButtonControlBorder">
                                <Setter.Value>
                                    <SolidColorBrush Color="{StaticResource HooveredButtonLowerPartKey}">
                                    </SolidColorBrush>
                                </Setter.Value>
                            </Setter>
                        </Trigger>
                        <Trigger Property="ButtonBase.IsPressed" Value="True">
                            <Trigger.EnterActions>
                                <BeginStoryboard Storyboard="{StaticResource MouseDownTimeLine}" />
                                <BeginStoryboard Storyboard="{StaticResource InnerPressedMouseDownTimeLine}">
                                </BeginStoryboard>
                            </Trigger.EnterActions>
                            <Trigger.ExitActions>
                                <BeginStoryboard Storyboard="{StaticResource MouseUpTimeLine}" />
                                <BeginStoryboard Storyboard="{StaticResource InnerPressedMouseUpTimeLine}">
                                </BeginStoryboard>
                            </Trigger.ExitActions>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
  1. BaseObservableObject是INCP的简单实现。

  2. RelayCommand是ICommand接口的简单实现。

  3. 如果您对代码有疑问,我很乐意提供帮助。 的问候,