styledListおよびstyledItemを使用したリストの作成

styledListとstyledItemを使用してリストを作成するには、次のようにします。

  1. 目的のファイルの設計構造ウィンドウで、styledListコンポーネント(たとえば、sideBarまたはcontentContainer)を挿入する親ノードを探します。
  2. コンポーネント・パレットのドロップダウン・リストから「Layout Components」を選択し、styledListコンポーネントを、選択した親ノードにドラッグ・アンド・ドロップします。

    「styledList」ノードが、展開された親ノードに挿入され、強調表示されます。

  3. 「styledList」ノードを右クリックして「styledListの中に挿入」->「styledItem」を選択します。

    「styledItem」ノードが挿入され、展開された「styledList」ノードで強調表示されます。

  4. 「styledItem」ノードを右クリックして「styledItemの中に挿入」->「link」を選択します。

    「link」ノードが、展開された「styledItem」ノードに挿入され、強調表示されます。

  5. プロパティ・インスペクタで、新規のlinkコンポーネントに対して属性を次のように設定します。
  6. ステップ3から5を繰り返し、任意の数のリストの項目を追加します。

    リストの項目が順番に縦に表示されます。順序の最初の項目の番号が0、2番目の項目が1のように番号が振られます。

  7. リストにスタイルと選択した項目を設定するには、次のようにします。
    1. 設計構造ウィンドウで、「styledList」ノードを選択します。
    2. プロパティ・インスペクタで、styledListコンポーネントに対して次の属性を設定します。
      • listStyle: リストに使用するスタイルを指定します。使用可能なオプションは、disc(デフォルト)、circle、square、decimal、lowerAlpha、upperAlphaおよびnoneです。lowerAlphaとupperAlphaで使用される文字は、26文字のアルファベットであることに注意してください。
      • selectedIndex: リストのうち、選択状態でレンダリングされる索引付けされた子の値を入力します。選択されている子が別のstyledListコンポーネントである場合、そのstyledListの子であるlabelが、選択状態で表示されます。次の値を使用してください。
        • 0: リストの1番目の子を選択済にする。
        • 1: 2番目の子を選択済にする。
        • 2: 3番目の子を選択済にする(その後も同様)。

注意: データ・バインディングの使用は、「コンポーネント属性のデータ・バインディング」を参照してください。

例(UIX XML)


...
<pageLayout>

...

  <styledList listStyle="decimal" selectedIndex="1">
    <contents>
      <styledItem >
        <contents>
          <link text="Link 1 Text" destination="http://www.oracle.com"/>
        </contents>
      </styledItem>
      <styledItem>
        <contents>
          <link text="Link 2 Text" destination="http://www.oracle.com"/>
        </contents>
      </styledItem>
      <styledItem>
        <contents>
          <link text="Link 3 Text" destination="http://www.oracle.com"/>
        </contents>
      </styledItem>
    </contents>
  </styledList>

...

  <!-- REST OF PAGE LAYOUT -->

<pageLayout>
...    

styledListとstyledItemについて
bulletedListについて

styledListおよびlabelを使用した階層リストの作成
styledListの索引付けされた子の間への垂直間隔の挿入
レイアウト・コンポーネントの使用

 

Copyright © 1997, 2004, Oracle. All rights reserved.