Ordre de tabulació

Si has treballat amb un ordinador el temps suficient com per a voler aprendre a programar, probablement saps que pots usar la tecla Tabulador del teclat per a navegar per una finestra o quadre de diàleg. Això permet que puguis mantenir les teves mans sobre el teclat quan emplenes un formulari o una cosa similar, en lloc d'haver d'estar usant el ratolí per a seleccionar el següent camp o control per a poder emplenar-lo.

WPF admet aquest comportament directament, o fins i tot millor: establirà automàticament l'ordre utilitzat en passar d'un camp a un altre, per la qual cosa en general, no has de preocupar-te per això. Tanmateix, a vegades el disseny de la teva finestra fa que WPF usi un ordre de pestanyes amb el qual podries no estar d'acord per alguna raó. Per això, pots decidir que uns certs controls no formin part de l'ordre de tabulació. Deixa'm il·lustrar això amb un exemple:

Aquest diàleg consisteix en una taula dividida en el mitjà, amb StackPanel's en cada costat, que conté labels i textboxes. El comportament predeterminat de l'ordre de tabulació és començar amb el primer control de la finestra i després passar per cadascun dels "controls fills" que es troben dins del, abans de passar al següent control. Atès que el quadre de diàleg consta de StackPanels orientats verticalment començaríem en el camp First Name, després ens mouríem a Street name, i finalment a City; Si continuem fent tabulació, passaríem al segon StackPanel, que conté Last name i Zip code. Quan surti del segon StackPanel, finalment arribarà als dos botons.

No obstant això, aquest no és el comportament que vull per a aquest diàleg. En lloc d'això, vull tabular des de First name a Last name (pel que bàsicament, em mouria horitzontalment en lloc de verticalment), i damunt d'això, no vull ingressar el camp City quan estigui fullejant el formulari, ja que s'emplenarà automàticament en funció del camp Zip code en aquest diàleg imaginari i, per tant, s'ha fet de només lectura. Per a aconseguir tot això, usaré dues propietats: TabIndex i IsTabStop. TabIndex és usat per a definir l'ordre, mentre que la propietat IsTabStop obligarà a WPF a ometre un control en passar a través de la finestra. Aquí està el codi usat per a aquest diàleg:

<Window x:Class="WpfTutorialSamples.Control_concepts.TabOrderSample"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:local="clr-namespace:WpfTutorialSamples.Control_concepts"
    mc:Ignorable="d"
    Title="TabOrderSample" Height="250" Width="400">
    <Grid Margin="20">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="20" />
        <ColumnDefinition Width="*" />
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height="*" />
        <RowDefinition Height="Auto" />
    </Grid.RowDefinitions>
    <StackPanel>
        <Label>First name:</Label>
        <TextBox TabIndex="0" />
        <Label>Street name:</Label>
        <TextBox TabIndex="2" />
        <Label>City:</Label>
        <TextBox TabIndex="5" IsReadOnly="True" IsTabStop="False" Background="Gainsboro" />
    </StackPanel>
    <StackPanel Grid.Column="2">
        <Label>Last name:</Label>
        <TextBox TabIndex="1" />
        <Label>Zip Code:</Label>
        <TextBox TabIndex="4" />
    </StackPanel>
    <Button Grid.Row="1" HorizontalAlignment="Right" Width="80">Add</Button>
    <Button Grid.Row="1" Grid.Column="2" HorizontalAlignment="Left" Width="80">Cancel</Button>
    </Grid>
</Window>

Observa com simplement li dono a cada control un numero en la propietat TabIndex, i després ús IsTabStop per al TextBox usat per al camp "City". Controlar l'ordre de tabulació dels camps en una finestra de diàleg és així de simple!

Resum

Controlar l'ordre dels camps en una finestra de diàleg és molt important, però afortunadament per a nosaltres, WPF fa una gran feina de manera automàtica definint l'ordre dels camps. No obstant això, en alguns casos, tindrà sentit prendre el control i fer ús de les propietats TabIndex i IsTabStop, tal com vam mostrar en l'exemple anterior.