Question

我最近有理由退出几个不相关的框架并从头开始。在一种情况下， Javascript 驱动表单UI，而另一种情况则与 Java Swing 相同。我意识到我可以创建一个简单的 JSON 对象来定义从场到事件绑定的UI元素。

在我走得非常远的兔子洞之前，我开始疑惑：是否有一个新兴的或现有的标准有人见过这种事情？

以下是我所嘲笑的一种风味。我正在使用JSON对象来定义Swing UI布局以及（单独）面向JavaScript的JavaScript生成的Web表单。

这两个变量源于我的构建，最初是一个简单的网格控件，在我认为拥有一个表单之前我需要字段。当然，它可以折叠成一个JSON结构。

var app = {
        forms: form1,
        bindings: [],
        layout:[{
            width: 400,
            height: 300,
            bgcolor: '#fefefe',
            color: 'black'
        }]
    }


    var form1 = {
        "formfield1": {
            itype: "text",
            tag: "input",
            iclass: "frminput",
            defaultval: "text input",
            label: "Text Value 1",
            validation: '/[a-z][A-Z][0-9]/',
            error: "No special characters allowed - only numbers or letters for this input",
            bindings: [{
                ievent: 'click',
                fx: function(){
                    validateTest(this);
                }
            },{
                ievent: 'blur',
                fx: function(){
                    blurTest(this);
                }
            }]
        },

        "formfield2": {
            itype: "select",
            tag: "select",
            iclass: "frminput",
            defaultval: "apples",
            label: "Test Select",
            options: [["apples","Apples"], ["oranges","Oranges"], ["peaches","Peaches"]]
        },

        "formfield3": {
            itype: "date",
            tag: "input",
            iclass: "date",
            label: "Test Date",
            defaultval: new Date()
        },

        "formfield4": {
            itype: "text",
            tag: "input",
            iclass: "frminput",
            label: "Text field 2",
            defaultval: "text input other"
        },

        "objectproperty": {
            itype: "button",
            tag: "button",
            iclass: "btn btn-small",
            label: "test magnitude button",
            defaultval: "",
            bindings: [{
                ievent: 'click',
                fx: function(){
                    buttonAction(this);
                }
            }]
        }
    };

我最想发现的是，其他人已经对此进行了更多考虑。

这篇文章的第二个最佳结果将是对最佳实践的一些建议。

目标是拥有一个相当不可知的实现，可以在将来移植到其他平台，或者提供不同系统的轻松集成。

更新：在这个问题中进行了很好的讨论：Standard JSON API response format?关于各种基于JSON的对象和实现的新兴和建议标准。其中大部分都集中在AJAX的使用上。这个问题仍然是一个很好的交叉引用。

Answer 1

Angular Formly就是这样一种努力。

Answer 2

我正在继续研究这个问题，但至少找到了一个答案。

GNome建议将Clutterscript作为使用JSON定义用户界面的解决方案。 https://developer.gnome.org/clutter-cookbook/stable/script-ui.html

我会在这个答案中添加任何类似的东西。 clutterscript解决方案不是最优的，因为它有一些特定于框架的项和JSON表示法中的标记。我的观点是JSON表示法应该从实现者那里抽象出来。实现者应该决定如何处理JSON对象中包含的UI描述。

是否有可接受或正在出现的JSON表单和字段定义格式？

2 个答案: