如何使用 MouseEnter 和 MouseLeave WPF 使对象改变颜色答案

【问题标题】：How to make an object to change color with MouseEnter and MouseLeave WPF如何使用 MouseEnter 和 MouseLeave WPF 使对象改变颜色
【发布时间】：2013-12-03 20:56:50
【问题描述】：

这是我的 WPF 项目，问题出在这个用户控件 People.xaml.cs 文件中：

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
using System.IO;

namespace Projet
{
public partial class People : UserControl
{
    Random rnd = new Random();
    string filename = "C:\\Users\\Kristen\\peoples.txt";
    public People()
    {
        InitializeComponent();
        dataFromFile();
    }

 void dataFromFile()
    {
        if (!File.Exists(filename))
            return;

        var source = File.ReadLines(filename)
                         .Select(line => line.Split(' '))
                         .Select(m => new { name = m[0], length = int.Parse(m[1]) })
                         .OrderBy(x => x.length);
        int k = 200;
        foreach (var data in source)
        {

            Rectangle r = new Rectangle ();
            r.Height = data.length;
            r.Width = 25;
            r.Fill = new SolidColorBrush(Colors.Red);
            Canvas.SetLeft(r, k);
            Canvas.SetBottom(r, 200);
            board.Children.Add(r);
            k += 50;
        }
    }
    private void board_MouseEnter_1(object sender, MouseEventArgs e)
    {
        board.Background = Brushes.Blue; 
//I have tried with r.Fill = new SolidColorBrush(Colors.Red); but it wont work either
        dataFromFile();
    }

    private void juur_MouseLeave_1(object sender, MouseEventArgs e)
    {
        board.Background = Brushes.Yellow;
    }

IT 从文件中取出数据。在文件中有人名和他们的身高。它使用画布上的矩形将这些高度变为条形图。我想用 MouseEnter 和 MouseLeave 改变矩形的颜色，但它只是改变了我的画布背景颜色。我也会把我的 People.xaml 放在这里以防万一。

<UserControl x:Class="Project.People"
         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">
<Canvas Background="Yellow" x:Name="board" MouseEnter="board_MouseEnter_1" MouseLeave="board_MouseLeave_1">


</Canvas>

【问题讨论】：

这是 WPF 吗？赢表格？还有什么？请适当标记您的问题。
是否有您不想使用 Java 等脚本的特定原因？只是好奇。
如果您向我们展示导入命名空间并定义您正在使用的对象类型的代码部分可能会有所帮助...看起来像 WinForms，但我不知道您使用哪种控件'将鼠标事件绑定到。面板？
我编辑了问题并添加了更多信息

标签： c# wpf mouseenter mouseleave

【解决方案1】：

您必须将事件处理程序附加到每个 Rectangle，而不是 Canvas。在此处删除它们：

<Canvas Background="Yellow" x:Name="board"/>

然后将它们添加到每个 Rectangle 中：

foreach (var data in source)
{
    var r = new Rectangle();
    r.MouseEnter += Rectangle_MouseEnter;
    r.MouseLeave += Rectangle_MouseLeave;
    ...
}

...

private void Rectangle_MouseEnter(object sender, MouseEventArgs e)
{
    ((Rectangle)sender).Fill = Brushes.Blue; 
}

private void Rectangle_MouseLeave(object sender, MouseEventArgs e)
{
    ((Rectangle)sender).Fill = Brushes.Yellow;
}

话虽如此，我强烈建议丢弃所有代码并改用 MVVM 方法。也许开始阅读ItemsControl 和Data Templating。

【讨论】：

【解决方案2】：

绝对没有理由为此使用后台代码，只需使用样式和 IsMouseOver 触发器（尽管在 yoru 情况下显然更改设置器以修改/替换适当的子控件属性）：

<Canvas>
    <Canvas.Style>
        <Style>
            <Setter Property="Canvas.Background" Value="Yellow"/>
            <Style.Triggers>
                <Trigger Property="Canvas.IsMouseOver" Value="True">
                    <Setter Property="Canvas.Background" Value="Red" />
                </Trigger>
            </Style.Triggers>
        </Style>
    </Canvas.Style>
</Canvas>

【讨论】：