How to:Customize Action Controls 如何:自定义按钮控件

This example demonstrates how to customize the control that visualizes an Action in a UI. A custom Action will be created, allowing users to enter a date and filter the List View accordingly. The implemented Action will accept keyboard input, as well as provide a drop-down calendar. The control representing the Action will be customized to accept keyboard input using a custom mask. The image below shows the resulting Action in a UI.

此示例演示如何自定义在 UI 中可视化操作的控件。将创建自定义操作,允许用户输入日期并相应地筛选列表视图。实现的操作将接受键盘输入,并提供下拉日历。将自定义表示操作的控件,以接受使用自定义掩码输入的控件。下图显示了 UI 中生成的操作。

Note 注意
You can see a demonstration of the following controllers (the CustomizeMenuActionsController for ASP.NET and CustomizeParametrizedActionController for WinForms) in the Actions section of the Feature Center application that is shipped with XAF. The Feature Center demo is installed in %PUBLIC%\Documents\DevExpress Demos 19.2\Components\eXpressApp Framework\FeatureCenter by default. The ASP.NET version of this demo is available online at http://demos.devexpress.com/XAF/FeatureCenter/
您可以在 XAF 附带的功能中心应用程序的"操作"部分看到以下控制器(用于ASP.NET的"自定义菜单操作控制器"和"为 WinForms 自定义参数化操作控制器")的演示。功能中心演示安装在%PUBLIC%\Documents\DevExpress Demos 19.2\Components\eXpressApp Framework\FeatureCenter by default. The ASP.NET version of this demo is available online at http://demos.devexpress.com/XAF/FeatureCenter/

.

First, define the sample MyDomainObject business class. The class contains two properties. The first is the "CreatedOn" property of the DateTime type, and the second is the "Title" property of the string type.

using DevExpress.Persistent.Base;
using DevExpress.Persistent.BaseImpl;
using DevExpress.Xpo;
// ...
[DefaultClassOptions]
public class MyDomainObject : BaseObject {
    public MyDomainObject(Session session) : base(session) { }

    public DateTime CreatedOn {
        get { return GetPropertyValue<DateTime>(nameof(CreatedOn)); }
        set { SetPropertyValue(nameof(CreatedOn), value); }
    }

    public string Title {
        get { return GetPropertyValue<string>(nameof(Title)); }
        set { SetPropertyValue(nameof(Title), value); }
    }
}

Next, create a new View Controller and define a ParametrizedAction. Configure the Controller and Action so that they activate for the MyDomainObject class only. Set the Action‘s ParametrizedAction.ValueType to DateTime. In the Action‘s ParametrizedAction.Execute event handler, check whether a date was entered. If a date was entered, filter the MyDomainObject List View to contain only the objects whose "CreatedOn" property‘s value equals the entered date. If a user has executed the Action with an empty edit field, remove the applied filter, so that the List View displays all the objects, without regard to their creation date.

接下来,创建新的视图控制器并定义参数化操作。配置控制器和操作,以便它们仅为 MyDomainObject 类激活。将操作的参数化操作.ValueType 设置为日期时间。在操作的参数化操作.执行事件处理程序中,检查是否输入了日期。如果输入了日期,则筛选 MyDomain 对象列表视图,以仅包含其"CreatedOn"属性的值等于输入日期的对象。如果用户已使用空编辑字段执行操作,请删除应用的筛选器,以便列表视图显示所有对象,而不考虑其创建日期。

using DevExpress.Data.Filtering;
using DevExpress.ExpressApp;
using DevExpress.ExpressApp.Actions;
using DevExpress.Persistent.Base;
//...
public class MyFilterController : ViewController {
    public ParametrizedAction dateFilterAction;
    public MyFilterController() {
        TargetViewType = ViewType.ListView;
        TargetObjectType = typeof(MyDomainObject);
        dateFilterAction = new ParametrizedAction(this, "MyDateFilter", PredefinedCategory.Search, typeof(DateTime));
        dateFilterAction.NullValuePrompt = "Enter date";
        dateFilterAction.Execute += dateFilterAction_Execute;
    }
    private void dateFilterAction_Execute(object sender, ParametrizedActionExecuteEventArgs e) {
        CriteriaOperator criterion = null;
        if(e.ParameterCurrentValue != null && e.ParameterCurrentValue.ToString() != string.Empty) {
            criterion = new BinaryOperator("CreatedOn", Convert.ToDateTime(e.ParameterCurrentValue));
        }
        ((ListView)View).CollectionSource.Criteria[dateFilterAction.Id] = criterion;
    }
}

To set up a custom edit mask, subscribe to the ActionBase.CustomizeControl event. This event allows you to customize the created items control, and provides access to the corresponding Action Control.

