RTF 區塊
RTF 區塊提供數個功能,適用於進階文字版面配置,當您需要段落、內嵌 UI 元素或複雜文字版面配置的支援時,可以使用這些功能。
這是正確的控制項嗎?
當您需要支援多個段落、多欄或其他複雜的文字版面配置,或影像等內嵌 UI 元素時,請使用 RichTextBlock。
使用 TextBlock 在您的應用程式中顯示大部分唯讀文字。 您可以使用它來顯示單行或多行文字、內嵌超連結,以及具有粗體、斜體或底線格式的文字。 TextBlock 提供較簡單的內容模型,如此一來,通常就能讓它更易於使用,而且它可以提供比 RichTextBlock 更好的文字轉譯效能。 大部分的應用程式 UI 文字都是慣用的。 儘管您可以在文字中放置分行符號,但 TextBlock 是針對顯示單一段落而設計,不支援文字縮排。
如需如何選擇正確文字控制項的詳細資訊,請參閱文字控制項文章。
建議
請參閱字型的印刷樣式和指導方針。
UWP 和 WinUI 2
重要
本文中的資訊和範例已針對使用 Windows 應用程式 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、Foreground 和 CharacterSpacing 來變更文字的外觀。 您也可以使用內嵌文字元素和印刷樣式附加屬性來格式化文字。 這些選項只會影響 RichTextBlock 在本機顯示文字的方式,因此,如果您複製文字並貼到 RTF 控制件中,例如,不會套用任何格式設定。
內嵌專案
Microsoft.UI.Xaml.Documents 命名空間提供各種不同的內嵌文字元素,可讓您用來格式化文字,例如 Bold、Italic、Run、Span 和 LineBreak。 將格式設定套用至文字區段的一般方式,是將文字放在 Run 或 Span 元素中,然後在該元素上設定屬性。
以下是以粗體、藍色、16pt 文字顯示之第一個片語的Paragraph。
<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 屬性 \(部分機器翻譯\)
意見反應
https://aka.ms/ContentUserFeedback。
即將登場:在 2024 年,我們將逐步淘汰 GitHub 問題作為內容的意見反應機制,並將它取代為新的意見反應系統。 如需詳細資訊,請參閱:提交並檢視相關的意見反應