Tworzenie aplikacji RIA w Silverlight 5 - Praca z tekstem

Autor: Tomasz Kowalczyk

Opublikowano: 2012-09-04

Artykuł ten stanowi część materiału, prezentującego możliwości Silverlight 5. Poniżej omówione zostaną nowe funkcje, dostępne dla programistów, które można wykorzystać podczas pracy z tekstem, jego obsługą i formatowaniem.

Po przeczytaniu tego artykułu:

• poznasz nowe funkcje, pozwalające ustawić odległość między znakami (Charackter Spacing),
• dowiesz się, jak umieścić tekst w kolumnach (Linked and Multi-Column Text),
• będziesz wiedział, jak wykorzystać czcionki OpenType wraz z funkcjami typograficznymi,
• wzbogacisz tekst, umieszczony w aplikacji, o ligatury.

Implementacja

Projekt, dołączony do tego artykułu, jest aplikacją typu Silverlight Navigation Application. Można dzięki temu sprawdzić, w jaki sposób powinno się używać nowych funkcji, usprawniających pracę z tekstem. Główne okno tego projektu zostało pokazane na Rys. 1. Przykładowy projekt.

Rys. 1. Przykładowy projekt.

Nawigacja pomiędzy poszczególnymi stronami projektu podda próbie nowe, opisane możliwości.

Character Spacing

DziękiCharacter Spacing programista ma możliwość ustalenia odstępów między znakami w elementach typu TextBlock i TextBox.

Rys. 2. Character sparing.

Fragmenty kodu źródłowego z wyjaśnieniem:

Za pomocą atrybutu CharacterSpacing należy wpisać żądaną wartość, pamiętając, że wartości ujemne zmniejszają odległości między znakami, a wartości dodatnie zwiększają je:

<StackPanel>
            <TextBlock FontSize="18">
        <Run CharacterSpacing="200"
                Text="This is a test with character spacing 200" />
            </TextBlock>
            <TextBlock FontSize="18">
        <Run CharacterSpacing="100"
                Text="This is a test with character spacing 100" />
            </TextBlock>
            <TextBlock FontSize="18">
</StackPanel>

Fragment ten pochodzi z pliku /Views/CharacterSpacing.xaml.

Linked and Multi-Column Text

Za pomocą Linked and Multi-Column Text programista ma możliwość łączenia ze sobą kolumn z tekstem. Kolumn takich może być wiele i mogą być one rozłożone na stronie w dowolny sposób. Gdy główna kolumna (RichTextBLock) zostanie zmniejszona lub zwiększona, analogicznie tekst również zostanie pokazany w sąsiadujących kolumnach towarzyszących (RichTextBlockOverflow).

Rys. 3. Columns.

Fragmenty kodu źródłowego z wyjaśnieniem:

Należy zwrócić uwagę, aby ustawić prawidłowo, w głównej kolumnie RichTextBlock, wartość atrybutu OverflowContentTarget, która powinna wskazywać na element kolumny towarzyszącej RichTextBlockOverflow:

<RichTextBlock x:Name="FirstBox"
             OverflowContentTarget="{Binding ElementName=SecondBox}"
             HorizontalAlignment="Left"
             Width="277">
        <Paragraph>
            Sed facilisis cursus ipsum, eget aliquet leo imperdiet sit amet. Aliquam ...
        </Paragraph>
        <Paragraph>
            Duis accumsan tristique nisi, non malesuada elit tempor ... fermentum mi euismod.
        </Paragraph>
        </RichTextBlock>

        <RichTextBlockOverflow x:Name="SecondBox"
                     HorizontalAlignment="Right"
                     Width="252"
                     Margin="0,154,0,0">
        </RichTextBlockOverflow>

Fragment ten pochodzi z pliku /Views/Columns.xaml.

OpenType

Silverlight 5 dostarcza wielu funkcji typograficznych wewnątrz bloku TextBlock. Warto więc zapoznać się z kodem źródłowym, dołączonym do projektu. Możliwe już jest ustawienie ligatur dla czcionek, które je obsługują. Programista ma możliwość definiowania indeksów górnych i dolnych oraz sposobu, w jaki zostaną wyświetlone ułamki zwykłe.

Rys. 4. OpenType.

Fragmenty kodu źródłowego z wyjaśnieniem:

TextBlock Text="Microsoft Silverlight"
                HorizontalAlignment="Center"
                FontSize="25"
                FontFamily="Gabriola"
                Typography.StandardLigatures="True"/>

Fractions:

<TextBlock Text="Microsoft Silverlight" Typography.Capitals="AllSmallCaps" />
<TextBlock Text="1/2 2/3 1 1/4 Normal" Typography.Fraction="Normal" />
<TextBlock Text="1/2 2/3 1 1/4 Slashes" Typography.Fraction="Slashed" />

Numbers:

<TextBlock>
    <Run Text="i"
         Typography.Variants="Normal" />
    <Run Text="2"
         Typography.Variants="Superscript" />
            </TextBlock>

Fragment ten pochodzi z pliku /Views/OpenType.xaml.

Ligatures

Nowości dla ligatur, dostępne w Silverlight 5, to:

• ContextualAlternates – pozwala ustawić dodatkowe atrybuty, które obsługują czcionki, np. czcionka Gabriola,
• StylisticsSets – pozwala ustawić stopień stylizacji danej czcionki (do wyboru jest 20 poziomów), dostępność danego stopnia zależy również od konkretnej czcionki.

Rys. 5. Ligatures.

Fragmenty kodu źródłowego z wyjaśnieniem:

<TextBlock Text="Microsoft Silverlight Set 7"
                   Typography.ContextualAlternates="True"
                   Typography.StylisticSet7="True" />
<TextBlock Text="MENU"
                   Typography.ContextualAlternates="True"
                   Typography.StylisticSet1="True" />

Fragment ten pochodzi z pliku /Views/Ligatures.xaml.

Podsumowanie

W tym artykule poznaliśmy nowe funkcje Silverlight 5, które będą pomocne przy pracy z tekstem w tworzonych aplikacjach.

W następnej części omówione zostaną podstawowe mechanizmy, pozwalające na integrację z systemem operacyjnym oprogramowania, tworzonego w Silverlight 5.