WPF用户控件;触发器和改变其他控件 [英] WPF UserControls; triggers and changing other controls

问题描述

我创建了一个WPF用户控件，其中包含一个按钮和一个组合框。我想改变两者的风格，根据鼠标的位置，使鼠标的UIElement上是有颜色的黑色，另一种是红色。如果没有的风格则默认样式都将适用。

不要担心，这噩梦般的配色方案，只是为了说明这个概念！

在此先感谢您的帮助。

XAML

 <用户控件X：类=WpfUserControlSample.ToolbarButtonCombo
的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
的xmlns：地方=CLR的命名空间：WpfUserControlSample
X：名称=控制
 MC：可忽略=D
D：DesignHeight =30> 
< UserControl.Resources> 
<风格的TargetType ={X：类型本地：ToolbarButtonCombo}> 
< Style.Triggers> 
< DataTrigger绑定={结合IsButtonMouseOver}VALUE =真> 
< setter属性=的ButtonStyleVALUE =黑/> 
< setter属性=ComboStyleVALUE =红/> 
< / DataTrigger> 
<  - ！
< DataTrigger绑定={结合IsComboMouseOver}VALUE =真> 
< setter属性=的ButtonStyleVALUE =红/> 
< setter属性=ComboStyleVALUE =黑/> 
< / DataTrigger> 
  - > 
< /Style.Triggers> 
< /样式和GT; 
< /UserControl.Resources> 
< StackPanel的方向=横向HEIGHT =30> 
<按钮名称=BTN背景={结合的ButtonStyle，的ElementName =控制，模式=单向}> 
测试
< /按钮> 
<组合框名称=招商银行后台={结合ComboStyle，的ElementName =控制，模式=单向}>< /组合框> 
< / StackPanel的> 
< /用户控件> 
  

代码隐藏

 命名空间WpfUserControlSample 
 {
公共部分类ToolbarButtonCombo：用户控件，INotifyPropertyChanged的
 {
公共事件PropertyChangedEventHandler的PropertyChanged; 
保护无效OnPropertyChanged（字符串propertyName的）
 {
如果（的PropertyChanged！= NULL）
的PropertyChanged（这一点，新PropertyChangedEventArgs（propertyName的））; 
 
} 
公共ToolbarButtonCombo（）
 {
的InitializeComponent（）; 
 btn.MouseEnter + =新MouseEventHandler（btn_MouseChanged）; 
 btn.MouseLeave + =新MouseEventHandler（btn_MouseChanged）; 
} 
无效btn_MouseChanged（对象发件人，MouseEventArgs E）
 {
 OnPropertyChanged（IsButtonMouseOver）; 
} 
 
 
公共BOOL IsButtonMouseOver 
 {
 {返回btn.IsMouseOver; } 
 
} 
公共静态只读的DependencyProperty IsButtonMouseOverProperty = 
 DependencyProperty.Register（IsButtonMouseOver的typeof（串）的typeof（ToolbarButtonCombo），新PropertyMetadata（假）） ; 
 
公共字符串的ButtonStyle {搞定;组; } 
公共静态只读的DependencyProperty ButtonStyleProperty = 
 DependencyProperty.Register（的ButtonStyle的typeof（串）的typeof（ToolbarButtonCombo））; 
 
公共字符串ComboStyle {搞定;组; } 
公共静态只读的DependencyProperty ComboStyleProperty = 
 DependencyProperty.Register（ComboStyle的typeof（串）的typeof（ToolbarButtonCombo））; 
} 
} 
  

解决方案

有有两个问题。

首先你DataTrigger绑定显示不正确。他们正在寻找在DataContext的，不相关的控制IsButtonMouseOver。你需要使用：

 < DataTrigger绑定={结合IsButtonMouseOver，的RelativeSource = {的RelativeSource自}}价值=真> 
< setter属性=的ButtonStyleVALUE =黑/> 
< setter属性=ComboStyleVALUE =红/> 
< / DataTrigger> 
  

或者

 <触发属性=IsButtonMouseOverVALUE =真> 
< setter属性=的ButtonStyleVALUE =黑/> 
< setter属性=ComboStyleVALUE =红/> 
< /触发> 
  

另外就是你的IsButtonMouseOver不正确实施。你应该这样做：

 公共静态只读的DependencyProperty IsButtonMouseOverProperty = DependencyProperty.Register（IsButtonMouseOver，
 typeof运算（布尔）的typeof（ToolbarButtonCombo），新PropertyMetadata（假））; 
 
公共BOOL IsButtonMouseOver 
 {
 {返回（布尔）this.GetValue（IsButtonMouseOverProperty）; } 
集合{this.SetValue（IsButtonMouseOverProperty，值）; } 
} 
 
无效btn_MouseChanged（对象发件人，MouseEventArgs E）
 {
 this.IsButtonMouseOver = this.btn.IsMouseOver; 
} 
  

或者更准确，使IsButtonMouseOver只读依赖属性像这样

 私有静态只读由其DependencyPropertyKey IsButtonMouseOverPropertyKey = DependencyProperty.RegisterReadOnly（IsButtonMouseOver，
 typeof运算（布尔）的typeof（ ToolbarButtonCombo），新FrameworkPropertyMetadata（假））; 
 
公共静态只读的DependencyProperty IsButtonMouseOverProperty = ToolbarButtonCombo.IsButtonMouseOverPropertyKey.DependencyProperty; 
 
公共BOOL IsButtonMouseOver {
 {返回（布尔）this.GetValue（IsButtonMouseOverProperty）; } 
私人集合{this.SetValue（IsButtonMouseOverPropertyKey，值）; } 
} 
  

