Поделиться через

Общие сведения о RichTextBox

  • Статья

Обновлен: Ноябрь 2007

Элемент управления RichTextBox позволяет отображать или изменять содержимое потока, в том числе абзацы, изображения, таблицы и др. В этом разделе представляется класс TextBox и приводятся примеры его использования в Язык XAML (Extensible Application Markup Language) и C#.

В этом разделе содержатся следующие подразделы.

  • Textbox или RichTextBox?
  • Создание RichTextBox
  • Проверка орфографии в режиме реального времени.
  • Контекстное меню
  • Команды редактирования
  • Определение момента изменения содержимого
  • Сохранение, загрузка и печать содержимого RichTextBox
  • Связанные разделы

Textbox или RichTextBox?

И RichTextBox, и TextBox позволяют пользователям редактировать текст, однако эти два элемента управления используются в различных сценариях. RichTextBox является хорошим выбором при необходимости изменить форматированный текст, рисунки, таблицы или другие сложные элементы. Например, редактирование документа, статьи или блога, для которых требуются форматирование, рисунки и т.д., лучше всего выполнять с помощью RichTextBox. TextBox требует меньшего количества системных ресурсов, чем RichTextBox, и идеально подходит, когда требуется отредактировать только обычный текст (другими словами, использование в формах). Дополнительные сведения по Общие сведения о TextBox см. в разделе TextBox. В приводимой далее таблице перечислены основные возможности TextBox и RichTextBox.

Элемент управления

Проверка орфографии в режиме реального времени

Контекстное меню

Форматирование команд как ToggleBold (CTRL + B)

Содержимое FlowDocument, такое как изображения, абзацы, таблицы и т.д.

TextBox

Да

Да

Нет

Нет

RichTextBox

Да

Да

Да

Да

Примечание. Хотя TextBox не поддерживает команды, связанные с форматированием, такие как ToggleBold (CTRL+B), многие основные команды поддерживаются обоими элементами управления, например MoveToLineEnd.

Средства из приведенной выше таблицы будут рассмотрены дальше более подробно.

Создание RichTextBox

В следующем примере кода демонстрируется создание RichTextBox, в котором пользователь может редактировать сложное содержимое.

<Page xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml">

    <!-- A RichTextBox with no initial content in it. -->
    <RichTextBox />

</Page>

В частности, содержимое, редактируемое в RichTextBox, является потоком содержимого. Поток содержимого может содержать множество типов элементов, включая форматированный текст, изображения, списки и таблицы. Более подробная информация о документах потока содержится в разделе Общие сведения о документе нефиксированного формата. Чтобы иметь поток содержимого, RichTextBox помещает объект FlowDocument, который, в свою очередь, в которой находится изменяемое содержимое. Для демонстрации содержимого потока в RichTextBox, следующий фрагмент кода иллюстрирует создание RichTextBox с абзацем и полужирным текстом.

<Page xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml">

  <StackPanel>
    <RichTextBox>
      <FlowDocument>
        <Paragraph>
          This is flow content and you can <Bold>edit me!</Bold>
        </Paragraph>
      </FlowDocument>
    </RichTextBox>
  </StackPanel>

</Page>

using System;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Media;
using System.Windows.Documents;
namespace SDKSample
{
    public partial class BasicRichTextBoxWithContentExample : Page
    {
        public BasicRichTextBoxWithContentExample()
        {
            StackPanel myStackPanel = new StackPanel();

            // Create a FlowDocument to contain content for the RichTextBox.
            FlowDocument myFlowDoc = new FlowDocument();

            // Create a Run of plain text and some bold text.
            Run myRun = new Run("This is flow content and you can ");
            Bold myBold = new Bold(new Run("edit me!"));

            // Create a paragraph and add the Run and Bold to it.
            Paragraph myParagraph = new Paragraph();
            myParagraph.Inlines.Add(myRun);
            myParagraph.Inlines.Add(myBold);

            // Add the paragraph to the FlowDocument.
            myFlowDoc.Blocks.Add(myParagraph);

            RichTextBox myRichTextBox = new RichTextBox();

            // Add initial content to the RichTextBox.
            myRichTextBox.Document = myFlowDoc;

            myStackPanel.Children.Add(myRichTextBox);
            this.Content = myStackPanel;

        }
    }
}

