Información general sobre el control RichTextBoxRichTextBox Overview

El RichTextBox control le permite mostrar o modificar el contenido del flujo como párrafos, imágenes, tablas etc.The RichTextBox control enables you to display or edit flow content including paragraphs, images, tables, and more. Este tema se presentan los TextBox clase y proporciona ejemplos de cómo usar tanto en Lenguaje XAML (Extensible Application Markup Language)Extensible Application Markup Language (XAML) y C#.This topic introduces the TextBox class and provides examples of how to use it in both Lenguaje XAML (Extensible Application Markup Language)Extensible Application Markup Language (XAML) and C#.

¿TextBox o RichTextBox?TextBox or RichTextBox?

Ambos RichTextBox y TextBox permite a los usuarios editar texto, sin embargo, los dos controles se utilizan en escenarios diferentes.Both RichTextBox and TextBox allow users to edit text, however, the two controls are used in different scenarios. A RichTextBox es una opción mejor cuando es necesario para el usuario editar texto con formato, imágenes, tablas u otro contenido enriquecido.A RichTextBox is a better choice when it is necessary for the user to edit formatted text, images, tables, or other rich content. Por ejemplo, editar un documento, artículo o blog que requieran formato, imágenes, etcetera se logra mejor usando un RichTextBox.For example, editing a document, article, or blog that requires formatting, images, etc is best accomplished using a RichTextBox. A TextBox requiere menos recursos del sistema, a continuación, un RichTextBox y resulta ideal cuando solo texto sin formato hay que volver a editar (es decir, el uso de formularios).A TextBox requires less system resources then a RichTextBox and it is ideal when only plain text needs to be edited (i.e. usage in forms). Vea información general del cuadro de texto para obtener más información sobre TextBox.See TextBox Overview for more information on TextBox. En la tabla siguiente se resume las principales características de TextBox y RichTextBox.The table below summarizes the main features of TextBox and RichTextBox.

ControlControl Revisión ortográfica en tiempo realReal-time Spellchecking Menú contextualContext Menu Formato de comandos, como ToggleBold (Ctr + B)Formatting commands like ToggleBold (Ctr+B) FlowDocument contenido, como imágenes, párrafos, tablas, etcetera.FlowDocument content like images, paragraphs, tables, etc.
TextBox Yes Yes NoNo No.No.
RichTextBox Yes Yes Yes Yes

Nota: aunque TextBox no admite el formato de los comandos relacionados como ToggleBold (Ctr + B), muchos comandos básicos son compatibles con ambos controles como MoveToLineEnd.Note: Although TextBox does not support formatting related commands like ToggleBold (Ctr+B), many basic commands are supported by both controls such as MoveToLineEnd.

Las características de la tabla anterior se detallan más adelante.The features from the table above are covered in more detail later.

Creación de RichTextBoxCreating a RichTextBox

El código siguiente muestra cómo crear un RichTextBox que un usuario puede modificar su contenido enriquecido.The code below shows how to create a RichTextBox that a user can edit rich content in.

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

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

</Page>

En concreto, editar el contenido en un RichTextBox es el contenido del flujo.Specifically, the content edited in a RichTextBox is flow content. El contenido dinámico puede incluir muchos tipos de elementos, como texto con formato, imágenes, listas y tablas.Flow content can contain many types of elements including formatted text, images, lists, and tables. Consulte Información general sobre documentos dinámicos para ver información detallada sobre los documentos dinámicos.See Flow Document Overview for in depth information on flow documents. Para incluir contenido dinámico, un RichTextBox hosts un FlowDocument objeto que a su vez contiene el contenido editable.In order to contain flow content, a RichTextBox hosts a FlowDocument object which in turn contains the editable content. Para mostrar el contenido del flujo en un RichTextBox, el código siguiente muestra cómo crear un RichTextBox con un párrafo y texto en negrita.To demonstrate flow content in a RichTextBox, the following code shows how to create a RichTextBox with a paragraph and some bolded text.

<Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://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;
            
        }
    }
}

