Bickham Script Pro is a very sophisticated OpenType font, with very nice contextual alternates and ligatures. What sets Bickham apart is the alternate forms it provides — here are the ten (10!) different versions of the lowercase letter “h” available in the font:

Ten forms of the lowercase letter h, shown in Bickham Script Pro

In Avalon, you can choose between the alternates through the Typography.StylisticAlternates property. Most of the alternate forms shown above look best at the beginning of a word, but some (like #9) are meant for the end of the word.

Here’s the full markup for the screenshot shown above:

<Grid xmlns="http://schemas.microsoft.com/winfx/avalon/2005" xmlns:x="http://schemas.microsoft.com/winfx/xaml/2005" HorizontalAlignment="Center">
  <Grid.Resources>
    <Style TargetType="{x:Type Border}">
      <Setter Property="Margin" Value="5" />
      <Setter Property="Padding" Value="20,0" />
      <Setter Property="BorderThickness" Value="1" />
      <Setter Property="BorderBrush" Value="#ccc" />
    </Style>
    <Style x:Key="AlternateDisplay" TargetType="{x:Type TextBlock}">
      <Setter Property="FontFamily" Value="Bickham Script Pro" />
      <Setter Property="FontSize" Value="60" />
    </Style>
    <Style x:Key="AlternateLabel" TargetType="{x:Type TextBlock}">
      <Setter Property="FontFamily" Value="Calibri, Verdana" />
      <Setter Property="FontSize" Value="20" />
      <Setter Property="Margin" Value="10" />
      <Setter Property="HorizontalAlignment" Value="Center" />
      <Setter Property="VerticalAlignment" Value="Bottom" />
    </Style>
  </Grid.Resources>

  <Grid.ColumnDefinitions>
    <ColumnDefinition Width="Auto" />
    <ColumnDefinition Width="Auto" />
    <ColumnDefinition Width="Auto" />
    <ColumnDefinition Width="Auto" />
    <ColumnDefinition Width="Auto" />
  </Grid.ColumnDefinitions>

  <Grid.RowDefinitions>
    <RowDefinition Height="Auto" />
    <RowDefinition Height="Auto" />
  </Grid.RowDefinitions>

  <Border>
    <TextBlock Style="{StaticResource AlternateDisplay}"><Inline Typography.StylisticAlternates="0">h</Inline></TextBlock>
  </Border>
  <Border Grid.Column="1">
    <TextBlock Style="{StaticResource AlternateDisplay}"><Inline Typography.StylisticAlternates="1">h</Inline></TextBlock>
  </Border>
  <Border Grid.Column="2">
    <TextBlock Style="{StaticResource AlternateDisplay}"><Inline Typography.StylisticAlternates="2">h</Inline></TextBlock>
  </Border>
  <Border Grid.Column="3">
    <TextBlock Style="{StaticResource AlternateDisplay}"><Inline Typography.StylisticAlternates="3">h</Inline></TextBlock>
  </Border>
  <Border Grid.Column="4">
    <TextBlock Style="{StaticResource AlternateDisplay}"><Inline Typography.StylisticAlternates="4">h</Inline></TextBlock>
  </Border>
  <Border Grid.Row="1">
    <TextBlock Style="{StaticResource AlternateDisplay}"><Inline Typography.StylisticAlternates="5">h</Inline></TextBlock>
  </Border>
  <Border Grid.Column="1" Grid.Row="1">
    <TextBlock Style="{StaticResource AlternateDisplay}"><Inline Typography.StylisticAlternates="6">h</Inline></TextBlock>
  </Border>
  <Border Grid.Column="2" Grid.Row="1">
    <TextBlock Style="{StaticResource AlternateDisplay}"><Inline Typography.StylisticAlternates="7">h</Inline></TextBlock>
  </Border>
  <Border Grid.Column="3" Grid.Row="1">
    <TextBlock Style="{StaticResource AlternateDisplay}"><Inline Typography.StylisticAlternates="8">h</Inline></TextBlock>
  </Border>
  <Border Grid.Column="4" Grid.Row="1">
    <TextBlock Style="{StaticResource AlternateDisplay}"><Inline Typography.StylisticAlternates="9">h</Inline></TextBlock>
  </Border>

  <!-- Labels -->
  <TextBlock Style="{StaticResource AlternateLabel}" Grid.Column="0">0</TextBlock>
  <TextBlock Style="{StaticResource AlternateLabel}" Grid.Column="1">1</TextBlock>
  <TextBlock Style="{StaticResource AlternateLabel}" Grid.Column="2">2</TextBlock>
  <TextBlock Style="{StaticResource AlternateLabel}" Grid.Column="3">3</TextBlock>
  <TextBlock Style="{StaticResource AlternateLabel}" Grid.Column="4">4</TextBlock>
  <TextBlock Style="{StaticResource AlternateLabel}" Grid.Row="1" Grid.Column="0">5</TextBlock>
  <TextBlock Style="{StaticResource AlternateLabel}" Grid.Row="1" Grid.Column="1">6</TextBlock>
  <TextBlock Style="{StaticResource AlternateLabel}" Grid.Row="1" Grid.Column="2">7</TextBlock>
  <TextBlock Style="{StaticResource AlternateLabel}" Grid.Row="1" Grid.Column="3">8</TextBlock>
  <TextBlock Style="{StaticResource AlternateLabel}" Grid.Row="1" Grid.Column="4">9</TextBlock>
</Grid>
  • Thomas Phinney
    Hmmm. Actually, only forms #1 and #8 are intended for the beginning of a word. All the others have vestigial connecting strokes that lead to some previous letter. Most of these will get automatically chosen depending on context, and perhaps some more as a combination of context and "swash" being on.

    But it's still very cool, regardless! :)

    Cheers,

    Thomas Phinney
    Adobe Systems
blog comments powered by Disqus