C
Text QML Type
シーンにテキストを追加する方法を指定します。詳細...
| Import Statement: | import QtQuick |
| Since: | Qt Quick Ultralite 1.0 |
| Inherits: |
列挙型
プロパティ
- baselineOffset : int
- bottomPadding : real
(since Qt Quick Ultralite 1.1) - color : color
- elide : Elide
(since Qt Quick Ultralite 2.1) - font : font
- horizontalAlignment : HorizontalAlignment
- leftPadding : real
(since Qt Quick Ultralite 1.1) - lineHeight : real
(since Qt Quick Ultralite 2.10) - lineHeightMode : LineHeightMode
(since Qt Quick Ultralite 2.10) - maximumLineCount : int
(since Qt Quick Ultralite 2.12) - padding : real
(since Qt Quick Ultralite 1.1) - rightPadding : real
(since Qt Quick Ultralite 1.1) - rotation : real
(since Qt Quick Ultralite 1.3) - scale : real
(since Qt Quick Ultralite 1.3) - text : string
- textFormat : TextFormat
(since Qt Quick Ultralite 2.6) - topPadding : real
(since Qt Quick Ultralite 1.1) - transform : list<Transform>
- transformOrigin : Item::TransformOrigin
(since Qt Quick Ultralite 1.3) - truncated : bool
- verticalAlignment : VerticalAlignment
- wrapMode : WrapMode
(since Qt Quick Ultralite 2.2)
詳細な説明
テキスト項目にはプレーンテキストを表示できます。たとえば、font の設定に基づいた赤いテキストは、次のように定義できます:
Text { text: "Hello World!" font.family: "Helvetica" font.pointSize: 24 color: "red" }
高さ(height)と幅(width)が明示的に設定されていない場合、Textは必要なスペースを自動的に判断し、それに応じてサイズを設定します。wrapMode が設定されていない限り、常に幅を優先し、高さよりも幅を優先して配置します(すべてのテキストが1行に収まります)。
elide プロパティを使用すると、テキストを設定された幅と高さに合わせて配置できます。
lineHeight プロパティとlineHeightMode プロパティを組み合わせて使用することで、複数行のテキスト項目の行間隔を制御できます。
textFormat プロパティを使用すると、text 内でサポートされている HTML タグの出現をどのように解釈するかを設定できます。
Text要素は、text プロパティの動的な変更をサポートしています。表示されるテキストが固定されており、コンパイル時に既知である場合は、StaticText の使用を推奨します。
「テキストのレンダリングとフォント」、「Text QML タイプ」、「StaticText 」、「リソースの管理」、および「 Qt Quick Ultralite による国際化とローカライズ」も参照してください 。
列挙型のドキュメント
Elide
elide オプションの一覧を表示します。
| 定数 | 説明 |
|---|---|
Text.ElideNone | 省略しない。 |
Text.ElideLeft | テキストを行の先頭まで省略します |
Text.ElideMiddle | テキストを行の途中まで省略します |
Text.ElideRight | テキストを行末まで省略する |
HorizontalAlignment
画像を水平方向に揃えるための代替方法を一覧表示します。
| 定数 | 説明 |
|---|---|
Text.AlignLeft | テキストを左揃えにします。 |
Text.AlignRight | テキストを右揃えにします。 |
Text.AlignHCenter | テキストを中央に揃えます。 |
LineHeightMode
行間モードの一覧を表示します。
| 定数 | 説明 |
|---|---|
Text.ProportionalHeight | 各行の間隔を倍数倍にします。たとえば、行間を2倍にするには、2に設定します。 |
Text.FixedHeight | 行間の間隔を固定値(ピクセル単位)に設定します。 |
TextFormat
テキスト形式の代替案の一覧を表示します。
| 定数 | 説明 |
|---|---|
Text.PlainText | すべてのスタイル指定タグはプレーンテキストとして扱われます。以下のセクションも参照してください Qt Quick compatibilityを参照してください。 |
Text.StyledText | 選択されたHTMLタグをサポートします |
Text.RichText | 次のようなText.StyledText |
VerticalAlignment
画像を垂直方向に揃えるための代替方法を一覧で示します。
| 定数 | 説明 |
|---|---|
Text.AlignTop | テキストを上部に揃えます。 |
Text.AlignBottom | テキストを下部に揃えます。 |
Text.AlignVCenter | テキストを中央に揃えます。 |
WrapMode
テキストの折り返しに関するさまざまなオプションを提供します。
| 定数 | 説明 |
|---|---|
Text.NoWrap | デフォルト設定です。改行は行われません。テキストに改行が含まれていない場合、設定された幅からはみ出します。 |
Text.WordWrap | 折り返しは単語の区切りでのみ行われます。単語が「テキスト」項目の幅よりも長い場合、テキストは設定された幅からはみ出します。 |
Text.WrapAnywhere | 行の任意の地点で改行が行われます。単語の途中であっても同様です。 |
Text.Wrap | 可能であれば単語の区切りで改行が行われ、そうでない場合は行内の適切な位置(単語の途中であっても)で改行されます。「WordWrap」モードとは異なり、このモードではテキストが設定幅からはみ出することはありません。 |
プロパティのドキュメント
baselineOffset : int
項目のベースラインの位置をローカル座標で指定します。
ベースラインとは、テキストが配置される仮想の線です。
bottomPadding : real [since Qt Quick Ultralite 1.1]
leftPadding : real [since Qt Quick Ultralite 1.1]
padding : real [since Qt Quick Ultralite 1.1]
rightPadding : real [since Qt Quick Ultralite 1.1]
topPadding : real [since Qt Quick Ultralite 1.1]
これらのプロパティは、テキスト周囲のパディングを指定します。
これらのプロパティは、Qt Quick Ultralite 1.1で導入されました。
color : color
テキストの色。
16進数表記を使用して定義された緑色のテキストの例:
Text { color: "#00FF00" text: "green text" }
SVGの色名を使用して定義されたスチールブルーのテキストの例:
Text { color: "steelblue" text: "blue text" }
elide : Elide [default, since Qt Quick Ultralite 2.1]
このプロパティを設定すると、テキスト項目に収まるようにテキストの一部が省略されます。
テキストを省略するには、テキスト項目の幅を明示的に定義する必要があります。
テキスト項目に複数行のテキストが含まれる場合、幅と高さの両方を
を明示的に定義する必要があります。複数行のテキストは、Text.ElideRight (行末の省略)のみをサポートしており、高さを超えたり、maximumLineCount に達したりすると、テキストの省略が開始されます。表示されている最後の行には、3つのドット(...)が表示されます。
Qt Quick Ultraliteは複数行の省略モードをサポートしており、MCU.Config.Experimental.multiLineElideを使用して有効にできます。このモードでは、利用可能な幅を超える行はすべて省略されます。このモードでは、高さを明示的に設定する必要はありません。
なお、Qt Quick は複数行の省略に対応していません。そのため、Qt Quick Ultraliteでこのモードを有効にすると、Qt Quick とは異なるレイアウト動作となり、互換性がなくなります。
省略マークはテキストの方向に従います。例:
- 左から右(LTR)のテキスト方向。
- アラビア語の同じテキストは、右から左(RTL)のテキスト方向になります。
省略モードが「Text.ElideRight 」の場合、省略記号のグリフは、LTRテキストでは右側に、RTLテキストでは左側に表示されます。
注:この プロパティは現在、StaticText ではサポートされていません。
このプロパティは、Qt Quick Ultralite 2.1で導入されました。
MCU.Config.Experimental.multiLineElideも参照してください 。
font : font
テキストの表示に使用されるフォント。
horizontalAlignment : HorizontalAlignment
verticalAlignment : VerticalAlignment
「Text」アイテムの幅と高さの範囲内で、テキストの水平および垂直方向の配置を設定します。デフォルトでは、テキストは垂直方向に上揃え、水平方向に左揃えになります。
注: 1行のテキストのサイズは 、テキストの領域を指します。この一般的なケースでは、すべての配置は同等です。テキストを親要素に対して中央揃えにしたい場合は、anchors を変更するか、horizontalAlignment をText.AlignHCenter に設定し、width を親要素のものにバインドしてください。
lineHeight : real [since Qt Quick Ultralite 2.10]
複数行のテキストの行高さを設定します。値は、lineHeightMode の設定に応じて、ピクセル単位または倍率で指定できます。
デフォルト値は 1.0 です。行高は正の値でなければなりません。
詳細については、以下を参照してください。lineHeightMode
このプロパティは、Qt Quick Ultralite 2.10 で導入されました。
lineHeightMode : LineHeightMode [since Qt Quick Ultralite 2.10]
このプロパティは、lineHeight の適用方法を制御します。
このプロパティは、Qt Quick Ultralite 2.10で導入されました。
maximumLineCount : int [since Qt Quick Ultralite 2.12]
表示される行数を制限します。elide がText.ElideRight に設定されている場合、テキストは適切に省略されます。
デフォルト値は、可能な限り最大の整数です。
関連項目elide
このプロパティは、Qt Quick Ultralite 2.12 で導入されました。
rotation : real [since Qt Quick Ultralite 1.3]
このプロパティは、アイテムのtransformOrigin を基準に、時計回りに度単位で回転した角度を保持します。
デフォルト値は 0 度(つまり、回転なし)です。
Rectangle { color: "blue" width: 100; height: 100 Text { text: "Rotated Text" color: "red" x: 25; y: 25 rotation: 30 } }
このプロパティは、Qt Quick Ultralite 1.3 で導入されました。
「 Transform 」および「Rotation 」も参照してください 。
scale : real [since Qt Quick Ultralite 1.3]
このプロパティには、このアイテムの拡大縮小係数が格納されます。
スケール値が 1.0 未満の場合、アイテムは小さく表示され、1.0 より大きい場合は大きく表示されます。スケール値が負の場合、アイテムは反転して表示されます。
デフォルト値は 1.0 です。
スケーリングは、transformOrigin から適用されます。
import QtQuick 2.15 Rectangle { color: "blue" width: 100; height: 100 Rectangle { color: "green" width: 25; height: 25 } Text { text: "Scaled Text" color: "red" x: 25; y: 25 scale: 1.4 transformOrigin: Item.TopLeft } }
このプロパティは、Qt Quick Ultralite 1.3 で導入されました。
「 Transform 」および「Scale 」も参照してください 。
text : string
表示するテキスト。テキストには、プレーンテキストとリッチテキストの両方が使用できます。
textFormatも参照してください 。
textFormat : TextFormat [since Qt Quick Ultralite 2.6]
text プロパティの表示方法。
Qt Quick Ultralite では、StyledText とRichText の両方が同じバックエンドにマッピングされます。
HTMLパーサーについて
Qt Quick Ultraliteは、マイクロコントローラ環境向けに設計された、最小限かつ決定論的なHTMLサブセットパーサーを使用しています。ブラウザのHTMLパーサーとは異なり、不正なマークアップを修正・再解釈することはなく、メモリの割り当ても行いません。
厳格な解析ルール:
- サポートされていないタグや不正な形式のタグは無視されます。
- 属性名は小文字でなければなりません。属性値には二重引用符を使用します。
- 孤立した終了タグやネストが間違っている終了タグはエラーにはなりませんが、スタイルは適用されません。
サポートされているHTMLタグ
インライン画像:
<img src="" align="bottom,middle,top"> // Text item <img src="" align="bottom,middle,top" width="50" height="40"> // StaticText item
太字および斜体の書式設定:
<b> ... </b> // bold <i> ... </i> // italic
インライン画像(<img> タグ)
Text { textFormat: Text.StyledText text: "Qt <img src=\"qt-logo.png\" align=\"middle\">" }
HTML 4仕様書によれば:
| 定数 | 説明 |
|---|---|
bottom | 画像の下端がテキストのベースラインに揃う(デフォルト) |
middle | 画像の垂直方向の中心がテキストのベースラインに揃う |
top | 画像の上端がテキスト行の上端に揃う |
ベースラインとは、文字が並ぶ仮想の線です。「bottom」と「middle」はベースラインを基準としていますが、「top」は行高に合わせて配置されます。
StaticText 実行時に画像が読み込まれることはないため、アイテムには明示的なwidth およびheight が必要です。不一致が検出された場合、警告が表示され、レンダリングが意図したレイアウトと一致しない可能性があります。
「リソースの管理」も参照してください。
例:
StaticText { text: "flag <img src=\"latvia-flag-small-icon.png\" width=\"38\" height=\"20\">" textFormat: Text.RichText }
太字および斜体の書式設定(<b> および <i> タグ)
同一の文字列内で異なるスタイルのフォントを混在させる機能は、Qt Quick Ultralite 3.0 以降で利用可能となり、Qt Quick Ultralite 2.12.2 以降では 2.12.x シリーズでも利用可能となっています。
Text { textFormat: Text.StyledText text: "This is <b>bold</b>, this is <i>italic</i>, and this is <b><i>both</i></b>." }
スタイルが適用されたspan要素の内部に画像を表示することも可能です:
Text { textFormat: Text.StyledText text: "<i>Hello <img src=\"icon.png\"> world</i>" }
この例では:
- 画像は正しい位置にインラインで表示され、
- 画像をまたいでイタリックスタイルが継続し、
- 画像の前後にあるテキストもイタリック体で表示されます。
スタイリングエンジンは、項目のベースフォントに <b> および <i> の効果を適用することで、各 span に使用されるフォントを導出します。アプリケーションは、対応する派生フォント(太字、斜体、太字+斜体)がフォント設定で利用可能であることを保証する必要があります。
フォント設定のトラブルシューティング
HTML構文を使用する前に、Text アイテムに直接設定して、期待されるフォントバリエーションが存在することを確認してください。派生したフォント設定が利用可能であることが確認されれば、HTMLリゾルバーは<b> および<i> のスタイリングを正しく適用できます。
readonly property font boldItalicFont: Qt.font({ pixelSize: 30, bold: true, italic: true }) Text { anchors.centerIn: parent font: boldItalicFont text: "Verify that bold+italic is configured and supported" }
Sparkフォントエンジンを使用している場合は、「フォントクラスのマッピング」を参照してください。
Staticフォントエンジンを使用している場合は、「MCU.Config.autoGenerateGlyphs」を参照してください。MCU.Config.autoGenerateGlyphs がtrue に設定されている場合でも、アプリケーションが期待される派生フォントスタイルを明示的に登録していることを確認する必要があります。例:
readonly property font size30Font: Qt.font({ pixelSize: 30 }) // Note the same pixel size as the base font: size30Font. readonly property font boldSize30Font: Qt.font({ pixelSize: 30, bold: true }) Text { anchors.centerIn: parent font: size30Font textFormat: Text.StyledText text: "Qt for <b>MCUs</b>" }
textFormatのデフォルト値とQt Quick の互換性
Qt Quick の「Text」項目のtextFormatプロパティは、デフォルトでText.AutoTextを使用します。このフォーマット値は、実行時のオーバーヘッドを回避するため、Qt Quick Ultraliteでは実装されていません。Qt Quick でテキストのレンダリングが異なるのはごく稀なケースのみですが、これはアプリケーションレベルで簡単に解決できます。以下の例を参照してください。
スタイル付きテキストをレンダリングするには、StyledText またはRichText を明示的に設定する必要があります。以下のコードは、Qt Quick UltraliteとQt Quick の両方で同じように動作することが期待されます。
Text { textFormat: Text.StyledText text: "Qt <img src=\"qt-logo.png\">" }
Qt Quick UltraliteでHTMLタグを含むテキストをプレーンテキストとしてレンダリングするには、デフォルト値であるPlainText を利用します。通常、デフォルトの挙動が望まれる場合は、qmlプロパティを明示的に設定することは避けるべきです。これにより、メモリ効率に優れたコードを生成できるようになります。
Text { text: "Qt <img src=\"qt-logo.png\">" }
なお、上記の例では textFormat プロパティが明示的に設定されていないため、Qt Quick は Text.AutoText の挙動に従います。このような稀なケースでは、両方の実装で意図した挙動を得るために、textFormat プロパティを明示的に設定する必要があります。
Text { textFormat: Text.PlainText text: "Qt <img src=\"qt-logo.png\">" }
このプロパティは、Qt Quick Ultralite 2.6 で導入されました。
transform : list<Transform>
このプロパティには、適用する変換のリストが格納されます。
詳細については、Transform を参照してください。
transformOrigin : Item::TransformOrigin [since Qt Quick Ultralite 1.3]
このプロパティは、scale およびrotation が変換を行う際の原点を保持します。
下の画像に示すように、9つの変形原点が利用可能です。デフォルトの変形原点はItem.Center です。

この例では、テキストをその右下隅を基準に回転させています。
Text { text: "Hello" transformOrigin: Item.BottomRight rotation: 45 }
任意の変形原点を設定するには、`transform` を使用して、Scale またはRotation の変形タイプを指定します。
このプロパティは、Qt Quick Ultralite 1.3で導入されました。
truncated : bool [read-only]
elide によりテキストが切り詰められている場合、true を返します。
「elide」も参照してください 。
wrapMode : WrapMode [since Qt Quick Ultralite 2.2]
このプロパティを設定すると、テキストが「Text」項目の幅に合わせて折り返されます。テキストが折り返されるのは、明示的に幅が設定されている場合のみです。テキストの折り返しには、以下のいずれかのモードを使用してください。
注:この プロパティは現在、StaticText アイテムではサポートされていません。
このプロパティは、Qt Quick Ultralite 2.2 で導入されました。
関連項目: MCU.Config.ideographicCharacterWrap。
特定のQtライセンスの下で利用可能です。
詳細はこちらをご覧ください。