![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
<Grid Grid.Row="3" Grid.ColumnSpan="3"> <Grid.Resources> <SolidColorBrush x:Key="BackgroundColor" Color="#00000000"/> <SolidColorBrush x:Key="ForegroundColor" Color="#FF000000"/> <SolidColorBrush x:Key="BorderBrushColor" Color="#FFFFFFFF"/> <ControlTemplate x:Key="ButtonTemplate" TargetType="Button"> <Grid> <VisualStateManager.VisualStateGroups> <VisualStateGroup x:Name="CommonStates"> <VisualState x:Name="Normal"/> <VisualState x:Name="MouseOver"> <Storyboard> <ColorAnimation Duration="0" To="#FFFFFFFF" Storyboard.TargetProperty="(BorderBrush).Color" Storyboard.TargetName="OuterBtnBorder"/> <ColorAnimation Duration="0" To="#FFCCD1D6" Storyboard.TargetProperty="(BorderBrush).Color" Storyboard.TargetName="InnerBtnBorder"/> </Storyboard> </VisualState> <VisualState x:Name="Pressed"> <Storyboard> <ColorAnimation Duration="0" To="#FFFFFFFF" Storyboard.TargetProperty="(BorderBrush).Color" Storyboard.TargetName="OuterBtnBorder"/> <ColorAnimation Duration="0" To="#00FFFFFF" Storyboard.TargetProperty="(BorderBrush).Color" Storyboard.TargetName="InnerBtnBorder"/> </Storyboard> </VisualState> <VisualState x:Name="Disabled"> <Storyboard> <DoubleAnimation Duration="0" To="0.5" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="path"/> </Storyboard> </VisualState> </VisualStateGroup> <VisualStateGroup x:Name="FocusStates"> <VisualState x:Name="Focused"> <Storyboard> <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="FocusVisualElement"/> </Storyboard> </VisualState> <VisualState x:Name="Unfocused"/> </VisualStateGroup> </VisualStateManager.VisualStateGroups> <Border x:Name="OuterBtnBorder" BorderBrush="#00FFFFFF" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" CornerRadius="3"> <Border x:Name="InnerBtnBorder" BorderBrush="#00CCD1D6" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="2"> <ContentPresenter x:Name="path" Content="{TemplateBinding Content}"/> </Border> </Border> <Border x:Name="FocusVisualElement" BorderBrush="#FF6DBDD1" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" CornerRadius="2" Margin="1" Opacity="0"/> </Grid> </ControlTemplate> <Style x:Key="PagingTextBoxStyle" TargetType="TextBox"> <Setter Property="BorderThickness" Value="1"/> <Setter Property="Background" Value="#FFFFFFFF"/> <Setter Property="Foreground" Value="#FF000000"/> <Setter Property="Padding" Value="2, 2, 2, -1"/> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="TextBox"> <Grid x:Name="RootElement"> <VisualStateManager.VisualStateGroups> <VisualStateGroup x:Name="CommonStates"> <VisualState x:Name="Normal"/> <VisualState x:Name="MouseOver"> <Storyboard> <ColorAnimation To="#FF99C1E2" Storyboard.TargetProperty="(BorderBrush).Color" Storyboard.TargetName="MouseOverBorder"/> </Storyboard> </VisualState> <VisualState x:Name="Disabled"> <Storyboard> <DoubleAnimation To="1" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="DisabledVisualElement"/> </Storyboard> </VisualState> <VisualState x:Name="ReadOnly"> <Storyboard> <DoubleAnimation To="1" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="ReadOnlyVisualElement"/> </Storyboard> </VisualState> </VisualStateGroup> <VisualStateGroup x:Name="FocusStates"> <VisualState x:Name="Focused"> <Storyboard> <DoubleAnimation To="1" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="FocusVisualElement"/> </Storyboard> </VisualState> <VisualState x:Name="Unfocused"/> </VisualStateGroup> </VisualStateManager.VisualStateGroups> <Border x:Name="Border" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="#66FFFFFF" CornerRadius="1" Opacity="1"> <Grid> <Border x:Name="ReadOnlyVisualElement" Background="#72F7F7F7" Opacity="0"/> <Border x:Name="MouseOverBorder" BorderBrush="Transparent" BorderThickness="1"> <ScrollViewer x:Name="ContentElement" BorderThickness="0" IsTabStop="False" Margin="0,-3,0,0" Padding="{TemplateBinding Padding}" VerticalAlignment="Top"/> </Border> </Grid> </Border> <Border x:Name="DisabledVisualElement" BorderBrush="#A5F7F7F7" BorderThickness="{TemplateBinding BorderThickness}" Background="#A5F7F7F7" IsHitTestVisible="False" Opacity="0"/> <Border x:Name="FocusVisualElement" BorderBrush="#FF6DBDD1" BorderThickness="{TemplateBinding BorderThickness}" IsHitTestVisible="False" Margin="1" Opacity="0"/> </Grid> </ControlTemplate> </Setter.Value> </Setter> </Style> </Grid.Resources> <Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" CornerRadius="2" MinHeight="24" Padding="{TemplateBinding Padding}" VerticalAlignment="Bottom"> <StackPanel HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Orientation="Horizontal" VerticalAlignment="Stretch"> <Button x:Name="FirstPageButton" BorderBrush="{StaticResource BorderBrushColor}" BorderThickness="1" Background="{StaticResource BackgroundColor}" Foreground="{StaticResource ForegroundColor}" HorizontalAlignment="Right" Height="20" Padding="1" Template="{StaticResource ButtonTemplate}" VerticalAlignment="Center" Width="20"> <Grid Height="9" Width="8"> <Path Data="M0,1 L1,0 L1,2 Z" Fill="{TemplateBinding Foreground}" HorizontalAlignment="Right" Height="9" Stretch="Fill" Width="5"/> <Rectangle Fill="{TemplateBinding Foreground}" HorizontalAlignment="Left" Width="2"/> </Grid> </Button> <Button x:Name="PreviousPageButton" BorderBrush="{StaticResource BorderBrushColor}" BorderThickness="1" Background="{StaticResource BackgroundColor}" Foreground="{StaticResource ForegroundColor}" HorizontalAlignment="Right" Height="20" Padding="1" Template="{StaticResource ButtonTemplate}" VerticalAlignment="Center" Width="20"> <Path Data="M0,1 L1,0 L1,2 Z" Fill="{TemplateBinding Foreground}" HorizontalAlignment="Center" Height="9" Stretch="Fill" Width="5"/> </Button> <Border x:Name="Separator1" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="1,0,1,0" Background="#FFCCD1D6" Margin="0,3,0,3" Width="1"/> <StackPanel x:Name="NumericButtonPanel" Margin="1" Orientation="Horizontal"/> <StackPanel x:Name="PageDisplay" Orientation="Horizontal"> <TextBlock x:Name="CurrentPagePrefixTextBlock" Foreground="{TemplateBinding Foreground}" Margin="4,0,0,0" VerticalAlignment="Center" Width="Auto"/> <TextBox x:Name="CurrentPageTextBox" BorderBrush="{TemplateBinding BorderBrush}" Foreground="{TemplateBinding Foreground}" Height="Auto" Margin="4,2,4,2" Style="{StaticResource PagingTextBoxStyle}" TextWrapping="Wrap" VerticalAlignment="Center" Width="40"/> <TextBlock x:Name="CurrentPageSuffixTextBlock" Foreground="{TemplateBinding Foreground}" Margin="0,0,4,0" VerticalAlignment="Center" Width="Auto"/> </StackPanel> <Border x:Name="Separator2" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="1,0,1,0" Background="#FFCCD1D6" Margin="0,3,0,3" Width="1"/> <Button x:Name="NextPageButton" BorderBrush="{StaticResource BorderBrushColor}" BorderThickness="1" Background="{StaticResource BackgroundColor}" Foreground="{StaticResource ForegroundColor}" HorizontalAlignment="Right" Height="20" Padding="1" Template="{StaticResource ButtonTemplate}" VerticalAlignment="Center" Width="20"> <Path Data="M0,0 L1,1 L0,2 Z" Fill="{TemplateBinding Foreground}" HorizontalAlignment="Center" Height="9" Stretch="Fill" Width="5"/> </Button> <Button x:Name="LastPageButton" BorderBrush="{StaticResource BorderBrushColor}" BorderThickness="1" Background="{StaticResource BackgroundColor}" Foreground="{StaticResource ForegroundColor}" HorizontalAlignment="Right" Height="20" Padding="1" Template="{StaticResource ButtonTemplate}" VerticalAlignment="Center" Width="20"> <Grid Height="9" Width="8"> <Path Data="M0,0 L1,1 L0,2 Z" Fill="{TemplateBinding Foreground}" HorizontalAlignment="Left" Height="9" Stretch="Fill" Width="5"/> <Rectangle Fill="{TemplateBinding Foreground}" HorizontalAlignment="Right" Width="2"/> </Grid> </Button> </StackPanel> </Border> </Grid>