Aem touch UIダイアログの水平レイアウトを設定する方法

Question

私は、古いExtJsサイズのウィジェットのように2つのテキストボックスを並べて配置する必要があるタッチUI要件があります。 layoutがあります。これらのオブジェクトを隣に置くためにitemに設定することができます。以前の実装では、hboxレイアウトのカスタムウィジェットを作成しました。私はこれが今サポートされるべきだと思いますが、ドキュメントでそれを見つけることはできません。すべての参考文献が役立ちます。おかげ

Answer 1

あなたはfixedColumn layout

を使用する必要がありますが、スクリーンショットを参照してください、あなたはがフローティングダイアログモードで列を表示されません、このレイアウトは、フルスクリーンダイアログのために意図されていることに注意してください。ここで

私は一緒に入れ例です。

<?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" xmlns:nt="http://www.jcp.org/jcr/nt/1.0" 
    jcr:primaryType="nt:unstructured" 
    jcr:title="Sample" 
    sling:resourceType="cq/gui/components/authoring/dialog" 
    mode="edit"> 
    <content 
     jcr:primaryType="nt:unstructured" 
     sling:resourceType="granite/ui/components/foundation/container"> 
     <items jcr:primaryType="nt:unstructured"> 
      <columns 
       jcr:primaryType="nt:unstructured" 
       sling:resourceType="granite/ui/components/foundation/container"> 
       <layout 
        jcr:primaryType="nt:unstructured" 
        sling:resourceType="granite/ui/components/foundation/layouts/fixedcolumns"/> 
       <items jcr:primaryType="nt:unstructured"> 
        <col1 
         jcr:primaryType="nt:unstructured" 
         jcr:title="General" 
         sling:resourceType="granite/ui/components/foundation/section"> 
         <items jcr:primaryType="nt:unstructured"> 
          <filed1col1 
           jcr:primaryType="nt:unstructured" 
           sling:resourceType="granite/ui/components/foundation/form/textfield" 
           fieldDescription="sample filed1col1" 
           fieldLabel="filed 1 col 1" 
           name="./filed1col1"/> 
         </items> 
        </col1> 
        <col2 
         jcr:primaryType="nt:unstructured" 
         jcr:title="Phone Numbers" 
         sling:resourceType="granite/ui/components/foundation/section"> 
         <items jcr:primaryType="nt:unstructured"> 
          <filed1col2 
            jcr:primaryType="nt:unstructured" 
            sling:resourceType="granite/ui/components/foundation/form/textfield" 
            fieldDescription="sample filed1col2" 
            fieldLabel="filed 1 col 2" 
            name="./filed1col2"/> 
         </items> 
        </col2> 
       </items> 
      </columns> 
     </items> 
    </content> 
</jcr:root> 

ダイアログを浮動モードでフルスクリーンモードで

ダイアログ

を、それがどんなの場合と同様ダイアログ関連の質問、あなたは自分のCSSを書くことができますしかし、将来的にダイアログマークアップ/クラスが変化するリスクを冒すと、CSSが役に立たなくなります。