见与WPF和放大器设计视图用户界面的变化; XAML和数据绑定？ [英] See UI changes in design view with WPF & XAML and data binding?
问题描述
我只是看着XAML这个视频里，他创造了一个时钟，发现他居然可以看到所有他从C夏普在XAML设计视图中所做的更改。
I was just watching this video on XAML where he created a clock and noticed he could actually see all the changes he is doing from C Sharp in the Xaml design view.
在33:30，他创建了自己的类： https://youtu.be/Wb-l0e6WYE0？ T = 2008
At 33:30 he creates his class: https://youtu.be/Wb-l0e6WYE0?t=2008
在37:10，他绑定到该类：的 https://youtu.be/Wb-l0e6WYE0?t=2227
At 37:10 he binds to that class: https://youtu.be/Wb-l0e6WYE0?t=2227
后来你其实可以看到时钟在设计视图滴答！
Later on at 40:17 you can actually see the clock is ticking in the design view!
我试图创建一个名为球一样大小的一些属性的类做到这一点，这些属性绑定到一个Canvas与具有EllipseGeometry剪辑这使得圆的矩形。运行该应用程序，但在设计视图仅仅是白当它工作正常。
I tried to do this by creating a class called Ball with some properties like size and bind those properties to a Canvas with a rectangle that has a EllipseGeometry clip which makes it round. It works fine when running the application but the design view is just white.
有谁知道他是怎么做到这一点？
Does anyone know how he does this?
我的代码：
MainWindow.xaml
MainWindow.xaml
<Window x:Class="XamlTest.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:XamlTest"
mc:Ignorable="d"
Title="MainWindow" Height="350" Width="525">
<Canvas Background="White">
<Rectangle Height="{Binding Size}" Width="{Binding Size}" Fill="Green" Canvas.Top="40">
<Rectangle.Clip>
<EllipseGeometry Center="{Binding EllipseCenter}" RadiusX="{Binding EllipseRadius}" RadiusY="{Binding EllipseRadius}"/>
</Rectangle.Clip>
</Rectangle>
<Button x:Name="button" Content="Button" Width="75" Click="button_Click"/>
</Canvas>
代码背后：
using System.Windows;
namespace XamlTest
{
public partial class MainWindow : Window
{
Ball TheBall = new Ball();
public MainWindow()
{
InitializeComponent();
TheBall.Size = 300;
this.DataContext = TheBall;
}
private void button_Click(object sender, RoutedEventArgs e)
{
TheBall.Size = TheBall.Size + 40;
}
}
}
Ball类：
Ball Class:
using System.Windows;
namespace XamlTest
{
class Ball : INotifyPropertyChangedBase
{
public Ball()
{
Size = 50;
}
private double _size;
public double Size
{
get
{
return _size;
}
set
{
_size = value;
EllipseCenter = new Point(_size / 2, _size / 2);
EllipseRadius = _size / 2;
OnPropertyChanged("Size");
}
}
private Point _ellipseCenter;
public Point EllipseCenter
{
get
{
return _ellipseCenter;
}
set
{
_ellipseCenter = value;
OnPropertyChanged("EllipseCenter");
}
}
private double _ellipseRadius;
public double EllipseRadius
{
get {
return _ellipseRadius;
}
set {
_ellipseRadius = value;
OnPropertyChanged("EllipseRadius");
}
}
}
}
INotifyPropertyChangedBase类：
INotifyPropertyChangedBase Class:
using System.ComponentModel;
namespace XamlTest
{
public class INotifyPropertyChangedBase : INotifyPropertyChanged
{
public event PropertyChangedEventHandler PropertyChanged;
internal void OnPropertyChanged(string propertyName)
{
PropertyChangedEventHandler handler = PropertyChanged;
if (handler != null)
{
handler(this, new PropertyChangedEventArgs(propertyName));
}
}
}
}
我也有一个按钮，增加球的大小！
I also have a button that increase the size of the ball!
感谢您的帮助。
推荐答案
的的DataContext 允许XAML找到一个实例类，则意味着要结合。
The DataContext allows the XAML to find an instance the class that it is meant to be binding to.
然后，在XAML绑定允许你绑定到上述类的特定属性。
Then, the bindings in XAML allow you to bind to specific properties of said class.
有两个独立的DataContexts：设计时间和运行时间
There are two separate DataContexts: design time and run time.
要设置设计时间的DataContext，请参见：
To set the design time DataContext, see:
http://adamprescott.net / 2012/09/12 /设计时数据绑定功能于WPF /
从本质上讲，当你设置了设计时间DataContext的，背后场景中的WPF运行时将自动实例你点它在类的一个新实例（或者仅仅指向类别中，如果它的静态），然后在Visual Studio设计时设计师会从你的类显示实时值，您正在编辑的XAML。这使得设计的真快，你可以与实时数据工作，你没有运行程序所有的时间来看看它的外观。
Essentially, when you set the design time DataContext, behind the scenes the WPF runtime will automatically instantiate a new instance of the class you point it at (or simply point at the class if its static), and then the Visual Studio design time designer will display live values from your class, as you are editing the XAML. This makes designing really fast, as you can work with live data, and you dont have to run the program all the time to see how it looks.
要设置运行时间的DataContext，看到的 ReSharper的WPF错误："无法解析符号QUOT; MyVariable的"由于未知的DataContext" 。答案将介绍如何使用免费的史努比程序检测运行时绑定的错误。
To set the run time DataContext, see ReSharper WPF error: "Cannot resolve symbol "MyVariable" due to unknown DataContext". The answer describes how to use the free Snoop utility to detect runtime binding errors.
这篇关于见与WPF和放大器设计视图用户界面的变化; XAML和数据绑定？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
