Binding ListBox ItemsSource to Fonts.SystemFontFamilies


   
       

<Window x:Class="FontViewer.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Teach Yourself WPF: Font Viewer"
        Height="480"
        Width="640">
    <DockPanel Margin="8">

        <ListBox x:Name="FontList"
                 DockPanel.Dock="Left"
                 ItemsSource="{x:Static Fonts.SystemFontFamilies}"
                 Width="160" />
        <TextBox x:Name="SampleText"
                 DockPanel.Dock="Bottom"
                 MinLines="4"
                 Margin="8 0"
                 TextWrapping="Wrap">
            <TextBox.ToolTip>
                <TextBlock>
                    <Italic Foreground="Red">Instructions: </Italic>
                    Type here to change the preview text.
                </TextBlock>
            </TextBox.ToolTip>
            The quick brown fox jumps over the lazy dog.
        </TextBox>
        <StackPanel Margin="8 0 8 8">
            <TextBlock Text="{Binding ElementName=SampleText, Path=Text}"
                       FontFamily="{Binding ElementName=FontList,Path=SelectedItem}"
                       FontSize="10"
                       TextWrapping="Wrap"
                       Margin="0 0 0 4" />
            <TextBlock Text="{Binding ElementName=SampleText, Path=Text}"
                       FontFamily="{Binding ElementName=FontList,Path=SelectedItem}"
                       FontSize="16"
                       TextWrapping="Wrap"
                       Margin="0 0 0 4" />
            <TextBlock Text="{Binding ElementName=SampleText, Path=Text}"
                       FontFamily="{Binding ElementName=FontList,Path=SelectedItem}"
                       FontSize="24"
                       TextWrapping="Wrap"
                       Margin="0 0 0 4" />
            <TextBlock Text="{Binding ElementName=SampleText, Path=Text}"
                       FontFamily="{Binding ElementName=FontList,Path=SelectedItem}"
                       FontSize="32"
                       TextWrapping="Wrap" />
        </StackPanel>
    </DockPanel>
</Window>

   
    
    
    
    
    
    
     


ListBox with different font for each ListBoxItem


   
      

<Window x:Class="Window1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="Use ListBox" Height="300" Width="300">
    <Grid>
        <ListBox Margin="10,10,10,0" Name="ListBox1" VerticalAlignment="Top" SelectedIndex="1" VerticalContentAlignment="Center">
            <ListBoxItem>A</ListBoxItem>
            <ListBoxItem FontFamily="Comic Sans MS" FontSize="18" Foreground="Blue"></ListBoxItem>
            <ListBoxItem>C</ListBoxItem>
        </ListBox>
    </Grid>
</Window>

   
    
    
    
    
    
     


ListBox with Image


   
      
<Window x:Class="Window1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="Use ListBox" Height="300" Width="300">
    <Grid>
        <ListBox Margin="10,10,10,0" Name="ListBox1" VerticalAlignment="Top" SelectedIndex="1" VerticalContentAlignment="Center">
            <ListBoxItem>Apple</ListBoxItem>
            <ListBoxItem Name="cbiSmile">
                <StackPanel Orientation="Horizontal">
                    <Image Source="c:image.bmp" Width="15" Height="15" />
                    <Label Content="Happy!" />
                </StackPanel>
            </ListBoxItem>
            <ListBoxItem>Cherry</ListBoxItem>
        </ListBox>
    </Grid>
</Window>

   
    
    
    
    
    
     


ListBoxItem Content


   
      

