El control Textbox - Format en línia

A l'últim article miràvem a la funcionalitat de nucli del control TextBlock: Mostrant una sèrie simple i embolicant-la si és necessari. Fins i tot vam utilitzar un altre color que el per defecte per representar el text, però el que si vas voler es més que just definir un color estàtic per tot el text dins el TextBlock?

Afortunadament, el control TextBlock admet contingut en línia. Aquestes petites construccions, similars a controls, deriven de la classe Inline, la qual cosa significa que poden ser generades en línia, com a part d'un text major. En el moment d'escriure aquest article, els elements suportats inclouen AnchoredBlock (bloc ancorat), Bold (negreta), Hyperlink (enllaç), InlineUIContainer (contenidor de controls), Italic (cursiva), LineBreak (salt de línia), Run (text amb format), Span (text i elements amb format) i Underline (subratllat). En els següents exemples veurem la major part d'ells.

Bold, Italic y Underline

Aquests són probablement els tipus més simples dels elements inline. Els noms t'haurien de dir molt sobre el que fer, però encara et donarem un exemple ràpid damunt com per utilitzar-los:

<Window x:Class="WpfTutorialSamples.Basic_controls.TextBlockInlineSample"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="TextBlockInlineSample" Height="100" Width="300">
    <Grid>
		<TextBlock Margin="10" TextWrapping="Wrap">
			TextBlock with <Bold>bold</Bold>, <Italic>italic</Italic> and <Underline>underlined</Underline> text.
		</TextBlock>
    </Grid>
</Window>

De manera similar a l'HTML, simplement tanqui el text desitjat amb una etiqueta Bold per a obtenir text en negreta, i així amb la resta d'etiquetes. Això fa que sigui molt senzill crear i mostrar diversos textos en les seves aplicacions.

Aquestes tres etiquetes són especialitzacions de l'element Span, cadascuna establint una propietat concreta de l'element Span per a obtenir l'efecte desitjat. Per exemple, l'etiqueta Bold simplement estableix la propietat FontWeight de l'element Span, l'etiqueta Italic estableix la propietat FontStyle i així successivament.

LineBreak

Introdueix un salt de línia forçat en un punt del text. Vegi el capítol anterior per a obtenir un exemple d'on usar l'element LineBreak.

Hyperlink

L'element Hyperlink li permet introduir enllaços en els seus textos, amb un aspecte visual d'acord amb el tema de Windows actiu, la qual cosa sol ser alguna tonalitat de color blau canviant a vermell quan el cursor es col·loca damunt i tenint aquest últim forma de mà. Pot usar la propietat NavigateUri per a definir la URL a la qual desitja navegar. Per exemple:

<Window x:Class="WpfTutorialSamples.Basic_controls.TextBlockHyperlinkSample"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="TextBlockHyperlinkSample" Height="100" Width="300">
	<Grid>
		<TextBlock Margin="10" TextWrapping="Wrap">
			This text has a <Hyperlink RequestNavigate="Hyperlink_RequestNavigate" NavigateUri="https://www.google.com">link</Hyperlink> in it.
		</TextBlock>
	</Grid>
</Window>

El Hyperlink també pot ser usat en pàgines WPF, on permet navegar entre diferents pàgines. En aquest cas, no serà necessari gestionar explícitament l'esdeveniment RequestNavigate, com fem en l'exemple, però per a poder obrir URLs externes des d'una aplicació d'escriptori WPF, és necessari implementar aquest esdeveniment i fer ús de la classe Process. Ens subscrivim a l'esdeveniment RequestNavigate, la qual cosa ens permet obrir la URL enllaçada en el navegador predefinit de l'usuari amb un simple manipulador d'esdeveniment com aquest en l'arxiu de codi:

private void Hyperlink_RequestNavigate(object sender, System.Windows.Navigation.RequestNavigateEventArgs e)
{
	System.Diagnostics.Process.Start(e.Uri.AbsoluteUri);
}

Run

L'element Run li permet donar format a una cadena de text utilitzant totes les propietats disponibles en l'element Span, però mentre que aquest pot contenir en el seu interior altres elements en línia, un element Run només pot contenir text. Això fa de l'element Span més flexible i, per tant, l'elecció més lògica en la major part dels casos.

Span

L'element Span no té un format específic predefinit, però li permet especificar gairebé qualsevol tipus de format, incloent la grandària, estil i gruix de la font, els colors de fons i del text, etc. El millor de l'element Span és que permet contenir altres elements en línia en el seu interior, facilitant la construcció de combinacions avançades de textos i estils. En el següent exemple, he utilitzat molts elements Span per a mostrar-li moltes de les possibilitats disponibles en usar elements Span en línia:

<Window x:Class="WpfTutorialSamples.Basic_controls.TextBlockSpanSample"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="TextBlockSpanSample" Height="100" Width="300">
    <Grid>
		<TextBlock Margin="10" TextWrapping="Wrap">
			This <Span FontWeight="Bold">is</Span> a
			<Span Background="Silver" Foreground="Maroon">TextBlock</Span>
			with <Span TextDecorations="Underline">several</Span>
			<Span FontStyle="Italic">Span</Span> elements,
			<Span Foreground="Blue">
				using a <Bold>variety</Bold> of <Italic>styles</Italic>
			</Span>.
		</TextBlock>
	</Grid>
</Window>

De manera que, com pot veure, si cap dels altres elements té sentit en les seves circumstàncies, o si només vol un llenç en blanc on començar a definir els seus estils, l'element Span és una molt bona elecció.

Formatar text des de C#/Code-Behind

Com pot veure, formatar text mitjançant XAML és molt fàcil, però hi ha casos en els quals podria preferir, o fins i tot necessitar, fer-ho des d'un arxiu de C#/Code-Behind. Allò és una mica més tediós, però a continuació s'il·lustra una manera possible per a fer-lo:

<Window x:Class="WpfTutorialSamples.Basic_controls.TextBlockCodeBehindSample"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="TextBlockCodeBehindSample" Height="100" Width="300">
    <Grid></Grid>
</Window>

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

namespace WpfTutorialSamples.Basic_controls
{
	public partial class TextBlockCodeBehindSample : Window
	{
		public TextBlockCodeBehindSample()
		{
			InitializeComponent();
			TextBlock tb = new TextBlock();
			tb.TextWrapping = TextWrapping.Wrap;
			tb.Margin = new Thickness(10);
			tb.Inlines.Add("An example on ");
			tb.Inlines.Add(new Run("the TextBlock control ") { FontWeight = FontWeights.Bold });
			tb.Inlines.Add("using ");
			tb.Inlines.Add(new Run("inline ") { FontStyle = FontStyles.Italic });
			tb.Inlines.Add(new Run("text formatting ") { Foreground = Brushes.Blue });
			tb.Inlines.Add("from ");
			tb.Inlines.Add(new Run("Code-Behind") { TextDecorations = TextDecorations.Underline });
			tb.Inlines.Add(".");
			this.Content = tb;
		}
	}
}

Està molt bé tenir la possibilitat, fins i tot pot ser necessari fer-ho així en alguns casos, però l'exemple anterior probablement li fa apreciar encara més el XAML.