TableFrame

<TableFrame> は複雑なヘッダーやフッターを持った表を作成するための要素です。

  • XML

 <TableFrame>

  <TablePageHeader>
    <Grid cols="20 20 20" rows="auto" borderThickness="0.1">
      <GridCell colspan="3"><Text align="center">カスタムヘッダー</Text></GridCell>
    </Grid>
  </TablePageHeader>

  <Table items="${items}" rowHeight="5" minRows="5" borderThickness="0.1">
    <TableColumn width="20">
      <TableColumnTemplate>
        <Text>${column0}</Text>
      </TableColumnTemplate>
    </TableColumn>
    <TableColumn width="20">
      <TableColumnTemplate>
        <Text>${column1}</Text>
      </TableColumnTemplate>
    </TableColumn>
    <TableColumn width="20">
      <TableColumnTemplate>
        <Text>${column2}</Text>
      </TableColumnTemplate>
    </TableColumn>
  </Table>

  <TableFooter>
    <Grid cols="20 20 20" rows="5" borderThickness="0.1">
      <GridCell colspan="3"><Text align="center">カスタムフッター</Text></GridCell>
    </Grid>
  </TableFooter>

 </TableFrame>

  • バインディングデータ

{
  "items":[
    {
      "column0":"col0 row0",
      "column1":"col1 row0"
    },
    {
      "column0":"col0 row1",
      "column1":"col1 row1"
    }
  ]
}
描画結果

プロパティ

hidden

要素を非表示にするプロパティです。

このプロパティは Boolean を指定します。 規定値は false です。

breakInside

要素内での改行の制御方法を決定するプロパティです。

このプロパティは auto または avoid を指定します。 規定値は auto です。

auto

改ページを要素内でも行う設定です

avoid

改ページを要素内で行うことを避ける設定です。

x

StackLayout専用

要素の横位置を決定するプロパティです。

このプロパティは 実数 を指定します。 規定値は 0.0 です。 単位はミリメートルです。

y

StackLayout専用

要素の縦位置を決定するプロパティです。

このプロパティは 実数 を指定します。 規定値は 0.0 です。 単位はミリメートルです。

origin

StackLayout専用

要素の原点位置を決定するプロパティです。

値は以下のキーワードから選択します。 規定値は topLeft です。

topLeft

原点を左上に設定します。

bottomLeft

原点を左下に設定します。

topRight

原点を右上に設定します。

bottomRight

原点を右下に設定します。

width

StackLayout専用

必須

要素の横幅を設定します。

このプロパティは 0以上の実数 を指定します。 単位はミリメートルです。

foreach

この要素を繰り返し描画します。

このプロパティには Array を指定します。

関連情報