テーブル・レイアウト、テーブル・レイアウトの行、テーブル・レイアウトのセル

テーブル・レイアウト、テーブル・レイアウトの行、およびテーブル・レイアウトのセルは、他のビューを組み込むセクションを作成して、HTML 属性を使用して構成できるテーブルのような構造で表示します。
注: これらのビューは、 「テーブル」 ビューおよび 「サービス・データ・テーブル」 ビューとは異なります。
テーブル・レイアウトの行とテーブル・レイアウトのセルには、構成オプションはありません。 代わりに、colspan および rowspan HTML 属性を使用して、テーブル・レイアウトのセル・ビューをテーブル・レイアウト内に表示する方法を指定できます。 これらのビューでは、HTML テーブル内の場合と同じ構造を使用する必要があります。
  • テーブル・レイアウトの行ビューは、テーブル・レイアウト・ビュー内に配置されます。
  • テーブル・レイアウトのセル・ビューは、テーブル・レイアウトの行ビュー内に配置されます。
HTML 属性は、「HTML 属性」プロパティー・タブで指定します。
注: これらのビューのレイアウトは、デザイナーでは WYSIWYG ではありません。

構成プロパティー

「構成」で、ビューの構成プロパティーを設定または変更します。

画面サイズ
プロパティー名の横に画面サイズ・アイコン 画面サイズ・アイコン がある構成プロパティーは、画面サイズごとに異なる値を持つことができます。 値を設定しない場合、画面サイズはそのデフォルト値として次に大きい画面サイズの値を継承します。
テーマ定義
テーマ定義は、ビューの色およびスタイルを指定し、その外観を決定します。 ビューのルック・アンド・フィールをテーマ・エディターでプレビューできます。 テーマを参照してください。

以下の表に、テーブル・レイアウトの外観構成プロパティーを示します。

表 1. テーブル・レイアウトの外観構成プロパティー
外観構成プロパティー 説明 データ・タイプ
境界線の間隔 セル間のスペーシングをピクセル数で指定します。 String
境界線を省略 セル間のスペースについて、以下の設定の 1 つを指定します。
  • 分離: セルの間にスペースを追加します。
  • 省略: セルの間にスペースはありません。
 String

例

テーブル構造内に 2 つのテキスト・ビューを表示するには、次のようにします。
  1. テーブル・レイアウト・ビューを追加します。
  2. テーブル・レイアウト・ビュー内にテーブル・レイアウトの行ビューを挿入します。
  3. テーブル・レイアウトの行ビュー内に 2 つのテーブル・レイアウトのセル・ビューを挿入します。
  4. それぞれのテーブル・レイアウトのセル・ビューに、テキスト・ビューを 1 つ挿入します。
  5. オプションで、 「境界線の間隔」 プロパティーを 25に設定し、 「境界線の省略」 プロパティーを Separate に設定してセル間にスペースを追加します。
テーブル・レイアウト・ビュー内で複数のテーブル・レイアウトの行ビューおよびテーブル・レイアウトのセル・ビューを使用し、colspan および rowspan HTML 属性を使用してセルが複数の列または行にまたがるようにすることもできます。 例：
  1. テーブル・レイアウト・ビューを追加します。
  2. テーブル・レイアウト・ビュー内に 3 つのテーブル・レイアウトの行ビューを挿入します。
  3. ステップ 2 で追加した最初のテーブル・レイアウトの行ビュー内に、3 つのテーブル・レイアウトのセル・ビューを挿入します。
  4. ステップ 2 で追加した 2 番目のテーブル・レイアウトの行ビュー内に、1 つのテーブル・レイアウトのセル・ビューを挿入します。
  5. ステップ 2 で追加した 3 番目のテーブル・レイアウトの行ビュー内に、2 つのテーブル・レイアウトのセル・ビューを挿入します。
  6. 最初の行の最初のセルの「HTML 属性」に、属性 rowspan を追加して 3 に設定し、セル内にスイッチ・ビューを挿入します。
  7. 最初の行の 2 番目のセル内にボタン・ビューを挿入します。
  8. 最初の行の 3 番目のセル内に QR コード・ビューを挿入します。
  9. 2 番目の行のセルの「HTML 属性」に、属性 colspan を追加して 2 に設定し、セル内に単一選択ビューを挿入します。
  10. 3 行目の最初のセル内に、日付ピッカー・ビューを挿入します。
  11. 3 行目の 2 番目のセル内に、テキスト域ビューを挿入します。
結果として、以下の画像のようなレイアウトになります。

方法

テーブル・レイアウト、テーブル・レイアウトの行、およびテーブル・レイアウトのセルに使用できるメソッドの詳細情報については、 テーブル・レイアウト、 テーブル・レイアウトの行、または テーブル・レイアウトのセル JavaScript API を参照してください。

その他のリソース

Coach またはページの作成方法については、 Coach の作成を参照してください。
標準プロパティー (「一般」、 「構成」、 「位置決め」、 「可視性」、および 「HTML 属性」) について詳しくは、 「プロパティーの表示」を参照してください。