Imports System
Imports System.Windows
Imports System.Windows.Controls
Imports System.Windows.Media
Imports System.Windows.Documents
Namespace SDKSample
    Partial Public Class BasicRichTextBoxWithContentExample
        Inherits Page
        Public Sub New()
            Dim myStackPanel As New StackPanel()

            ' Create a FlowDocument to contain content for the RichTextBox.
            Dim myFlowDoc As New FlowDocument()

            ' Create a Run of plain text and some bold text.
            Dim myRun As New Run("This is flow content and you can ")
            Dim myBold As New Bold(New Run("edit me!"))

            ' Create a paragraph and add the Run and Bold to it.
            Dim myParagraph As New Paragraph()
            myParagraph.Inlines.Add(myRun)
            myParagraph.Inlines.Add(myBold)

            ' Add the paragraph to the FlowDocument.
            myFlowDoc.Blocks.Add(myParagraph)

            Dim myRichTextBox As New RichTextBox()

            ' Add initial content to the RichTextBox.
            myRichTextBox.Document = myFlowDoc

            myStackPanel.Children.Add(myRichTextBox)
            Me.Content = myStackPanel

        End Sub
    End Class
End Namespace

En la siguiente ilustración se muestra cómo se representa este ejemplo.The following illustration shows how this sample renders.

RichTextBox con contenidoRichTextBox with content

Elementos como Paragraph y Bold determinar cómo el contenido dentro de un RichTextBox aparece.Elements like Paragraph and Bold determine how the content inside a RichTextBox appears. Cuando un usuario edita RichTextBox contenido, cambian el contenido del flujo.As a user edits RichTextBox content, they change this flow content. Para más información sobre las características del contenido dinámico y cómo trabajar con él, consulte Información general sobre documentos dinámicos.To learn more about the features of flow content and how to work with it, see Flow Document Overview.

Nota: de flujo de contenido dentro de un RichTextBox no se comportan exactamente igual que el contenido del flujo contenido en otros controles.Note: Flow content inside a RichTextBox does not behave exactly like flow content contained in other controls. Por ejemplo, no hay ninguna columna en un RichTextBox y, por tanto, no automático cambiar el tamaño de comportamiento.For example, there are no columns in a RichTextBox and hence no automatic resizing behavior. Además, se integra en características como búsqueda, el modo de visualización, navegación de páginas y zoom no están disponibles dentro de un RichTextBox.Also, built in features like search, viewing mode, page navigation, and zoom are not available within a RichTextBox.

Revisión ortográfica en tiempo realReal-time Spell Checking

Puede habilitar la revisión ortográfica en tiempo real un TextBox o RichTextBox.You can enable real-time spell checking in a TextBox or RichTextBox. Cuando se activa la revisión ortográfica, aparece una línea roja debajo de las palabras con errores de ortografía (consulte la siguiente imagen).When spellchecking is turned on, a red line appears underneath any misspelled words (see picture below).

Textbox con revisión ortográficaTextbox with spell-checking

Consulte Cómo habilitar el corrector ortográfico en un control de edición de texto para más información sobre cómo activar la revisión ortográfica.See Enable Spell Checking in a Text Editing Control to learn how to enable spellchecking.

Menú contextualContext Menu

De forma predeterminada, ambos TextBox y RichTextBox tiene un menú contextual que aparece cuando un usuario hace clic con un botón dentro del control.By default, both TextBox and RichTextBox have a context menu that appears when a user right-clicks inside the control. El menú contextual permite al usuario cortar, copiar o pegar (consulte la siguiente ilustración).The context menu allows the user to cut, copy, or paste (see illustration below).

TextBox con menú contextualTextBox with context menu

Puede crear su propio menú contextual personalizado para invalidar el predeterminado.You can create your own custom context menu to override the default one. Consulte Colocar un menú contextual personalizado en un control RichTextBox para más información.See Position a Custom Context Menu in a RichTextBox for more information.

Comandos de ediciónEditing Commands

Editar comandos permiten a los usuarios para dar formato editable contenido dentro de un RichTextBox.Editing commands enable users to format editable content inside a RichTextBox. Además de basic Editar comandos, RichTextBox incluye comandos de formato que TextBox no admite.Besides basic editing commands, RichTextBox includes formatting commands that TextBox does not support. Por ejemplo, cuando se edita en un RichTextBox, un usuario podría presionar CTR+n para alternar el formato de texto en negrita.For example, when editing in a RichTextBox, a user could press Ctr+B to toggle bold text formatting. Consulte EditingCommands para obtener una lista completa de comandos disponibles.See EditingCommands for a complete list of commands available. Además de usar métodos abreviados de teclado, puede enlazar los comandos a otros controles como botones.In addition to using keyboard shortcuts, you can hook commands up to other controls like buttons. En el siguiente ejemplo, se muestra cómo crear una herramienta de la barra sencilla que contiene botones que el usuario puede usar para cambiar el formato de texto.The following example shows how to create a simple tool bar containing buttons that the user can use to change text formatting.