На следующем рисунке показано, как будет выглядеть этот пример.

RichTextBox с содержимым

Элементы, такие как Paragraph и Bold, определяют, как появляется содержимое внутри RichTextBox. Когда пользователи изменяют содержимое RichTextBox, они изменяют содержимое потока. Дополнительные возможности потока содержимого и способы работы с ним описываются в разделе Общие сведения о документе нефиксированного формата.

Примечание Содержимое потока внутри RichTextBox ведет себя не так, как содержимое потока, имеющееся в других элементах управления. Например, в RichTextBox нет столбцов и, следовательно, нет автоматического изменения размеров. Кроме того, такие встроенные средства как поиск, режим просмотра, навигация по странице и масштабирование недоступны в RichTextBox.

Проверка орфографии в режиме реального времени.

В TextBox и RichTextBox можно запустить проверку орфографии в режиме реального времени. При включенной проверке орфографии все неправильно написанные слова подчеркиваются красной линией (см. рисунок).

Textbox с проверкой правописания

Сведения о том, как включить проверку орфографии, см. в разделе Практическое руководство. Включение проверки орфографии в элементе управления редактирования текста.

Контекстное меню

По умолчанию и TextBox, и RichTextBox имеют контекстное меню, которое появляется при щелчке правой кнопкой мыши внутри элемента управления. Контекстное меню предоставляет пользователю функции вырезания, копирования или вставки (см. рисунок ниже).

TextBox с контекстным меню

Можно создать собственное пользовательское контекстное меню, переопределив тем самым контекстное меню по умолчанию. Дополнительные сведения см. в разделе Практическое руководство. Использование пользовательского контекстного меню в RichTextBox.

Команды редактирования

Команды редактирования позволяют пользователям форматировать редактируемое содержимое в RichTextBox. Помимо основных команд редактирования, RichTextBox включает команды форматирования, которые TextBox не поддерживает. Например, при редактировании в RichTextBox, пользователь может переключать форматирование текста полужирным шрифтом, нажав комбинацию клавиш CTRL+B. Полный список доступных команд можно посмотреть в разделе EditingCommands. В дополнение к использованию сочетания клавиш, можно подключать команды к другим элементам управления, таким как кнопки. В следующем примере показано, как создать простую панель инструментов, содержащую кнопки, с помощью которых пользователь может изменять форматирование текста.

