UIFormDialog表单对话框

APIUMC

后端知识体系开发原生移动应用

已关注

UIFormDialog表单对话框

UIFormDialog是一个表单对话框，可以获取输入多值。

在UIFormDialog中，默认一但提交就关闭对话框，当然也可以通过数据事件来关闭表单对话框。

下全例举UIFormDialog的各种输入框支持事件模式或会话模式列表。

方法	说明	备注
AddNumber	数字输入框
AddScan	扫码输入框
AddText	文本输入框
AddFile	文件上传
AddFiles	多文件上传
AddTextarea	多行文本输入框
AddDate	日期输入框
AddTime	时间输入框
AddPassword	密码输入框
AddSelect	Select选择框	在移动表现为Radio样式
AddCheckBox	多选框
AddRadio	单选框
AddVerify	验证码输入框
AddSlider	滑块输入框
AddOption	页面选择框
AddColor	页面选择框	Option扩展
AddIcon	图标选择框
AddAddress	地址输入框
AddRadioText	许可描述框

java 实例：

WebMeta user = this.asyncDialog(d ->{
    UIFormDialog dialog = new UIFormDialog();
    dialog.title("账户登录"); 
    dialog.addText("手机号码", "Username", "").put("placeholder", "手机");

    dialog.addVerify("验证码", "VerifyCode", "您收到的验证码").put("For", "Username").put("To", "Mobile")
            .command(request.model() , request.cmd());
    //开启事件对话框，用User数据事件来关闭此界面，如果没有此行代码，则是会话对话框，界面验证通过就关闭
    dialog.submit("登录", request, "User");

    return dialog;

}, "Login");

关于表单分组说明，在UIFormDialog中，例如 TexTValue，Checkbox，Radio多值组件就会采用分组显示，如果想自定义分组，则可以用增加输入控件后，再用此方法追加组名，如put("tip","分组名")，则可分组，其中分组名也可以为空;

addVerify 方法

验证码输入框，他可以发送验证码，可以绑定Model和Command来发送验证码，还可以配置取当前表单对话框那个值做为号码来发送，看代码

    dialog.addVerify("验证码", "VerifyCode", "您收到的验证码").put("For", "Username").put("To", "Mobile")
            .put("Command", request.cmd()).put("Model", request.model());

上列的意思就是取"Username"做为"Mobile"合成参数{Mobile:"1380000000"}的形式请求发送，请参考Account.Login或者Account.Mobile模块指令

addOption 方法

页面选择框，数据来源于新的页面，他用name通过UIEvent事件机制完成数据选择操作。实例代码：

@Apiumc(model = "Settings", cmd = "SelectUser", desc = "选择用户")
public class SettingsSelectUserActivity extends WebActivity {

    public void processActivity(WebRequest request, WebResponse response) {
        String key = this.asyncDialog("Key",  "SelectUser");

        UUID UserId = Utility.uuid(this.asyncDialog("UserId", g ->
        {
            return new UserDialog().search(true, false).title("选择人员").closeEvent("UI.Event");

        }));


        User user = UMC.Data.Database.instance().objectEntity(User.class)
                .where().and().equal(new User().Id(UserId)).entities().single();
        ListItem item = new ListItem(user.Alias, user.Username);
        this.context().send(new UMC.Web.WebMeta().event(key, item), true);
    }
}

同时UIFormDialog也可以Add方法加载单元行组件，让表单界面更丰富。

 管理员 | 阅读(174) | 评论(0)

赞评论

已读

 暂无评论

UIFormDialog表单对话框

addVerify 方法

addOption 方法