要设置自定义编辑掩码,请订阅 ActionBase.CustomizeControl 事件。此事件允许您自定义创建的项控件,并提供对相应操作控件的访问。

WinForms

using DevExpress.ExpressApp;
using DevExpress.ExpressApp.Actions;
using DevExpress.XtraBars;
using DevExpress.XtraEditors.Repository;
//...
public class CustomizeActionControlControllerWin : Controller {
    protected override void OnActivated() {
        base.OnActivated();
        Frame.GetController<MyFilterController>().dateFilterAction.CustomizeControl += CustomizeActionControlControllerWin_CustomizeControl;
    }
    private void CustomizeActionControlControllerWin_CustomizeControl(object sender,
CustomizeControlEventArgs e) {
        BarEditItem barItem = e.Control as BarEditItem;
        if (barItem != null) {
            RepositoryItemDateEdit repositoryItem = (RepositoryItemDateEdit)barItem.Edit;
            repositoryItem.Mask.UseMaskAsDisplayFormat = true;
            repositoryItem.Mask.EditMask = "yyyy-MMM-dd";
            barItem.Width = 270;
        }
    }
    protected override void OnDeactivated() {
        Frame.GetController<MyFilterController>().dateFilterAction.CustomizeControl -=
CustomizeActionControlControllerWin_CustomizeControl;
        base.OnDeactivated();
    }
}

ASP.NET

This approach uses Server properties. Employ this approach when you need to change a control‘s behavior. If you need to change a control‘s appearance, use CSS styles as the Action Customization article describes.

此方法使用服务器属性。当您需要更改控件的行为时,使用此方法。如果需要更改控件的外观,请使用"操作自定义"一文中介绍的 CSS 样式。

using DevExpress.ExpressApp;
using DevExpress.ExpressApp.Actions;
using DevExpress.ExpressApp.Web.Templates.ActionContainers.Menu;
using DevExpress.Web;
//...
public class CustomizeActionControlControllerWeb : Controller {
    protected override void OnActivated() {
        base.OnActivated();
        Frame.GetController<MyFilterController>().dateFilterAction.CustomizeControl += CustomizeActionControlControllerWeb_CustomizeControl;
    }
    private void CustomizeActionControlControllerWeb_CustomizeControl(object sender,
CustomizeControlEventArgs e) {
        ParametrizedActionMenuActionItem actionItem = e.Control as ParametrizedActionMenuActionItem;
        if (actionItem != null) {
            ASPxDateEdit editor = actionItem.Control.Editor as ASPxDateEdit;
            if (editor != null) {
                editor.UseMaskBehavior = true;
                editor.EditFormat = EditFormat.DateTime;
                editor.EditFormatString = "yyyy-MMM-dd";
                editor.Width = 270;
            }
        }
    }
    protected override void OnDeactivated() {
        Frame.GetController<MyFilterController>().dateFilterAction.CustomizeControl -=
CustomizeActionControlControllerWeb_CustomizeControl;
        base.OnDeactivated();
    }
}

Mobile

To specify a date-time format, use symbols from the Unicode Date Field Symbol Table or the predefined formats the DevExtreme Library supports.

要指定日期时间格式,请使用 Unicode 日期字段符号表中的符号或 DevExtreme 库支持的预定义格式。

using DevExpress.ExpressApp;
using DevExpress.ExpressApp.Actions;
using System.Collections.Generic;
// ...
public class CustomizeActionControlControllerMobile : Controller {
    protected override void OnActivated() {
        base.OnActivated();
        MyFilterController controller = Frame.GetController<MyFilterController>();
        if (controller != null) {
            controller.dateFilterAction.CustomizeControl +=
CustomizeActionControlControllerMobile_CustomizeControl;
        }
    }
    private void CustomizeActionControlControllerMobile_CustomizeControl(object sender,
CustomizeControlEventArgs e) {
        List<object> controls = (List<object>)e.Control;
        Dictionary<string, object> editor = (Dictionary<string, object>)controls[1];
        editor["displayFormat"] = "longdate";
    }
    protected override void OnDeactivated() {
        MyFilterController controller = Frame.GetController<MyFilterController>();
        if (controller != null) {
            controller.dateFilterAction.CustomizeControl -=
CustomizeActionControlControllerMobile_CustomizeControl;
        }
        base.OnDeactivated();
    }
}

原文地址:https://www.cnblogs.com/foreachlife/p/How-to-Customize-Action-Controls.html

时间: 2024-10-05 02:59:01

How to:Customize Action Controls 如何:自定义按钮控件的相关文章

用 Blend 自动生成 自定义按钮控件 及设置触发器

