APL Text



APL Text

Textコンポーネントは1行または複数行でテキストを表示します。Alexaスキルで良好なユーザーエクスペリエンスを実現するためのテキストの使用方法については、Alexaデザインガイド–テキストを参照してください。

プロパティ

プロパティ 必須 スタイル設定 動的 説明
color テキストの色です。ダークテーマはデフォルトを#FAFAFAに、ライトテーマは#1E2222 に設定してください。
fontFamily 文字列 フォントファミリーです(「Amazon Ember Display」など)。デフォルトはロケールによって異なります。
fontSize ディメンション: プロパティ テキストのサイズです。デフォルトは40dpです。
fontStyle normal、italic 表示するフォントスタイルです。デフォルトはnormalです。
fontWeight normal、bold、100、200、300、400、500、600、700、800、900 表示するフォントの太さです。デフォルトはnormalです。
letterSpacing ディメンション: プロパティ 文字間に追加するスペースです。デフォルトは0です。
lineHeight 数値(パーセント) 行の高さの乗数です。デフォルトは1.25です。
maxLines 整数 表示するテキストの最大行数です。表示されないテキストがある場合は、省略符号を使ってテキストを省略します。デフォルトは0で、制限がないことを表します。
text 文字列 このテキストボックスに表示するマークアップです。この値がnullまたは空の文字列""に設定されている場合、コンテンツは表示されません。
textAlign auto | left | right | center パラグラフ内でのテキストの配置です。デフォルトはautoです。
textAlignVertical auto | top | bottom | center テキストの垂直方向の配置です。デフォルトはautoです。

これらのプロパティのほとんどに、現在のテキストスタイルが指定するデフォルト値があることにご注意ください。スタイルの説明についてはリソースセクションを参照してください。

Textコンポーネントは、ScrollView内に配置されない限りスクロールしません。

color

テキストの色です。テーマがライトの場合、デフォルトは#1E2222です。テーマがダークの場合、デフォルトは#FAFAFAです。

fontFamily

テキストを書くときに使用するフォントファミリーです。APL作成者は通常、このプロパティを設定しないようにしてください。ターゲットデバイスでどのフォントが使用可能か不明だからです。

デフォルト値は言語によって異なります。日本語以外のロケールのデフォルトはAmazon Ember Displayです。日本語のデフォルト値はNoto Sans CJKです。スタイルパッケージ‐フォントファミリーを参照してください。

fontSize

フォントのサイズです。通常はdpで表します。デフォルトは40dpです。

fontStyle

標準またはイタリックのフォントスタイルです。デフォルトはnormalです。

fontWeight

フォントの太さです。デフォルトはnormalです。標準太字がランタイムに割り当てられています。100から900までの整数値がフォントバリエーションに対応しており、数字が大きくなると太くなります。ほとんどのフォントはこれほど多くのバリエーションはサポートしていません。たとえば、Amazon Emberには5種類の太さ(Thin、Light、Regular、Medium、Bold)があり、それぞれ100、300、500、700、900が割り当てられています。

fontWeightは、整数や文字列としてではなく、列挙セットとして処理されることに注意してください。たとえば、750という値は無効なので、フォントの太さは700~800の間には設定されません。リソースでfontWeightを割り当てる場合は、文字列リソースを使うことを推奨します。

letterSpacing

文字間に追加するスペースです。デフォルトは0です。

lineHeight

行の高さの乗数です。デフォルトは1.25です。

maxLines

表示するテキストの最大行数です。デフォルトはNで、Nは非常に大きな数です。小さい数を設定すると、テキストは、その数の行数に切り取られ、テキストが切れてしまう場合は省略符号が挿入されます。

text

textの値をnullにするのは、値を空の文字列「""」になるように設定するのと同じ意味です。

テキストブロックは簡単なマークアップをサポートしています。サポートされているタグは以下のとおりです。

タグ 説明 表示
<br> 改行を挿入します。改行は繰り返せます。 行1<br>行2 行1
行2
<strong><b> 間のテキストを太字にします。 <b>大型</b>犬は人懐っこい。 大型犬は人懐っこい。
<em><i> 間のテキストを斜体にします。 宿題の<em>エマ</em>を読む。 宿題のエマを読む。
<strike> 間のテキストに取り消し線を引きます。 このドキュメントは<strike>よい</strike>とてもよい。 このドキュメントはよいとてもよい。
<u> 間のテキストに下線を引きます 私はチョコレートが<u>大好きでした</u>。 私はチョコレートが大好きでした
<tt><code> 間のテキストを等幅で表示します。

<code>main</code>関数がエントリーポイントです。

main関数がエントリーポイントです。
<sup><sub> 間のテキストを上付きまたは下付きの文字として表示します。 H<sub>2</sub>Oの化学式についてはギブソン<sup>1</sup>を参照のこと。 H2Oの化学式についてはギブソン1を参照のこと。

マークアップ要素は入れ子にできます。不適切に入れ子構造にしたマークアップは未定義の動作を起こします。<b>昔むかし、<u>小さな犬が</b>バッタを食べて具合が悪くなりました。</u><b>と<u>の要素を適切に入れ子構造にしていないため、上記の文は未定義のものとして描画されます。

テキストのマークアップ文字は、文字実体参照で置き換える必要があります。

実体 文字 説明
& \& アンパサンド
< < 小なり記号
> > 大なり記号
&#nn; 10進数のUnicodeのコードポイントです。 「nn」は有効な整数です。
&#xnn; 16進数のUnicodeのコードポイントです。 「nn」は有効な16進数です。

数値実体参照は10進数と16進数で表記できます。たとえば、©は©または©と表記できます。

textAlign

テキストの行の配置を、leftcenterrightautoのいずれかに制御します。デフォルトはautoで、対象のフォントを記述していく標準の方向を考慮して設定されます(たとえば、英語の場合はleft揃え)。

textAlignVertical

テキストボックス内のテキストの配置を指定します。テキストボックスにテキストのコンテンツよりも高さがある場合にのみ使用します。デフォルトはtopです。

サンプルテキスト

{
    "type": "Text",
    "width": 400,
    "align": "center",
    "style": "textStylePrimary2",
    "text": "<b>こんにちは。</b>アシスタントのアレクサです。",
    "maxLines": 2
}