<Window x:Class="RichTextBoxInputPanelDemo.Window1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://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>

En la siguiente ilustración, se muestra cómo se representa este ejemplo.The following illustration shows how this sample displays.

RichTextBox con barra de herramientasRichTextBox with ToolBar

Detección de cambios de contenidoDetect when Content Changes

Normalmente el TextChanged evento debe usarse para detectar cada vez que el texto de un TextBox o RichTextBox cambia en su lugar, a continuación, KeyDown como cabría esperar.Usually the TextChanged event should be used to detect whenever the text in a TextBox or RichTextBox changes rather then KeyDown as you might expect. Consulte Detectar cuándo cambiad el texto en un control TextBox para ver un ejemplo.See Detect When Text in a TextBox Has Changed for an example.

Guardar, cargar e imprimir contenido de un control RichTextBoxSave, Load, and Print RichTextBox Content

En el ejemplo siguiente se muestra cómo guardar el contenido de un RichTextBox en un archivo, cargar ese contenido de nuevo en el RichTextBoxe imprimir el contenido.The following example shows how to save content of a RichTextBox to a file, load that content back into the RichTextBox, and print the contents. A continuación, se muestra el marcado para el ejemplo.Below is the markup for the example.

<Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://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>

A continuación, se muestra el código subyacente para el ejemplo.Below is the code behind for the example.

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");
            }
        }
    }
}

Imports System
Imports System.IO
Imports System.Windows
Imports System.Windows.Controls
Imports System.Windows.Documents
Imports System.Windows.Media

Namespace SDKSample

    Partial Public Class SaveLoadPrintRTB
        Inherits Page

        ' Handle "Save RichTextBox Content" button click.
        Private Sub SaveRTBContent(ByVal sender As Object, ByVal args As RoutedEventArgs)

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

        ' Handle "Load RichTextBox Content" button click.
        Private Sub LoadRTBContent(ByVal sender As Object, ByVal args As RoutedEventArgs)
            ' Send URL string specifying what file to retrieve XAML
            ' from to load into the RichTextBox.
            LoadXamlPackage("C:\test.xaml")
        End Sub

        ' Handle "Print RichTextBox Content" button click.
        Private Sub PrintRTBContent(ByVal sender As Object, ByVal args As RoutedEventArgs)
            PrintCommand()
        End Sub

        ' Save XAML in RichTextBox to a file specified by _fileName
        Private Sub SaveXamlPackage(ByVal _fileName As String)
            Dim range As TextRange
            Dim fStream As FileStream
            range = New TextRange(richTB.Document.ContentStart, richTB.Document.ContentEnd)
            fStream = New FileStream(_fileName, FileMode.Create)
            range.Save(fStream, DataFormats.XamlPackage)
            fStream.Close()
        End Sub

        ' Load XAML into RichTextBox from a file specified by _fileName
        Private Sub LoadXamlPackage(ByVal _fileName As String)
            Dim range As TextRange
            Dim fStream As FileStream
            If File.Exists(_fileName) Then
                range = New TextRange(richTB.Document.ContentStart, richTB.Document.ContentEnd)
                fStream = New FileStream(_fileName, FileMode.OpenOrCreate)
                range.Load(fStream, DataFormats.XamlPackage)
                fStream.Close()
            End If
        End Sub

        ' Print RichTextBox content
        Private Sub PrintCommand()
            Dim pd As New PrintDialog()
            If (pd.ShowDialog() = True) Then
                'use either one of the below      
                pd.PrintVisual(TryCast(richTB, Visual), "printing as visual")
                pd.PrintDocument(((CType(richTB.Document, IDocumentPaginatorSource)).DocumentPaginator), "printing as paginator")
            End If
        End Sub
    End Class
End Namespace

Vea tambiénSee Also

Temas "Cómo..."How-to Topics
Información general sobre TextBoxTextBox Overview