wpf devexpress 绑定数据编辑器

定义视图模型

打开前一个项目

打开RegistrationViewModel.cs文件添加如下属性到RegistrationViewModel类

cs 复制代码
[POCOViewModel]
public class RegistrationViewModel {
    public static RegistrationViewModel Create() {
        return ViewModelSource.Create(() => new RegistrationViewModel());
    }
    protected RegistrationViewModel() {
        if(this.IsInDesignMode())
            InitializeInDesignMode();
        else InitializeInRuntime();
    }
    void InitializeInDesignMode() {
        FirstName = "John";
        LastName = "Smith";
        Email = "John.Smith@JohnSmithMail.com";
        Password = "Password";
        ConfirmPassword = "Password";
        Birthday = new DateTime(1980, 1, 1);
    }
    void InitializeInRuntime() {
        Birthday = null;
    }

    public virtual string FirstName { get; set; }
    public virtual string LastName { get; set; }
    public virtual string Email { get; set; }
    public virtual string Password { get; set; }
    public virtual string ConfirmPassword { get; set; }
    public virtual DateTime? Birthday { get; set; }
}

从RegistrationViewModel是一个POCO类,所有定义属性都是可绑定的

InitializeInRuntime方法初始化生日属性。DateTime结构是一个值类型,因此Birthlday字段可以使用可空DateTime。和一个不可空类型,Birthday字段可能初始化在特定的值,没有被推荐

注册数据

添加AddEmployee方法到视图模型

cs 复制代码
[POCOViewModel]
public class RegistrationViewModel {
    ...
    public void AddEmployee() {
        EmployeesModelHelper.AddNewEmployee(FirstName, LastName, Email, Password, Birthday.Value);
    }
}

POCO机制自动生成一个命令对于方法。生成的命令名字如下方法匹配MethodNameCommand。设置Command属性注册按钮:

XML 复制代码
<dxlc:LayoutControl Orientation="Vertical" ItemStyle="{StaticResource itemStyle}" ItemSpace="10">
    ...
    <Button Content="Register" HorizontalAlignment="Center" VerticalAlignment="Bottom" Width="80" 
            Command="{Binding AddEmployeeCommand}" />
</dxlc:LayoutControl>

绑定编辑器

重新生成项目

选择First Name TextEdit元素布局内容调用Quick Actions。点击重新排列按钮到EditValue右侧属性选择Create Data Binding

在调用对话框,启动Custom选项输入"FirstName"

绑定创建,FirstName编辑器显示测试数据在vs设计器

绑定余下的编辑器到它们的对应的属性和注册按钮到AddEmployee命令。XAML如下显示结果

XML 复制代码
<dxlc:LayoutControl Orientation="Vertical" ItemStyle="{StaticResource itemStyle}" ItemSpace="10">
    <dxlc:LayoutGroup ItemSpace="10">
        <dxlc:LayoutItem Label="Name">
            <dxe:TextEdit EditValue="{Binding FirstName}" />
        </dxlc:LayoutItem>
        <dxe:TextEdit VerticalAlignment="Bottom" EditValue="{Binding LastName}" />
    </dxlc:LayoutGroup>
    <dxlc:LayoutItem Label="Email">
        <dxe:TextEdit EditValue="{Binding Email}" />
    </dxlc:LayoutItem>
    <dxlc:LayoutItem Label="Create a password">
        <dxe:PasswordBoxEdit EditValue="{Binding Password}" />
    </dxlc:LayoutItem>
    <dxlc:LayoutItem Label="Confirm your password">
        <dxe:PasswordBoxEdit EditValue="{Binding ConfirmPassword}" />
    </dxlc:LayoutItem>
    <dxlc:LayoutItem Label="Birthday">
        <dxe:DateEdit EditValue="{Binding Birthday}" />
    </dxlc:LayoutItem>
    <Button Content="Register" HorizontalAlignment="Center" VerticalAlignment="Bottom" Width="80" 
            Command="{Binding AddEmployeeCommand}" />
</dxlc:LayoutControl>

编辑器不显示测试数据在运行时

相关推荐
要开心吖ZSH24 分钟前
一文搞懂:JDK 21 虚拟线程 vs N种异步方案,到底该怎么选?
java·数据库·jdk·虚拟线程
guodingdingh5 小时前
软件开发工作问题总结0718
java·开发语言·数据库
咖啡八杯7 小时前
GoF设计模式——解释器模式
java·后端·spring·设计模式
优橙教育7 小时前
5G网优培训 vs Java开发:转行选哪个?
java·开发语言·5g
糖果店的幽灵7 小时前
【DeepAgents 从入门到精通】Context Management 上下文管理
java·人工智能·后端·spring·中间件·langgraph·deepagents
腻害兔9 小时前
【若依项目-产品经理视角】RuoYi-Vue-Pro 源码拆解:字典、短信、邮件、通知——后台系统的“基础设施四件套“!
java·前端·vue.js·产品经理·ai编程
碎光拾影9 小时前
ARM交叉工具链各工具作用及IMX6ULL平台LED+蜂鸣器裸机程序实现
java·开发语言·数据库
一叶龙洲9 小时前
wslg打开Ubuntu24.04默认打开图形界面
linux·服务器·数据库·ubuntu
Miao1213110 小时前
微服务 API 测试实践:海外某民宿平台如何构建模式驱动测试基础设施
java·开发语言
腻害兔10 小时前
【若依项目-产品经理视角】RuoYi-Vue-Pro 源码拆解:支付模块 yudao-module-pay,一个让产品经理都看懂的支付中台设计
java·前端·vue.js·产品经理·ai编程