在使用WPF和XAML以及数据绑定的设计视图中查看UI更改吗?

克林特·伊斯特伍德

我只是在XAML上观看此视频,他在其中创建了一个时钟,并注意到他实际上可以在Xaml设计视图中看到他从C Sharp所做的所有更改。

在33:30,他创建了自己的课程:https://youtu.be/Wb-l0e6WYE0?t = 2008

在37:10他绑定到该类:https ://youtu.be/Wb-l0e6WYE0?t=2227

稍后在40:17,您实际上可以在设计视图中看到时钟在滴答!

我试图通过创建一个名为Ball的类来实现此目的,该类具有一些属性,例如大小,然后将这些属性绑定到具有EllipseGeometry剪辑的矩形的Canvas上。运行应用程序时,它工作正常,但设计视图仅为白色。

有谁知道他是怎么做到的?

我的代码:

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;
    }
}
}

球类:

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类:

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));
        }
    }
}
}

我也有一个增加球大小的按钮!

谢谢您的帮助。

康坦戈

DataContext允许XAML找到一个实例类,则意味着要结合。

然后,XAML中的绑定允许您绑定到所述类的特定属性。

有两个单独的DataContext:design timerun time

要设置design timeDataContext,请参见:

http://adamprescott.net/2012/09/12/design-time-data-binding-in-wpf/

本质上,当您设置设计时间DataContext时,WPF运行时将在幕后自动实例化您指向它的类的新实例(或者如果指向静态,则简单地指向该类),然后Visual Studio设计时设计器将在编辑XAML时显示类中的实时值。这样就可以真正快速地进行设计,因为您可以使用实时数据,而不必一直运行程序来查看它的外观。

若要设置run timeDataContext,请参阅ReSharper WPF错误:“由于未知的DataContext,无法解析符号“ MyVariable””答案描述了如何使用免费的Snoop实用程序来检测运行时绑定错误。

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

在WPF和XAML和数据绑定的设计视图中查看UI更改吗?

来自分类Dev

从ViewModel正确设计将数据绑定到视图中的XAML控件的设计

来自分类Dev

您可以在视图中“更改”数据吗?

来自分类Dev

WPF XAML数据绑定

来自分类Dev

AngularJS数据绑定和视图更改

来自分类Dev

属性更改时,XAML数据绑定不会更新UI

来自分类Dev

WPF 设计:查看整个滚动视图

来自分类Dev

WPF数据绑定到XAML

来自分类Dev

使用带有Ninject和WPF的Caliburn.Micro在视图模型之间绑定/传递数据

来自分类Dev

wpf使用XAML的数据绑定不起作用

来自分类Dev

WPF xaml:无法使用本地绑定数据

来自分类Dev

如何使用 PowerShell 执行 WPF/XAML 的数据绑定

来自分类Dev

在 WPF 中使用 XAML 和绑定创建 DataGrid

来自分类Dev

绑定列表视图中的WPF按钮

来自分类Dev

在xaml中使用backgroundworker和绑定时,UI不更新

来自分类Dev

PowerShell和XAML数据绑定

来自分类Dev

同一视图中的UI-Router路由(查看和编辑)

来自分类Dev

在通用Windows应用程序中,如果视图模型中的属性发生更改,如何使用xaml和数据绑定更改按钮的背景色

来自分类Dev

从视图中设置数据绑定背景

来自分类Dev

数据绑定到组合框WPF XAML

来自分类Dev

使用ReactiveUI WPF无法将Enum值列表从ViewModel绑定到视图中的组合框

来自分类Dev

我可以使用XAML在Xamarin.Forms中设计UI吗

来自分类Dev

如果我使用ResourceDictionary,则设计视图无法显示XAML设计

来自分类Dev

从未绑定的视图中获取数据,并使用linq将表单数据提交到表中

来自分类Dev

SAPUI5列表绑定和XML视图中的过滤数据

来自分类Dev

Mailchimp:设计视图中的可编辑链接,如何更改它们?

来自分类Dev

可以从kendo ui视图中删除而不是从数据源中删除吗?

来自分类Dev

不使用XAML进行绑定[WPF]

来自分类Dev

WPF / XAML绑定:使用实际的DataContext

Related 相关文章

  1. 1

    在WPF和XAML和数据绑定的设计视图中查看UI更改吗?

  2. 2

    从ViewModel正确设计将数据绑定到视图中的XAML控件的设计

  3. 3

    您可以在视图中“更改”数据吗?

  4. 4

    WPF XAML数据绑定

  5. 5

    AngularJS数据绑定和视图更改

  6. 6

    属性更改时,XAML数据绑定不会更新UI

  7. 7

    WPF 设计:查看整个滚动视图

  8. 8

    WPF数据绑定到XAML

  9. 9

    使用带有Ninject和WPF的Caliburn.Micro在视图模型之间绑定/传递数据

  10. 10

    wpf使用XAML的数据绑定不起作用

  11. 11

    WPF xaml:无法使用本地绑定数据

  12. 12

    如何使用 PowerShell 执行 WPF/XAML 的数据绑定

  13. 13

    在 WPF 中使用 XAML 和绑定创建 DataGrid

  14. 14

    绑定列表视图中的WPF按钮

  15. 15

    在xaml中使用backgroundworker和绑定时,UI不更新

  16. 16

    PowerShell和XAML数据绑定

  17. 17

    同一视图中的UI-Router路由(查看和编辑)

  18. 18

    在通用Windows应用程序中,如果视图模型中的属性发生更改,如何使用xaml和数据绑定更改按钮的背景色

  19. 19

    从视图中设置数据绑定背景

  20. 20

    数据绑定到组合框WPF XAML

  21. 21

    使用ReactiveUI WPF无法将Enum值列表从ViewModel绑定到视图中的组合框

  22. 22

    我可以使用XAML在Xamarin.Forms中设计UI吗

  23. 23

    如果我使用ResourceDictionary,则设计视图无法显示XAML设计

  24. 24

    从未绑定的视图中获取数据,并使用linq将表单数据提交到表中

  25. 25

    SAPUI5列表绑定和XML视图中的过滤数据

  26. 26

    Mailchimp:设计视图中的可编辑链接,如何更改它们?

  27. 27

    可以从kendo ui视图中删除而不是从数据源中删除吗?

  28. 28

    不使用XAML进行绑定[WPF]

  29. 29

    WPF / XAML绑定:使用实际的DataContext

热门标签

归档