RTF 區塊
RTF 方塊提供數種進階文字版面配置的功能,可在您需要支援段落、內嵌 UI 元素或複雜文字版面配置時使用。
這是正確的控制項嗎?
如果您需要支援多個段落、多欄或其他複雜文字版面配置,或者影像等內嵌 UI 元素,請使用 RichTextBlock。
使用 TextBlock 在您的應用程式中顯示大部分唯讀文字。 您可以使用它來顯示單行或多行文字、內嵌超連結,以及採用粗體、斜體或底線格式的文字。 TextBlock 提供較簡單的內容模型,如此一來,通常就能讓它更易於使用,而且它可以提供比 RichTextBlock 更好的文字轉譯效能。 這是多數應用程式 UI 文字的偏好選項。 儘管您可以在文字中放置分行符號,但 TextBlock 是針對顯示單一段落而設計,不支援文字縮排。
如需如何選擇正確文字控制項的詳細資訊,請參閱文字控制項文章。
建議
請參閱字型印刷樣式和指導方針。
UWP 和 WinUI 2
重要
本文中的資訊和範例針對使用 Windows App SDK 和 WinUI 3 的應用程式進行了最佳化,但通常適用於使用 WinUI 2 的 UWP 應用程式。 如需平台特定資訊和範例,請參閱 UWP API 參考。
本節包含您在 UWP 或 WinUI 2 應用程式中使用控制項所需的資訊。
此控制項的 API 位在 Windows.UI.Xaml.Controls 命名空間中。
- UWP API:RichTextBlock 類別、RichTextBlockOverflow 類別、Paragraph 類別、Typography 類別
- 開啟 WinUI 2 程式庫應用程式,並查看 RichTextBox 運作情形。 WinUI 2 程式庫應用程式包含大部分 WinUI 2 控制項、特性和功能的互動式範例。 從 Microsoft Store 取得應用程式,或在 Github 上取得原始程式碼。
建議使用最新的 WinUI 2 來取得所有控制項的最新樣式和範本。 WinUI 2.2 或更新版本包含此使用圓角之控制項的新範本。 如需詳細資訊,請參閱圓角半徑。
建立 RTF 方塊
WinUI 3 資源庫應用程式包含大多數 WinUI 3 控制項和功能的互動式範例。 從 Microsoft Store 取得應用程式,或在 GitHub 上取得原始程式碼
RichTextBlock 的內容屬性是 Blocks 屬性,可透過 Paragraph 元素支援段落式的文字。 它沒有 Text 屬性可供您在應用程式中輕鬆存取控制項的文字內容。 不過,RichTextBlock 提供數種 TextBlock 未提供的獨特功能。
RichTextBlock 支援以下功能:
- 多段落。 藉由設定 TextIndent 屬性來設定段落的縮排。
- 內嵌 UI 元素。 使用 InlineUIContainer 來顯示內嵌在文字中的 UI 元素,例如影像。
- 溢位容器。 使用 RichTextBlockOverflow 元素來建立多欄文字的版面配置。
段落
您可以使用 Paragraph 元素來定義要在 RichTextBlock 控制項內顯示的文字區塊。 每個 RichTextBlock 都應至少包含一個 Paragraph。
您可以設定 RichTextBlock.TextIndent 屬性,藉此設定 RichTextBlock 中所有段落的縮排量。 您可以將 Paragraph.TextIndent 屬性設定為不同值,藉此覆寫 RichTextBlock 對特定段落的這項設定。
<RichTextBlock TextIndent="12">
<Paragraph TextIndent="24">First paragraph.</Paragraph>
<Paragraph>Second paragraph.</Paragraph>
<Paragraph>Third paragraph. <Bold>With an inline.</Bold></Paragraph>
</RichTextBlock>
內嵌 UI 元素
InlineUIContainer 類別可讓您在文字中內嵌任何 UIElement。 常見的案例是將影像內嵌在文字中,但也可以使用互動式元素,例如 Button 或 CheckBox。
如果您想要將多個元素內嵌在相同位置,建議將面板當作單一 InlineUIContainer 子項,然後將多個元素放在面板內。
此範例示範如何使用 InlineUIContainer 將影像插入 RichTextBlock。
<RichTextBlock>
<Paragraph>
<Italic>This is an inline image.</Italic>
<InlineUIContainer>
<Image Source="Assets/Square44x44Logo.png" Height="30" Width="30"/>
</InlineUIContainer>
Mauris auctor tincidunt auctor.
</Paragraph>
</RichTextBlock>
溢位容器
您可以使用 RichTextBlock 搭配 RichTextBlockOverflow 元素來建立多個欄或其他進階版面配置。 RichTextBlockOverflow 元素內容一律來自 RichTextBlock 元素。 您可以將 RichTextBlockOverflow 元素設定為 RichTextBlock 或其他 RichTextBlockOverflow 的 OverflowContentTarget,藉此連結 RichTextBlockOverflow 元素。
以下簡單範例示範建立兩個資料欄版面配置。 如需更複雜的範例,請參閱「範例」章節。
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<RichTextBlock Grid.Column="0"
OverflowContentTarget="{Binding ElementName=overflowContainer}" >
<Paragraph>
Proin ac metus at quam luctus ultricies.
</Paragraph>
</RichTextBlock>
<RichTextBlockOverflow x:Name="overflowContainer" Grid.Column="1"/>
</Grid>
文字格式化
雖然 RichTextBlock 會儲存純文字,但您可以套用各種格式設定選項,自訂如何在應用程式中呈現文字。 您可設定標準控制項屬性 (例如 FontFamily、FontSize、FontStyle、Background、Foreground、CharacterSpacing),藉此變更文字的外觀。 您也可以使用內嵌文字元素和印刷樣式附加屬性來設定文字格式。 這些選項僅會影響 RichTextBlock 在本機顯示文字的方式,因此舉例來說,若您將文字複製並貼至 RTF 控制項,系統不會套用任何格式設定。
內嵌元素
Microsoft.UI.Xaml.Documents 命名空間提供各種內嵌文字元素,可讓您用來格式化文字,例如 Bold、Italic、Run、Span 和 LineBreak。 將格式設定套用至文字區塊的常鍵方式,是將文字放在 Run 或 Span 元素,然後對該元素設定屬性。
以下段落中的第一個字詞顯示為粗體、藍色、16pt 的文字。
<Paragraph>
<Bold><Span Foreground="DarkSlateBlue" FontSize="16">Lorem ipsum dolor sit amet</Span></Bold>
, consectetur adipiscing elit.
</Paragraph>
印刷樣式
Typography 類別的附加屬性可讓您存取一組 Microsoft OpenType 印刷樣式屬性。 您可以對 RichTextBlock 或個別的內嵌文字元素設定這些附加屬性,如下所示。
<RichTextBlock Typography.StylisticSet4="True">
<Paragraph>
<Span Typography.Capitals="SmallCaps">Lorem ipsum dolor sit amet</Span>
, consectetur adipiscing elit.
</Paragraph>
</RichTextBlock>
取得範例程式碼
- WinUI 資源庫範例 - 以互動式格式查看所有 XAML 控制項。
相關文章
適用於設計人員
適用於開發人員 (XAML)
- TextBox 類別 \(英文\)
- PasswordBox 類別
適用於開發人員 (其他)
- String.Length 屬性 \(部分機器翻譯\)