<Window x:Class="SimpleStyles.Window1"
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  Title="SimpleStyles"
  Background="#F8F8F8">
  <ScrollViewer>
    <WrapPanel>
      <HeaderedItemsControl Header="ListBox">
        <StackPanel Orientation="Horizontal">
          <ListBox Margin="8" SelectionMode="Extended"  Height="100">
            <ListBoxItem Content="First Normal Item" />
            <ListBoxItem Content="Second Normal Item" />
            <ListBoxItem Content="Third Normal Item" />
            <ListBoxItem Content="Fourth Normal Item" />
            <ListBoxItem Content="Fifth Normal Item" />
            <ListBoxItem Content="Sixth Normal Item" />
            <ListBoxItem Content="Seventh Normal Item" />
            <ListBoxItem Content="Eighth Normal Item" />
          </ListBox>
          <ListBox Margin="8" SelectionMode="Extended" ScrollViewer.VerticalScrollBarVisibility="Visible" Height="100">
            <ListBoxItem Content="First Normal Item" />
            <ListBoxItem Content="Second Normal Item" />
            <ListBoxItem Content="Third Normal Item" />
            <ListBoxItem Content="Fourth Normal Item" />
            <ListBoxItem Content="Fifth Normal Item" />
            <ListBoxItem Content="Sixth Normal Item" />
            <ListBoxItem Content="Seventh Normal Item" />
            <ListBoxItem Content="Eighth Normal Item" />
          </ListBox>
        </StackPanel>
      </HeaderedItemsControl>
   
    </WrapPanel>
  </ScrollViewer>
</Window>

   
    
    
    
    
    
     


Skew Transforms for a ListBox


   
      
<Window x:Class="WPFTransformations.Transforms"
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  Title="Skew Transform" Height="350" Width="300"
  >
  <Grid>
    <StackPanel Margin="8">
      <ListBox Height="100" Width="200" BorderBrush="Blue" BorderThickness="2">
        <ListBoxItem Content="Item 1" Background="Beige" Height="22"/>
        <ListBoxItem Content="Item 2" Background="LightGray" Height="22"/>
        <ListBoxItem Content="Item 3" Background="Beige" Height="22"/>
        <ListBoxItem Content="Item 4" Background="LightGray" Height="22"/>
        <ListBox.RenderTransform>
          <SkewTransform 
            CenterX="{Binding Path=Value, ElementName=sliderSkewCX}" 
            CenterY="{Binding Path=Value, ElementName=sliderSkewCY}" 
            AngleX="{Binding Path=Value, ElementName=sliderSkewX}" 
            AngleY="{Binding Path=Value, ElementName=sliderSkewY}"
            />
        </ListBox.RenderTransform>
      </ListBox>

      <TextBlock Height="65" Width="100"/>
      <Grid HorizontalAlignment="Center" Margin="2">
        <Grid.RowDefinitions>
          <RowDefinition/>
          <RowDefinition/>
          <RowDefinition/>
          <RowDefinition/>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
          <ColumnDefinition/>
          <ColumnDefinition Width="110"/>
          <ColumnDefinition/>
        </Grid.ColumnDefinitions>

        <TextBlock Grid.Row="0" Grid.Column="0" Text="Angle X:"/>
        <Slider Grid.Row="0" Grid.Column="1" Name="sliderSkewX"/>
        <TextBox Grid.Row="0" Grid.Column="2" 
          Text="{Binding Path=Value, ElementName=sliderSkewX}"/>


        <TextBlock Grid.Row="2" Grid.Column="0" Text="Center X:"/>
        <Slider Grid.Row="2" Grid.Column="1" Name="sliderSkewCX"/>
        <TextBox Grid.Row="2" Grid.Column="2" 
          Text="{Binding Path=Value, ElementName=sliderSkewCX}"/>

      </Grid>
    </StackPanel>
    <StackPanel Margin="8">
        <Rectangle Height="100" Width="200" Stroke="Red" Fill="Red" Opacity=".05"/>
    </StackPanel>
  </Grid>
</Window>

   
    
    
    
    
    
     


Scale a ListBox


   
      
