rowHeaderStampの挿入

注意: この手順では、このトピックの最後に記述されているインライン・データがUIXファイルに挿入されているものとして説明しています。demoTableDataというインライン・データでは、行と列のデータが提供されます。

rowHeaderStampを挿入するには、次のようにします。

  1. 設計構造ウィンドウで、「table」ノードを展開して、名前付きの子「rowHeaderStamp」ノードを探します。
  2. 名前付きの子「rowHeaderStamp」を右クリックして「rowHeaderStampの中に挿入」->「styledText」を選択し、指定の子を挿入します。この方法を使用しない場合には、任意のコンポーネントを挿入できます。
  3. プロパティ・インスペクタで、styledTextのtext属性の値を、行ヘッダーのテキストに変更します。

    または

    表にバインドしたインライン・データが表の行で使用されている場合には、この例で示されているように${uix.current.headerText}と入力します(headerTextは行ヘッダーのテキストのキーです)。

    注意: データ・バインディングを使用する場合には、「コンポーネントの属性のデータ・バインディング」を参照してください。
  4. 行ヘッダーのインライン・スタイルを追加するには、次のようにします。
    1. UIXビジュアル・エディタで、列ヘッダーのstyledTextコンポーネントを選択します。
    2. プロパティ・インスペクタで、inlineStyle属性を変更します。右の列でEllipsis buttonアイコンをクリックしてダイアログを開き、「新規」をクリックしてCSSプロパティの値を入力します。このproperty要素から、名前と値のペアが1つ定義されます。名前はname属性、値はその要素のテキスト・コンテンツにより定義されます。たとえば、名前にはcolor、値にはredと入力します。「詳細」タブを使用してEL構文データ・バインディングの式を入力するか、「データにバインド」ダイアログを使用してこの複合属性に対するデータソースを選択します。

例(UIX XML)


...
<provider>
  <data name="demoTableData">
    <inline>
      <!-- data for 4 rows -->
      <demoRowData firstColumnText="First row"
                   secondColumnText="First Button"
                   thirdColumnText="First col"
                   fourthColumnText="111"
                   isSelected="false"
                   isDisabled="true" />
      <demoRowData firstColumnText="Second row"
                   secondColumnText="Second Button"
                   thirdColumnText="Second col"
                   fourthColumnText="222"
                   isSelected="true" />
      <demoRowData firstColumnText="Third row"
                   secondColumnText="Third Button"
                   thirdColumnText="Third col"
                   fourthColumnText="333"
                   isSelected="false" />
      <demoRowData firstColumnText="4th row"
                   secondColumnText="4th Button"
                   thirdColumnText="4th row col"
                   fourthColumnText="444"
                   isSelected="false" />
      <!-- data for the row headers -->
      <demoRowHeaderData headerText="1"/>
      <demoRowHeaderData headerText="2"/>
      <demoRowHeaderData headerText="3"/>
      <demoRowHeaderData headerText="4"/>
      <!-- data for the 3 column headers -->
      <demoColHeaderData textKey="H1"/>
      <demoColHeaderData textKey="H2"/>
      <demoColHeaderData textKey="H3"/>
      <demoColHeaderData textKey="H4"/>
      <!-- formatting information for the rows -->
      <demoRowFormats/>
      <demoRowFormats displayGrid="false"/>
      <demoRowFormats/>
      <demoRowFormats/>
    </inline>
  </data>
</provider>
...
<contents>
  ...
  <table alternateText="No Items Found."
         blockSize="25"
         tableData="${uix.data.demoTableData.demoRowData}"
         columnHeaderData="${uix.data.demoTableData.demoColHeaderData}"
         rowHeaderData="${uix.data.demoTableData.demoRowHeaderData}">

    <!-- rowHeaderStamp for all table rows -->
    <rowHeaderStamp>
      <styledText text="${uix.current.headerText}"/>
    </rowHeaderStamp>

    <contents>
      <!-- table's indexed children are the columns -->
      <column>
        <!-- first column stamp -->
        <contents>
          <styledText text="${uix.current.firstColumnText}"/>
        </contents>
        <!-- first column header -->
        <columnHeader>
          <styledText text="${uix.current.textKey}">
            <inlineStyle>
              <property name="color">red</property>
            </inlineStyle>
          <styledText>
        </columnHeader>
      </column>

      <column>
        <!-- second column stamp -->
        <contents>
          <styledText text="${uix.current.secondColumnText}"/>
        </contents>
        <!-- second column header -->
        <columnHeader>
          <styledText text="${uix.current.textKey}"/>
        </columnHeader>
      </column>

      <column>
        <!-- third column stamp -->
        <contents>
          <styledText text="${uix.current.thirdColumnText}"/>
        </contents>
        <!-- third column header -->
        <columnHeader>
          <styledText text="${uix.current.textKey}"/>
        </columnHeader>
      </column>

      <column>
        <!-- column formatting -->
        <columnFormat columnDataFormat="numberFormat"
                      width="45%"/>
        <!-- third column header -->
        <columnHeader>
          <styledText text="${uix.current.textKey}"/>
        </columnHeader>
        <!-- fourth column stamp -->
        <contents>
          <styledText text="${uix.current.fourthColumnText}"/>
        </contents>
      </column>
    </contents>
  </table>
</contents>
...    

rowHeaderStampについて

表の作成
tableコンポーネントの使用

 

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