WPF入门教学十六 图形基础

在WPF（Windows Presentation Foundation）中，图形基础是构建丰富用户界面的关键部分。本节将介绍WPF中常用的图形控件，包括直线、矩形、椭圆和路径等，并展示如何在XAML中绑定这些控件到ViewModel。

WPF图形控件简介

• Line：用于绘制直线，需要两个坐标点来确定一条线。
• Rectangle：用于绘制矩形，可以设置半径来创建圆角矩形。
• Ellipse：用于绘制椭圆。
• Path：用于创建复杂的几何路径，支持多种绘制命令。

在XAML中使用图形控件

在XAML中，可以通过Canvas控件来布置这些图形控件。例如，创建一个直线、矩形和椭圆的简单图形界面：

<Canvas><Line X1="0" Y1="0" X2="300" Y2="300" Stroke="Red" StrokeThickness="2" /><Rectangle Width="120" Height="100" RadiusX="5" RadiusY="5" Stroke="Green" StrokeThickness="2" Fill="Red" /><Ellipse Height="200" Width="400" Stroke="Red" Fill="Gold" />
</Canvas>

绑定ViewModel到图形控件

为了使图形控件能够响应数据变化，我们需要将其绑定到ViewModel。以下是一个简单的示例，展示如何将TextBlock控件绑定到ViewModel的属性，并在属性变化时更新UI：

首先，创建一个ViewModel类，并实现INotifyPropertyChanged接口：

public class PersonViewModel : INotifyPropertyChanged
{private string _name;public string Name{get { return _name; }set{_name = value;OnPropertyChanged();}}public event PropertyChangedEventHandler PropertyChanged;
}

然后，在XAML中，将TextBlock的文本绑定到ViewModel的Name属性：

<TextBlock Text="{Binding Name, UpdateSourceTrigger=PropertyChanged}" />

最后，在代码后台设置DataContext为ViewModel实例：

public partial class MainWindow : Window
{public MainWindow(){InitializeComponent();DataContext = new PersonViewModel();}
}

通过这种方式，当用户在文本框中输入文本时，Name属性将自动更新，并且由于实现了INotifyPropertyChanged接口，任何绑定到该属性的控件都将得到通知并更新显示内容。

总结

通过上述步骤，你可以在WPF应用程序中使用图形控件，并将它们绑定到ViewModel以实现数据驱动的UI。这种方法不仅使代码更加模块化和可测试，而且遵循了MVVM设计原则，有助于构建清晰、可维护的应用程序架构。