<Window x:Class="WPFTransformations.Scale"
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  Title="Scale Transform" Height="400" Width="300"
  >

    <Grid>
        <StackPanel Margin="8">
            <TextBlock Height="25" Width="100"/>

            <ListBox Height="100" Width="200" BorderThickness="2">
                <ListBoxItem Content="Item 1" Height="22"/>
                <ListBoxItem Content="Item 2" Height="22"/>
                <ListBoxItem Content="Item 3" Height="22"/>
                <ListBoxItem Content="Item 4" Height="22"/>
                <ListBox.RenderTransform>
                    <ScaleTransform ScaleX="{Binding Path=Value, ElementName=sliderScaleX}" 
                                    ScaleY="{Binding Path=Value, ElementName=sliderScaleY}"
            CenterX="{Binding Path=Value, ElementName=sliderScaleCX}" 
            CenterY="{Binding Path=Value, ElementName=sliderScaleCY}" 
            />
                </ListBox.RenderTransform>
            </ListBox>

            <TextBlock Height="65" Width="100"/>
            <Grid HorizontalAlignment="Center" Margin="2">
                <Grid.RowDefinitions>
                    <RowDefinition/>
                    <RowDefinition/>
                    <RowDefinition/>
                    <RowDefinition/>
                </Grid.RowDefinitions>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="62" />
                    <ColumnDefinition Width="93"/>
                    <ColumnDefinition Width="16*" />
                </Grid.ColumnDefinitions>

                <TextBlock Text="Scale X:" Margin="0,0,16.323,0" />
                <Slider Name="sliderScaleX" Maximum="2.5" Minimum="0" Value="1" TickFrequency=".1" Grid.ColumnSpan="2" Margin="45.677,0,0,0" />
                <TextBox Grid.Row="0" Grid.Column="2" Text="{Binding Path=Value, ElementName=sliderScaleX}"/>

                <TextBlock Grid.Row="1" Text="Scale Y:" Margin="0,0,16.323,0" />
                <Slider Grid.Row="1" Name="sliderScaleY" Maximum="2.5" Minimum="0" Value="1" TickFrequency=".1" Grid.ColumnSpan="2" Margin="45.677,0,0,0" />
                <TextBox Grid.Row="1" Grid.Column="2" Text="{Binding Path=Value, ElementName=sliderScaleY}"/>

            </Grid>
        </StackPanel>
        <StackPanel Margin="8">
            <TextBlock Height="25" Width="100"/>
            <Rectangle Height="100" Width="200" Stroke="Red" Fill="Red" Opacity=".05"/>
        </StackPanel>
    </Grid>
</Window>

   
    
    
    
    
    
     


Rotate a ListBox


   
      

<Window x:Class="WPFTransformations.Rotate"
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  Title="Rotate Transform" Height="350" Width="300">
  <Grid>
        <StackPanel Margin="8">
            <TextBlock Height="25" Width="100"/>
            <ListBox Height="100" Width="200" BorderThickness="2">
                <ListBoxItem Content="Item 1" Height="22"/>
                <ListBoxItem Content="Item 2" Height="22"/>
                <ListBoxItem Content="Item 3" Height="22"/>
                <ListBoxItem Content="Item 4" Height="22"/>
                <ListBox.RenderTransform>
                   <RotateTransform
                        Angle="{Binding ElementName=sliderAngle, Path=Value}" 
                        CenterX="{Binding ElementName=sliderCenterX, Path=Value}" 
                        CenterY="{Binding ElementName=sliderCenterY, Path=Value}"/>
                </ListBox.RenderTransform>
            </ListBox>

            <TextBlock Height="65" Width="100"/>
            <Grid HorizontalAlignment="Center" Margin="2">
                <Grid.RowDefinitions>
                    <RowDefinition/>
                    <RowDefinition/>
                    <RowDefinition/>
                    <RowDefinition/>
                </Grid.RowDefinitions>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition/>
                    <ColumnDefinition Width="110"/>
                    <ColumnDefinition/>
                </Grid.ColumnDefinitions>

                <TextBlock Grid.Row="0" Grid.Column="0" Text="Angle:"/>
                <Slider Grid.Row="0" Grid.Column="1" Name="sliderAngle" Maximum="360" Minimum="-360"/>
                <TextBox Grid.Row="0" Grid.Column="2" Text="{Binding ElementName=sliderAngle, Path=Value}"/>

                <TextBlock Grid.Row="2" Grid.Column="0" Text="Center Y:"/>
                <Slider Grid.Row="2" Grid.Column="1" Name="sliderCenterY"/>
                <TextBox Grid.Row="2" Grid.Column="2" Text="{Binding ElementName=sliderCenterY, Path=Value}"/>

            </Grid>
        </StackPanel>
        <StackPanel Margin="8">
            <TextBlock Height="25" Width="100"/>
            <Rectangle Height="100" Width="200" Stroke="Red" Fill="Red" Opacity=".05"/>
        </StackPanel>
    </Grid>
</Window>