1.构成控件 2.设置触发器 3.效果图 最后附上自动生成的代码 虽然有一句是似懂非懂 <ContentPresenter x:Name="contentPresenter" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBindi

自定义水晶按钮控件

namespace 自定义水晶按钮控件 { partial class Form1 { /// <summary> /// 必需的设计器变量. /// </summary> private System.ComponentModel.IContainer components = null; /// <summary> /// 清理所有正在使用的资源. /// </summary> /// <param name="disposing&quo

Android自定义组合控件--底部多按钮切换

效果图: 现在市场上大多数软件都是类似于上面的结构,底部有几个按钮用于切换到不同的界面.基于OOP思想,我想把下面的一整块布局封装成一个类,也就是我们的自定义组合控件-底部多按钮切换布局,我把它叫做BottomLayout 看上面的布局,几个按钮横向排列,我们先看一下布局 最外面LinearLayout 方向 horizontal,然后5个weight相同的RelativeLayout,每个RelativeLayout里面有一个Button(用了显示选中状态)个ImageView(用来显示红点)

Xamarin.Forms自定义用户界面控件实现一个HybridWebView(混合webview)

原文:Implementing a HybridWebView呈现一个特定于平台的视图 Xamarin.Forms自定义用户界面控件应该来自视图类(View class),用于在屏幕上放置布局和控件.本文演示了如何为HybridWebView(混合webview)自定义控件创建自定义渲染器,该控件演示了如何增强特定平台的web控件,以允许从JavaScript调用c#代码. 每一个Xamarin.Forms视图为每个创建本地控件实例的平台提供了相应的渲染器.当一个视图被Xamarin.Forms

iOS开发UI篇—Quartz2D(自定义UIImageView控件)

一.实现思路 Quartz2D最大的用途在于自定义View(自定义UI控件),当系统的View不能满足我们使用需求的时候,自定义View. 使用Quartz2D自定义View,可以从模仿系统的ImageView的使用开始. 需求驱动开发:模仿系统的imageview的使用过程 1.创建 2.设置图片 3.设置frame 4.把创建的自定义的view添加到界面上(在自定义的View中,需要一个image属性接收image图片参数->5). 5.添加一个image属性(接下来,拿到image之后,应

iOS: 工具栏控件UIToolBar和工具栏按钮控件UIBarButtonItem的使用

一.工具栏控件:UIToolBar:UIView 介绍: ToolBar工具栏是视图View的属性,可以在工具栏上添加工具栏按钮Bar Button Item(可以是自定义的Custom.也可以是系统自带的BarButtonSystemItem ),视图控制器可以通过工具栏项对视图中内容进行操作. 注意事项: 在导航栏控制器中会有一个UIToolBar实例,但默认是隐藏的,如果需要显示,需要通过这个方法将其打开: 在这里需要注意的是,与UINavigationBar类似,导航控制器拥有且只拥有一

安卓自定义组合控件--toolbar

最近在学习安卓APP的开发,用到了toolbar这个控件, 最开始使用时include layout这种方法,不过感觉封装性不好,就又改成了自定义组合控件的方式. 使用的工具为android studio 2.2,简称AS吧 1.首先创建一个新的自定义控件,如下图.AS会创建3个文件,  一个java文件,一个layout中的xml文件(这个是布局文件),一个values中的xml文件(这个是属性文件) 2. 修改布局文件,代码如下.这里使用了RelativeLayout,  并且宽度和高度都选

UIButton 按钮控件

文章出处:http://blog.csdn.net/iukey UIButton是一个标准的UIControl控件,所以如果你对UIControl不甚了解还是先看一下我的另一篇博文:<UIControl IOS控件编程> 一.创建 两种方法: 1. 常规的 initWithFrame UIButton *btn1 = [[UIButton alloc]initWithFrame:CGRectMake(10, 10, 80, 44)]; 对代码创建View(UIControl继承自UIView,

cocos2d-js 3.0 rc2 自定义UI控件组件 例子:能播放动画的MenuItem。MenuItemSprite的bug

其实总体自定义UI组件都比较简单,尤其是cocos2d-js是开源的,如果有什么不明白的直接看js代码或者C++代码即可.当然js代码基本就够了. 另外,js的ctor函数虽然说是构造函数,但毕竟不是flash或者c++的构造函数,这只是一个普通函数,也就是说可以不在第一行默认调用,这就给扩展带来了不少方便. 现在想做一个声音按钮,点一下能关闭音乐,再点一下又能打开.当然就是MenuItemToggle了. 但想做得再炫一点,有声音的时候,按钮的样子能有几个音波的变化.那么就需要用MenuIte