<Window x:Class="RichTextBoxInputPanelDemo.Window1"
    xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml" Height="400" Width="600"
    >
  <Grid>

    <!-- Set the styles for the tool bar. -->
    <Grid.Resources>
      <Style TargetType="{x:Type Button}" x:Key="formatTextStyle">
        <Setter Property="FontFamily" Value="Palatino Linotype"></Setter>
        <Setter Property="Width" Value="30"></Setter>
        <Setter Property="FontSize" Value ="14"></Setter>
        <Setter Property="CommandTarget" Value="{Binding ElementName=mainRTB}"></Setter>
      </Style>

      <Style TargetType="{x:Type Button}" x:Key="formatImageStyle">
        <Setter Property="Width" Value="30"></Setter>
        <Setter Property="CommandTarget" Value="{Binding ElementName=mainRTB}"></Setter>
      </Style>
    </Grid.Resources>

    <DockPanel Name="mainPanel">

      <!-- This tool bar contains all the editing buttons. -->
      <ToolBar Name="mainToolBar" Height="30" DockPanel.Dock="Top">

        <Button Style="{StaticResource formatImageStyle}" Command="ApplicationCommands.Cut" ToolTip="Cut">
          <Image Source="Images\EditCut.png"></Image>
        </Button>
        <Button Style="{StaticResource formatImageStyle}" Command="ApplicationCommands.Copy" ToolTip="Copy">
          <Image Source="Images\EditCopy.png"></Image>
        </Button>
        <Button Style="{StaticResource formatImageStyle}" Command="ApplicationCommands.Paste" ToolTip="Paste">
          <Image Source="Images\EditPaste.png"></Image>
        </Button>
        <Button Style="{StaticResource formatImageStyle}" Command="ApplicationCommands.Undo" ToolTip="Undo">
          <Image Source="Images\EditUndo.png"></Image>
        </Button>
        <Button Style="{StaticResource formatImageStyle}" Command="ApplicationCommands.Redo" ToolTip="Redo">
          <Image Source="Images\EditRedo.png"></Image>
        </Button>

        <Button Style="{StaticResource formatTextStyle}" Command="EditingCommands.ToggleBold" ToolTip="Bold">
          <TextBlock FontWeight="Bold">B</TextBlock>
        </Button>
        <Button Style="{StaticResource formatTextStyle}" Command="EditingCommands.ToggleItalic" ToolTip="Italic">
          <TextBlock FontStyle="Italic" FontWeight="Bold">I</TextBlock>
        </Button>
        <Button Style="{StaticResource formatTextStyle}" Command="EditingCommands.ToggleUnderline" ToolTip="Underline">
          <TextBlock TextDecorations="Underline" FontWeight="Bold">U</TextBlock>
        </Button>
        <Button Style="{StaticResource formatImageStyle}" Command="EditingCommands.IncreaseFontSize" ToolTip="Grow Font">
          <Image Source="Images\CharacterGrowFont.png"></Image>
        </Button>
        <Button Style="{StaticResource formatImageStyle}" Command="EditingCommands.DecreaseFontSize" ToolTip="Shrink Font">
          <Image Source="Images\CharacterShrinkFont.png"></Image>
        </Button>

        <Button Style="{StaticResource formatImageStyle}" Command="EditingCommands.ToggleBullets" ToolTip="Bullets">
          <Image Source="Images\ListBullets.png"></Image>
        </Button>
        <Button Style="{StaticResource formatImageStyle}" Command="EditingCommands.ToggleNumbering" ToolTip="Numbering">
          <Image Source="Images/ListNumbering.png"></Image>
        </Button>
        <Button Style="{StaticResource formatImageStyle}" Command="EditingCommands.AlignLeft" ToolTip="Align Left">
          <Image Source="Images\ParagraphLeftJustify.png"></Image>
        </Button>
        <Button Style="{StaticResource formatImageStyle}" Command="EditingCommands.AlignCenter" ToolTip="Align Center">
          <Image Source="Images\ParagraphCenterJustify.png"></Image>
        </Button>
        <Button Style="{StaticResource formatImageStyle}" Command="EditingCommands.AlignRight" ToolTip="Align Right">
          <Image Source="Images\ParagraphRightJustify.png"></Image>
        </Button>
        <Button Style="{StaticResource formatImageStyle}" Command="EditingCommands.AlignJustify" ToolTip="Align Justify">
          <Image Source="Images\ParagraphFullJustify.png"></Image>
        </Button>
        <Button Style="{StaticResource formatImageStyle}" Command="EditingCommands.IncreaseIndentation" ToolTip="Increase Indent">
          <Image Source="Images\ParagraphIncreaseIndentation.png"></Image>
        </Button>
        <Button Style="{StaticResource formatImageStyle}" Command="EditingCommands.DecreaseIndentation" ToolTip="Decrease Indent">
          <Image Source="Images\ParagraphDecreaseIndentation.png"></Image>
        </Button>

      </ToolBar>

      <!-- By default pressing tab moves focus to the next control. Setting AcceptsTab to true allows the 
           RichTextBox to accept tab characters. -->
      <RichTextBox Name="mainRTB" AcceptsTab="True"></RichTextBox>
    </DockPanel>
  </Grid>
