Cenni generali sul controllo RichTextBox

  • Articolo

Il controllo RichTextBox consente di visualizzare o modificare il contenuto del flusso, compresi i paragrafi, le immagini, le tabelle e così via. In questo argomento viene presentata la classe TextBox e vengono forniti esempi del relativo utilizzo sia in Extensible Application Markup Language (XAML) che in C#.

Nel presente argomento sono contenute le seguenti sezioni.

  • TextBox o RichTextBox?
  • Creazione di un controllo RichTextBox
  • Controllo ortografico in tempo reale
  • Menu di scelta rapida
  • Comandi di modifica
  • Rilevare le modifiche del contenuto
  • Salvare, caricare e stampare il contenuto di un controllo RichTextBox
  • Argomenti correlati

TextBox o RichTextBox?

RichTextBox e TextBox consentono agli utenti di modificare il testo; tuttavia, i due controlli vengono utilizzati in scenari differenti. RichTextBox rappresenta la scelta migliore quando l'utente deve modificare testo formattato, immagini, tabelle o altro contenuto complesso. Ad esempio, per eseguire la modifica di un documento, di un articolo o di un blog che richiede una formattazione, delle immagini e così via è più opportuno utilizzare un controllo RichTextBox. Un controllo TextBox richiede una quantità inferiore di risorse di sistema rispetto a RichTextBox ed è la scelta ideale quando è necessario modificare solo del testo normale (ad esempio nei form). Per ulteriori informazioni su TextBox, vedere Cenni preliminari sulla classe TextBox. Nella tabella seguente sono riepilogate le funzionalità principali di TextBox e di RichTextBox.

Controllo

Controllo ortografico in tempo reale

Menu di scelta rapida

Comandi di formattazione quale ToggleBold (Ctr+B)

Contenuto FlowDocument, ad esempio immagini, paragrafi, tabelle e così via

TextBox

Sì

Sì

No

No.

RichTextBox

Sì

Sì

Sì

Sì

Nota: anche se TextBox non supporta la formattazione di comandi correlati quale ToggleBold (Ctr+B), molti comandi di base sono supportati da entrambi controlli, ad esempio MoveToLineEnd.

Le funzionalità riportate nella tabella precedente saranno illustrate in modo più dettagliato in seguito.

Creazione di un controllo RichTextBox

Nel codice riportato di seguito viene illustrata la procedura di creazione di un controllo RichTextBox che può essere utilizzato da un utente per la modifica di contenuto complesso.

<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>

In particolare, il contenuto modificato in un controllo RichTextBox è un contenuto di flusso. Tale contenuto può includere molti tipi di elementi, compresi testo formattato, immagini, elenchi e tabelle. Per informazioni più approfondite sui documenti dinamici, vedere Cenni preliminari sui documenti dinamici. Per includere il contenuto di flusso, un controllo RichTextBox ospita un oggetto FlowDocument che contiene a sua volta il contenuto modificabile. Per offrire una dimostrazione del contenuto di flusso in un oggetto RichTextBox, nel codice seguente viene illustrata la creazione di un oggetto RichTextBox con un paragrafo e del testo in grassetto.

<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>


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

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;

        }
    }
}

Nell'immagine seguente viene mostrato il rendering di questo esempio.

RichTextBox con contenuto

Elementi quali Paragraph e Bold determinano il modo in cui viene visualizzato il contenuto in un oggetto RichTextBox. Quando un utente modifica il contenuto di RichTextBox, viene cambiato questo contenuto di flusso. Per ulteriori informazioni sulle funzionalità del contenuto di flusso e sul relativo utilizzo, vedere Cenni preliminari sui documenti dinamici.

Nota: il comportamento del contenuto di flusso all'interno di RichTextBox è leggermente diverso rispetto al comportamento del contenuto di flusso incluso in altri controlli. Ad esempio, in un oggetto RichTextBox non sono presenti colonne, pertanto non è previsto un comportamento di ridimensionamento automatico. Inoltre, funzionalità incorporate quali la ricerca, la modalità di visualizzazione, lo spostamento sulle pagine e lo zoom non sono disponibili in un oggetto RichTextBox.

Controllo ortografico in tempo reale

È possibile abilitare il controllo ortografico in tempo reale in un oggetto TextBox o RichTextBox. Quando il controllo ortografico è attivo, viene visualizzata una linea rossa sotto le parole che presentano errori ortografici (vedere l'immagine riportata di seguito).

TextBox con controllo ortografico

Per apprendere la modalità di abilitazione del controllo ortografico, vedere Procedura: attivare il controllo ortografico in un controllo di modifica del testo.

Per impostazione predefinita, gli oggetti TextBox e RichTextBox dispongono di un menu di scelta rapida che viene visualizzato quando un utente fa clic con il pulsante destro del mouse nel controllo. Il menu di scelta rapida consente all'utente di eseguire operazioni di Taglia, Copia o Incolla (vedere l'immagine di seguito).

TextBox con menu di scelta rapida

È possibile creare un menu di scelta rapida personalizzato ed eseguire l'override di quello predefinito. Per ulteriori informazioni, vedere Procedura: posizionare un menu di scelta rapida personalizzato in un controllo RichTextBox.

Comandi di modifica

I comandi di modifica consentono agli utenti di formattare il contenuto modificabile all'interno di un controllo RichTextBox. Oltre ai comandi di modifica di base, RichTextBox include comandi di formattazione, non supportati da TextBox. Ad esempio, se si eseguono modifiche in RichTextBox, è possibile premere Ctr+B per attivare e disattivare la formattazione del testo in grassetto. Per un elenco completo dei comandi disponibili, vedere EditingCommands. Oltre a utilizzare i tasti di scelta rapida, è possibile associare i comandi ad altri controlli, quali i pulsanti. Nell'esempio seguente viene illustrata la procedura per la creazione di una barra degli strumenti semplice, che l'utente potrà utilizzare per modificare la formattazione del testo.

<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>

Nell'immagine seguente viene mostrata la visualizzazione di questo esempio.

RichTextBox con ToolBar

Rilevare le modifiche del contenuto

Generalmente, per rilevare tutte le modifiche apportate al testo di un oggetto TextBox o di un oggetto RichTextBox dovrebbe essere utilizzato l'evento TextChanged anziché KeyDown come si potrebbe pensare. Per un esempio, vedere Procedura: rilevare eventuali modifiche del testo in un oggetto TextBox.

Salvare, caricare e stampare il contenuto di un controllo RichTextBox

Nell'esempio riportato di seguito viene illustrata la procedura per salvare il contenuto di un oggetto RichTextBox in un file, caricare nuovamente il contenuto nell'oggetto RichTextBox e stamparlo. Di seguito viene riportato il markup dell'esempio.

<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>

Di seguito viene riportato il code-behind dell'esempio.


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

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

Vedere anche

Concetti

Cenni preliminari sulla classe TextBox

Altre risorse

Procedure relative al controllo RichTextBox