3

我有一个触摸 UI 组件,我正在 AEM 6 中为其创建一个对话框。我需要在触摸对话框中创建 2 个单选按钮,如果选择其中一个,则所选单选按钮的相应值应该是显示。但是,我不明白如何创建单选按钮选项。我在使用 xtype=selection 和 type=radiogroup 的经典对话框中实现了相同的功能,但我不明白如何在触摸对话框中创建它在此处输入图像描述

4

4 回答 4

7

这是 CoralUI v1/v2 的无线电组示例。这radiogroup是可选的,radio小部件本身仍然可以工作。仅当您想为组添加标签时才需要该组。

<radioGroup jcr:primaryType="nt:unstructured"
    name="./type"
    text="Fruit"
    required="{Boolean}true"
    sling:resourceType="granite/ui/components/foundation/form/radiogroup"
    renderReadOnly="{Boolean}true">

    <items jcr:primaryType="nt:unstructured">
        <radioApple jcr:primaryType="nt:unstructured"
            name="./fruit"
            text="Apple"
            value="apple"
            cq-msm-lockable="fruit"
            sling:resourceType="granite/ui/components/foundation/form/radio"
            renderReadOnly="{Boolean}true"/>
        <radioPear jcr:primaryType="nt:unstructured"
            name="./fruit"
            text="Pear"
            value="pear"
            cq-msm-lockable="fruit"
            sling:resourceType="granite/ui/components/foundation/form/radio"
            renderReadOnly="{Boolean}true"/>
        <radioDefaultValue jcr:primaryType="nt:unstructured"
            name="./fruit@DefaultValue"
            value="apple"
            sling:resourceType="granite/ui/components/foundation/form/hidden"/>
        <radioDefaultWhenMissing jcr:primaryType="nt:unstructured"
            name="./fruit@UseDefaultWhenMissing"
            value="true"
            sling:resourceType="granite/ui/components/foundation/form/hidden"/>
    </items>
</radioGroup>

注意:如果您需要在打开对话框之前设置默认值,那么您需要在模板(如果它是页面对话框)或组件中定义它。

对于组件,要将默认值设置为apple您将在以下内容中添加.content.xml

<?xml version="1.0" encoding="UTF-8"?>
<jcr:root xmlns:sling="http://sling.apache.org/jcr/sling/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0"
          xmlns:jcr="http://www.jcp.org/jcr/1.0"
          jcr:primaryType="cq:Component"
          jcr:title="Fruit Component"
          componentGroup="My App Group"
          sling:resourceSuperType="foundation/components/parbase">

    <cq:template jcr:primaryType="nt:unstructured" fruit="apple"/>
</jcr:root>

也可以看看:

笔记:

如果您正在为 AEM 6.3 进行开发,那么您将需要所有granite/ui/components/foundation/form/radio组件的 CoralUI3 风格,即您应该使用granite/ui/components/coral/foundation/form/radio等代替。

有关迁移到 CoralUI 3 的详细信息,请参阅https://helpx.adobe.com/experience-manager/6-3/sites/developing/using/reference-materials/granite-ui/api/jcr_root/libs/granite/ui/组件/旧版/coral2/migration.html

于 2015-04-20T18:46:05.727 回答
4

您可以使用表单输入 - 收音机。要创建单选按钮组,请为所有单选按钮指定相同的名称。Radio 输入的 resourceType 是/libs/granite/ui/components/foundation/form/radio

节点的示例 Json:

"hideinnav": {
"jcr:primaryType": "nt:unstructured",
"name": "./hideInNav",
"text": "Hide in Navigation",
"value": "true",
"cq-msm-lockable": "hideInNav",
"sling:resourceType": "/libs/granite/ui/components/foundation/form/radio",
"renderReadOnly": true
},
"showinNav": {
"jcr:primaryType": "nt:unstructured",
"name": "./hideInNav",
"text": "Show in Navigation",
"value": "false",
"cq-msm-lockable": "hideInNav",
"sling:resourceType": "/libs/granite/ui/components/foundation/form/radio",
"renderReadOnly": true
}

与在选项节点下设置按钮的经典 UI 选择小部件不同,单选按钮是独立的,可以直接在容器中使用。

于 2014-12-17T11:56:45.927 回答
0

Coral UI3 不再支持单独的表单/收音机。这现在被表单/无线电组取代 https://helpx.adobe.com/experience-manager/6-4/sites/developing/using/reference-materials/granite-ui/api/jcr_root/libs/granite/ui /components/legacy/coral2/migration.html

在 Coral UI3 中,要创建两个单选按钮,您可以执行以下操作:

   <radioGroup 
            jcr:primaryType="nt:unstructured"
            name=“./state“
            text=“Select an Option”
            sling:resourceType="granite/ui/components/coral/foundation/form/radiogroup">
            <items jcr:primaryType="nt:unstructured">
                <radioExpanded jcr:primaryType="nt:unstructured"
                    text="Expanded"
                    value="expanded”/>  
                <radioCollapse
                    jcr:primaryType="nt:unstructured"
                    text=“Collapse”
                    value=“collapse”/>
            </items>
        </radioGroup>
于 2020-09-03T19:24:05.480 回答
-3

AEM 6 Touch UI 不支持单选按钮组。相反,您可以使用下拉菜单?吊索:resourceType="granite/ui/components/foundation/form/dropdown"

于 2015-05-20T21:36:44.537 回答