</Window>

На следующем рисунке показано, как будет выглядеть этот пример.

RichTextBox с панелью инструментов

Полный пример содержится в разделе Пример Create a RichTextBox with a Toolbar. Кроме того, в Пример использования EditingCommands демонстрируются команды редактирования, используемые с RichTextBox.

Определение момента изменения содержимого

Обычно для обнаружения изменения текста в TextBox или RichTextBox следует использовать событие TextChanged, а не KeyDown, как можно было бы предположить. Пример см. в разделе Практическое руководство. Определение изменения текста в TextBox.

Сохранение, загрузка и печать содержимого RichTextBox

В следующем примере демонстрируется сохранение содержимого RichTextBox в файл, загрузка этого содержимого обратно в RichTextBox и печать содержимого. Ниже в примере приведен код разметки.

<Page xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml"
  x:Class="SDKSample.SaveLoadPrintRTB" >

  <StackPanel>
    <RichTextBox Name="richTB">
      <FlowDocument>
        <Paragraph>
          <Run>Paragraph 1</Run>
        </Paragraph>
      </FlowDocument>
    </RichTextBox>

    <Button Click="SaveRTBContent">Save RTB Content</Button>
    <Button Click="LoadRTBContent">Load RTB Content</Button>
    <Button Click="PrintRTBContent">Print RTB Content</Button>
  </StackPanel>

</Page>

Ниже приведен полный код.

using System;
using System.IO;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Media;

namespace SDKSample
{

    public partial class SaveLoadPrintRTB : Page
    {

        // Handle "Save RichTextBox Content" button click.
        void SaveRTBContent(Object sender, RoutedEventArgs args)
        {

            // Send an arbitrary URL and file name string specifying
            // the location to save the XAML in.
            SaveXamlPackage("C:\\test.xaml");
        }

        // Handle "Load RichTextBox Content" button click.
        void LoadRTBContent(Object sender, RoutedEventArgs args)
        {
            // Send URL string specifying what file to retrieve XAML
            // from to load into the RichTextBox.
            LoadXamlPackage("C:\\test.xaml");
        }

        // Handle "Print RichTextBox Content" button click.
        void PrintRTBContent(Object sender, RoutedEventArgs args)
        {
            PrintCommand();
        }

        // Save XAML in RichTextBox to a file specified by _fileName
        void SaveXamlPackage(string _fileName)
        {
            TextRange range;
            FileStream fStream;
            range = new TextRange(richTB.Document.ContentStart, richTB.Document.ContentEnd);
            fStream = new FileStream(_fileName, FileMode.Create);
            range.Save(fStream, DataFormats.XamlPackage);
            fStream.Close();
        }

        // Load XAML into RichTextBox from a file specified by _fileName
        void LoadXamlPackage(string _fileName)
        {
            TextRange range;
            FileStream fStream;
            if (File.Exists(_fileName))
            {
                range = new TextRange(richTB.Document.ContentStart, richTB.Document.ContentEnd);
                fStream = new FileStream(_fileName, FileMode.OpenOrCreate);
                range.Load(fStream, DataFormats.XamlPackage);
                fStream.Close();
            }
        }

        // Print RichTextBox content
        private void PrintCommand()
        {
            PrintDialog pd = new PrintDialog();
            if ((pd.ShowDialog() == true))
            {
                //use either one of the below      
                pd.PrintVisual(richTB as Visual, "printing as visual");
                pd.PrintDocument((((IDocumentPaginatorSource)richTB.Document).DocumentPaginator), "printing as paginator");
            }
        }
    }
}

См. также

Задачи

Пример использования EditingCommands

Пример Editing Examiner

Пример Notepad

Пример Create a RichTextBox with a Toolbar

Основные понятия

Общие сведения о TextBox

Другие ресурсы

Разделы руководства по RichTextBox