您其他属性（的ButtonStyle和ComboStyle）将需要也可以适当实施和他们的get / set方法不是由依赖项属性的支持。

I've created a WPF UserControl which contains a Button and a ComboBox. I'd like to change the style of both, depending on the position of the mouse, so the UIElement with the mouse over is coloured Black and the other is coloured Red. If neither are styled then the default styling will apply.

Don't worry, this nightmarish colour scheme is just to illustrate the concept!

Thanks in advance for your help.

XAML

<UserControl x:Class="WpfUserControlSample.ToolbarButtonCombo"
             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" 
             xmlns:local="clr-namespace:WpfUserControlSample"
             x:Name="Control"
             mc:Ignorable="d" 
             d:DesignHeight="30">    
    <UserControl.Resources>
        <Style TargetType="{x:Type local:ToolbarButtonCombo}">
            <Style.Triggers>
                <DataTrigger Binding="{Binding IsButtonMouseOver}" Value="True">
                    <Setter Property="ButtonStyle" Value="Black"/>
                    <Setter Property="ComboStyle" Value="Red"/>                    
                </DataTrigger>
                <!--
                <DataTrigger Binding="{Binding IsComboMouseOver}" Value="True">
                    <Setter Property="ButtonStyle" Value="Red"/>
                    <Setter Property="ComboStyle" Value="Black"/>
                </DataTrigger>
                -->
            </Style.Triggers>
        </Style>
    </UserControl.Resources>
    <StackPanel Orientation="Horizontal" Height="30">
        <Button Name="btn" Background="{Binding ButtonStyle,ElementName=Control,Mode=OneWay}">
            Test
        </Button>
        <ComboBox Name="cmb" Background="{Binding ComboStyle,ElementName=Control,Mode=OneWay}"></ComboBox>
    </StackPanel>
</UserControl>

Codebehind:

namespace WpfUserControlSample
{
    public partial class ToolbarButtonCombo : UserControl, INotifyPropertyChanged
    {
        public event PropertyChangedEventHandler PropertyChanged;
        protected void OnPropertyChanged(string propertyName)
        {
            if (PropertyChanged != null)
                PropertyChanged(this, new PropertyChangedEventArgs(propertyName));

        }  
        public ToolbarButtonCombo()
        {
            InitializeComponent();
            btn.MouseEnter += new MouseEventHandler(btn_MouseChanged);
            btn.MouseLeave += new MouseEventHandler(btn_MouseChanged);
        }
        void btn_MouseChanged(object sender, MouseEventArgs e)
        {
            OnPropertyChanged("IsButtonMouseOver");
        }


        public bool IsButtonMouseOver
        {
            get { return btn.IsMouseOver; }

        }
        public static readonly DependencyProperty IsButtonMouseOverProperty =
            DependencyProperty.Register("IsButtonMouseOver", typeof(string), typeof(ToolbarButtonCombo), new PropertyMetadata("false"));

        public string ButtonStyle { get; set; }
        public static readonly DependencyProperty ButtonStyleProperty =
            DependencyProperty.Register("ButtonStyle", typeof(string), typeof(ToolbarButtonCombo));

        public string ComboStyle { get; set; }
        public static readonly DependencyProperty ComboStyleProperty =
            DependencyProperty.Register("ComboStyle", typeof(string), typeof(ToolbarButtonCombo));    
    }
}

解决方案

There are a two problems.

First your DataTrigger bindings do not look correct. They are looking for the IsButtonMouseOver on the DataContext, not the associated control. You'd need to use:

<DataTrigger Binding="{Binding IsButtonMouseOver, RelativeSource={RelativeSource Self}}" Value="True">
    <Setter Property="ButtonStyle" Value="Black"/>
    <Setter Property="ComboStyle" Value="Red"/>                    
</DataTrigger>

Or:

<Trigger Property="IsButtonMouseOver" Value="True">
    <Setter Property="ButtonStyle" Value="Black"/>
    <Setter Property="ComboStyle" Value="Red"/>                    
</Trigger>

The other is your IsButtonMouseOver is not implemented correctly. You should do something like:

public static readonly DependencyProperty IsButtonMouseOverProperty = DependencyProperty.Register("IsButtonMouseOver",
    typeof(bool), typeof(ToolbarButtonCombo), new PropertyMetadata(false));

    public bool IsButtonMouseOver
    {
        get { return (bool)this.GetValue(IsButtonMouseOverProperty); }
        set { this.SetValue(IsButtonMouseOverProperty, value); }
    }

    void btn_MouseChanged(object sender, MouseEventArgs e)
    {
        this.IsButtonMouseOver = this.btn.IsMouseOver;
    }

Or even more correctly, make the IsButtonMouseOver a read-only dependency property like so:

private static readonly DependencyPropertyKey IsButtonMouseOverPropertyKey = DependencyProperty.RegisterReadOnly("IsButtonMouseOver",
    typeof(bool), typeof(ToolbarButtonCombo), new FrameworkPropertyMetadata(false));

public static readonly DependencyProperty IsButtonMouseOverProperty = ToolbarButtonCombo.IsButtonMouseOverPropertyKey.DependencyProperty;

public bool IsButtonMouseOver {
    get { return (bool)this.GetValue(IsButtonMouseOverProperty); }
    private set { this.SetValue(IsButtonMouseOverPropertyKey, value); }
}

Your other properties (ButtonStyle and ComboStyle) would need to be properly implemented also, and their get/set methods are not backed by the dependency property.

这篇关于WPF用户控件;触发器和改变其他控件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！