Encabezado de ribbongroup en la parte superior

Question

Estoy tratando de descubrir cómo implementar el "mejor" ejemplo de lo que se muestra aquí:

Específicamente lo que se usa para encabezados de "sangría" y "espaciado". Supongo que es solo un encabezado Ribbongroup con el encabezado en la parte superior, pero no puedo entender cómo hacerlo. Ideas?

Answer 1

Es solamente un TextBlock.

Que parece ser directamente del Fuente de WPF y muestras.

Encontrará lo siguiente en UserControlword.xaml, que creo que es el código exacto que produce todo el párrafo Ribbongroup en su Mejor: ejemplo. Para Bibutons no genéricos y tal ... Por lo general, solo hacen su propia cuadrícula de controles normales en los ejemplos.

<ribbon:RibbonGroup Header="Paragraph" KeyTip="ZG">
    <ribbon:RibbonGroup.Resources>
        <!-- Vertical Separator-->                        
        <Style TargetType="{x:Type ribbon:RibbonSeparator}" x:Key="RibbonSeparatorStyleKey">
            <Setter Property="LayoutTransform">
                <Setter.Value>
                    <RotateTransform Angle="90"/>                                                                            
                </Setter.Value>
            </Setter>
        </Style>

        <!-- Image -->
        <Style TargetType="{x:Type Image}" x:Key="ImageStyle16Key">
            <Setter Property="Width" Value="16"/>
            <Setter Property="Height" Value="16"/>
            <Setter Property="VerticalAlignment" Value="Center"/>
            <Setter Property="HorizontalAlignment" Value="Center"/>
            <Setter Property="Margin" Value="1"/>
            <Setter Property="RenderOptions.BitmapScalingMode" Value="NearestNeighbor"/>
        </Style>                                                         
    </ribbon:RibbonGroup.Resources>
    <ribbon:RibbonGroup.GroupSizeDefinitions>
        <ribbon:RibbonGroupTemplateSizeDefinition>                            
            <DataTemplate>
                <Grid>
                    <Grid.RowDefinitions>
                        <RowDefinition/>
                        <RowDefinition/>
                        <RowDefinition/>
                    </Grid.RowDefinitions>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition/>
                        <ColumnDefinition/>
                        <ColumnDefinition/>
                    </Grid.ColumnDefinitions>
                    <!-- Indent -->
                    <TextBlock Grid.Row="0" Grid.Column="0" Text="Indent" HorizontalAlignment="Left"/>
                    <Grid Grid.Row="1" Grid.Column="0" Name="LeftIndentGrid">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition/>
                            <ColumnDefinition Width="35"/>
                            <ColumnDefinition/>
                        </Grid.ColumnDefinitions>
                        <Image Grid.Column="0" Source="Images\DecreaseIndent_16X16.png" Style="{StaticResource ImageStyle16Key}"/>
                        <TextBlock Grid.Column="1" Text="Left:" HorizontalAlignment="Left" TextAlignment="Left" Margin="3,0,0,0"/>
                        <ribbon:RibbonTextBox Grid.Column="2"  KeyTip="IL"/>
                    </Grid>
                    <Grid Grid.Row="2" Grid.Column="0" Name="RightIndentGrid">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition/>
                            <ColumnDefinition Width="35"/>
                            <ColumnDefinition/>
                        </Grid.ColumnDefinitions>
                        <Image Grid.Column="0" Source="Images\IncreaseIndent_16X16.png" Style="{StaticResource ImageStyle16Key}"/>
                        <TextBlock Grid.Column="1" Text="Right:" HorizontalAlignment="Left" TextAlignment="Left" Margin="3,0,0,0"/>
                        <ribbon:RibbonTextBox Grid.Column="2"  KeyTip="IR"/>
                    </Grid>

                    <!-- Separator -->
                    <ribbon:RibbonSeparator Grid.RowSpan="3" Grid.Column="1" Margin="1,5,5,0" Style="{StaticResource RibbonSeparatorStyleKey}"/>

                <!-- Spacing -->
                    <TextBlock Grid.Row="0" Grid.Column="2" Text="Spacing" HorizontalAlignment="Left"/>
                    <Grid Grid.Row="1" Grid.Column="2" Name="BeforeSpacingGrid">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition/>
                            <ColumnDefinition Width="40"/>
                            <ColumnDefinition/>
                        </Grid.ColumnDefinitions>                                            
                        <Image Grid.Column="0" Source="Images\LineSpacing_16X16.png" Style="{StaticResource ImageStyle16Key}"/>
                        <TextBlock Grid.Column="1" Text="Before:" TextAlignment="Left" HorizontalAlignment="Left" Margin="3,0,0,0"/>
                        <ribbon:RibbonTextBox Grid.Column="2"  KeyTip="SB"/>
                    </Grid>
                    <Grid Grid.Row="2" Grid.Column="2" Name="AfterSpacingGrid">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition/>
                            <ColumnDefinition Width="40"/>
                            <ColumnDefinition/>
                        </Grid.ColumnDefinitions>
                        <Image Grid.Column="0" Source="Images\LineSpacing_16X16.png" Style="{StaticResource ImageStyle16Key}"/>
                        <TextBlock Grid.Column="1" Text="After:" TextAlignment="Left" HorizontalAlignment="Left" Margin="3,0,0,0"/>
                        <ribbon:RibbonTextBox Grid.Column="2"  KeyTip="SA"/>
                    </Grid>
                </Grid>
            </DataTemplate>                            
        </ribbon:RibbonGroupTemplateSizeDefinition>
        <ribbon:RibbonGroupTemplateSizeDefinition>                            
            <DataTemplate>
                <Grid>
                    <Grid.RowDefinitions>
                        <RowDefinition/>
                        <RowDefinition/>
                        <RowDefinition/>
                    </Grid.RowDefinitions>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition/>
                        <ColumnDefinition/>
                        <ColumnDefinition/>
                    </Grid.ColumnDefinitions>

                    <!-- Indent -->
                    <TextBlock Grid.Row="0" Grid.Column="0" Text="Indent" HorizontalAlignment="Left"/>
                    <Grid Grid.Row="1" Grid.Column="0">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition/>
                            <ColumnDefinition/>
                        </Grid.ColumnDefinitions>
                        <Image Grid.Column="0" Source="Images\DecreaseIndent_16X16.png" Style="{StaticResource ImageStyle16Key}"/>
                        <ribbon:RibbonTextBox Grid.Column="2"  KeyTip="IL"/>
                    </Grid>
                    <Grid Grid.Row="2" Grid.Column="0">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition/>
                            <ColumnDefinition/>
                        </Grid.ColumnDefinitions>
                        <Image Grid.Column="0" Source="Images\IncreaseIndent_16X16.png" Style="{StaticResource ImageStyle16Key}"/>
                        <ribbon:RibbonTextBox Grid.Column="2"  KeyTip="IR"/>
                    </Grid>

                    <!-- Separator-->
                    <ribbon:RibbonSeparator Grid.RowSpan="3" Grid.Column="1" Margin="1,5,5,0" Style="{StaticResource RibbonSeparatorStyleKey}"/>

                    <!-- Spacing-->
                    <TextBlock Grid.Row="0" Grid.Column="2" Text="Spacing" HorizontalAlignment="Left"/>
                    <Grid Grid.Row="1" Grid.Column="2">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition/>
                            <ColumnDefinition/>
                        </Grid.ColumnDefinitions>
                        <Image Grid.Column="0" Source="Images\LineSpacing_16X16.png" Style="{StaticResource ImageStyle16Key}"/>
                        <ribbon:RibbonTextBox Grid.Column="2" KeyTip="SB"/>
                    </Grid>
                    <Grid Grid.Row="2" Grid.Column="2">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition/>
                            <ColumnDefinition/>
                        </Grid.ColumnDefinitions>
                        <Image Grid.Column="0" Source="Images\LineSpacing_16X16.png" Style="{StaticResource ImageStyle16Key}"/>
                        <ribbon:RibbonTextBox Grid.Column="2" KeyTip="SA"/>
                    </Grid>
                </Grid>
            </DataTemplate>                            
        </ribbon:RibbonGroupTemplateSizeDefinition>
        <ribbon:RibbonGroupTemplateSizeDefinition IsCollapsed="True"/>
    </ribbon:RibbonGroup.GroupSizeDefinitions>
</ribbon:RibbonGroup>