2017-10-18 67 views
0

我有一個圖形平臺,我有興趣在鼠標移過它們時改變節點的顏色(或者像改變不透明度以用於聚焦節點)。如何處理一個形狀的鼠標?

我該怎麼做?

任何人都可以幫忙嗎?

這將是.xaml.cs樣本節點表示:

using System.Windows; 
using System.Windows.Controls; 
using System.Windows.Media; 
using System.Windows.Shapes; 

namespace WpfApp12 
{ 
    /// <summary> 
    /// Interaction logic for MainWindow.xaml 
    /// </summary> 
    public partial class MainWindow : Window 
    { 
     public MainWindow() 
     { 
      InitializeComponent(); 
      Ellipse myEllipse = new Ellipse(); 
      //myEllipse.Fill = nodeColour; 
      myEllipse.StrokeThickness = 1; 
      myEllipse.Stroke = Brushes.Black; 
      myEllipse.Width = 30; 
      myEllipse.Height = 30; 
      Canvas.SetLeft(myEllipse, 50); 
      Canvas.SetTop(myEllipse, 50); 
      content.Children.Add(myEllipse); 
     } 
    } 
} 

,這是XAML代碼:

<Window x:Class="WpfApp12.MainWindow" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
     xmlns:local="clr-namespace:WpfApp12" 
     mc:Ignorable="d" 
     Title="MainWindow" Height="350" Width="525"> 
    <Grid> 
     <Canvas x:Name="content" HorizontalAlignment="Left" Height="299" Margin="10,10,0,0" VerticalAlignment="Top" Width="497"/> 

    </Grid> 
</Window> 

回答

0

例如,您可以處理MouseEnterMouseLeave事件:

myEllipse.MouseEnter += (s, e) => myEllipse.Fill = Brushes.Red; 
myEllipse.MouseLeave += (s, e) => myEllipse.Fill = Brushes.Transparent; 

tha nks ...實際上我有很多節點..我怎樣才能把這個方法分配給所有的節點?

你可以掛鉤相同的事件處理程序,以儘可能多的元素,你想:

public MainWindow() 
{ 
    InitializeComponent(); 
    Ellipse myEllipse = new Ellipse(); 
    ... 

    myEllipse.MouseEnter += MyEllipse_MouseEnter; 
    myEllipse.MouseLeave += MyEllipse_MouseLeave; 
} 

private void MyEllipse_MouseLeave(object sender, MouseEventArgs e) 
{ 
    Ellipse ellipse = sender as Ellipse; 
    ellipse.Fill = Brushes.Transparent; 
} 

private void MyEllipse_MouseEnter(object sender, MouseEventArgs e) 
{ 
    Ellipse ellipse = sender as Ellipse; 
    ellipse.Fill = Brushes.Red; 
} 
+0

感謝... 其實我有很多數量的節點..我怎樣才能分配此方法對所有這些? –

+0

您可以將相同的事件處理程序連接到所需的多個元素。看我的編輯。 – mm8

+0

非常感謝....非常棒! –

1

您應該實現MVVM模式,並創建一個視圖模型,代表您的形狀物品的集合,例如幾何圖形:

public class ViewModel 
{ 
    public ObservableCollection<Geometry> Shapes { get; } 
     = new ObservableCollection<Geometry>(); 
} 

然後在ItemTemplate中具有Path元素的ItemsControl中顯示幾何項目。路徑樣式在其IsMouseOver屬性中聲明瞭一個觸發器,該屬性設置Fill屬性。

<ItemsControl ItemsSource="{Binding Shapes}"> 
    <ItemsControl.Resources> 
     <SolidColorBrush x:Key="NormalBrush" Color="AliceBlue"/> 
     <SolidColorBrush x:Key="MouseOverBrush" Color="Red"/> 
     <Style x:Key="ShapeStyle" TargetType="Path"> 
      <Setter Property="Stroke" Value="Black"/> 
      <Setter Property="Fill" Value="{StaticResource NormalBrush}"/> 
      <Style.Triggers> 
       <Trigger Property="IsMouseOver" Value="True"> 
        <Setter Property="Fill" Value="{StaticResource MouseOverBrush}"/> 
       </Trigger> 
      </Style.Triggers> 
     </Style> 
    </ItemsControl.Resources> 
    <ItemsControl.ItemsPanel> 
     <ItemsPanelTemplate> 
      <Canvas/> 
     </ItemsPanelTemplate> 
    </ItemsControl.ItemsPanel> 
    <ItemsControl.ItemTemplate> 
     <DataTemplate> 
      <Path Style="{StaticResource ShapeStyle}" Data="{Binding}"/> 
     </DataTemplate> 
    </ItemsControl.ItemTemplate> 
</ItemsControl> 

初始化這樣的視圖模型:

public MainWindow() 
{ 
    InitializeComponent(); 

    var vm = new ViewModel(); 
    vm.Shapes.Add(new EllipseGeometry(new Point(50, 50), 15, 15)); 
    vm.Shapes.Add(new RectangleGeometry(new Rect(85, 85, 30, 30))); 
    vm.Shapes.Add(new EllipseGeometry(new Point(150, 150), 15, 15)); 

    DataContext = vm; 
}