This is a migrated thread and some comments may be shown as answers.

Removing the header from GroupBox

5 Answers 391 Views
General Discussions
This is a migrated thread and some comments may be shown as answers.
Varghese
Top achievements
Rank 1
Varghese asked on 25 Aug 2013, 09:33 PM
I'm trying to have a Groupbox with a list of other controls, very similar to a login form. I don't need a header, so I set the property called header with an empty string. As you see in the picture, there is a gap in the border - look at where the red arrow points to. How can I fix this, so there is no gap.

I'm also open to any solution where by I can achieve some other control to achieve what I want. I want to group a list of controls and have a background. Can I use a grid and setting the border style and background and achieve the same?

5 Answers, 1 is accepted

Sort by
0
Yana
Telerik team
answered on 29 Aug 2013, 12:29 PM
Hello Varghese,

I guess you can use regular Grid and define its Columns and Rows.

As to the GroupBox - can you post here the exact definition that you're using? Thanks in advance.

Regards,
Yana
Telerik
TRY TELERIK'S NEWEST PRODUCT - EQATEC APPLICATION ANALYTICS for WPF.
Learn what features your users use (or don't use) in your application. Know your audience. Target it better. Develop wisely.
Sign up for Free application insights >>
0
Varghese
Top achievements
Rank 1
answered on 30 Aug 2013, 10:33 AM
The code is given below:

<telerik:GroupBox Grid.Column="1" HorizontalAlignment="Left" Grid.Row="1" VerticalAlignment="Top" Height="264.96" Width="456.784" Header="" FontSize="16">
            <telerik:GroupBox.Background>
                <ImageBrush ImageSource="light-coffee-bkgd.jpg" Stretch="None" TileMode="Tile" ViewportUnits="Absolute"/>
            </telerik:GroupBox.Background>
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition/>
                    <RowDefinition/>
                    <RowDefinition/>
                </Grid.RowDefinitions>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="25"/>
                    <ColumnDefinition Width="*"/>
                    <ColumnDefinition Width="25"/>
                </Grid.ColumnDefinitions>
                <telerik:RadMaskedTextInput HorizontalAlignment="Stretch" Grid.Row="0" Grid.Column="1" Height="40" VerticalAlignment="Bottom"/>
                <telerik:RadMaskedTextInput HorizontalAlignment="Stretch" Grid.Row="1" Grid.Column="1" Height="40" VerticalAlignment="Bottom"/>
                <telerik:RadButton Content="Login" Grid.Row="2" Grid.Column="1" Width="150" Height="30" HorizontalAlignment="Right" IsDefault="True" FontSize="16" />
            </Grid>
        </telerik:GroupBox>
0
Yana
Telerik team
answered on 03 Sep 2013, 08:44 AM
Hello Varghese,

The header in the GroupBox template has a default Padding, hence the space. You should customize the whole template in order to remove it, please add the following Styles in the Resources:

<Window.Resources>
       
<SolidColorBrush x:Key="ControlOuterBorder_Normal" Color="#FF848484" />
<SolidColorBrush x:Key="PickerForeground_Normal" Color="#FF000000" />
         
<Style x:Key="GroupBoxStyle1" TargetType="telerik:GroupBox">
    <Setter Property="BorderBrush" Value="{StaticResource ControlOuterBorder_Normal}" />
    <Setter Property="Foreground" Value="{StaticResource PickerForeground_Normal}" />
    <Setter Property="BorderThickness" Value="1" />
    <Setter Property="Background" Value="{x:Null}" />
    <Setter Property="Header" Value="GroupBox" />
    <Setter Property="SnapsToDevicePixels" Value="True" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="telerik:GroupBox">
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="6" />
                        <ColumnDefinition Width="Auto" />
                        <ColumnDefinition Width="*" />
                        <ColumnDefinition Width="6" />
                    </Grid.ColumnDefinitions>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto" />
                        <RowDefinition Height="Auto" />
                        <RowDefinition Height="*" />
                        <RowDefinition Height="6" />
                    </Grid.RowDefinitions>
                    <Border x:Name="Background" Grid.ColumnSpan="4" Grid.Column="0" Grid.Row="1" Grid.RowSpan="3" BorderBrush="{x:Null}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" CornerRadius="4" />
                    <Border x:Name="PART_Header" Padding="0" Grid.Column="1" Grid.Row="0" Grid.RowSpan="2">
                        <ContentPresenter ContentSource="Header" RecognizesAccessKey="True" />
                    </Border>
                    <ContentPresenter x:Name="Content" Grid.Row="2" Grid.ColumnSpan="2" Grid.Column="1" Margin="{TemplateBinding Padding}" />
                    <Border x:Name="PART_Border" Margin="1 0 1 1" Grid.ColumnSpan="4" CornerRadius="4" Grid.Row="1" Grid.RowSpan="3" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" IsHitTestVisible="False" />
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>
<Style TargetType="telerik:GroupBox" BasedOn="{StaticResource GroupBoxStyle1}" />
...
</Window.Resources>

I've only changed the Padding in PART_Header element.

I hope this helps.

Regards,
Yana
Telerik
TRY TELERIK'S NEWEST PRODUCT - EQATEC APPLICATION ANALYTICS for WPF.
Learn what features your users use (or don't use) in your application. Know your audience. Target it better. Develop wisely.
Sign up for Free application insights >>
0
ardmore
Top achievements
Rank 1
answered on 04 Aug 2016, 12:51 PM

The property 'ContentSource' was not found in type 'ContentPresenter'.

The property 'RecognizesAccessKey' was not found in type 'ContentPresenter'

Do I miss something?

0
ardmore
Top achievements
Rank 1
answered on 04 Aug 2016, 01:05 PM
The above is referring to Silverlight application.
Tags
General Discussions
Asked by
Varghese
Top achievements
Rank 1
Answers by
Yana
Telerik team
Varghese
Top achievements
Rank 1
ardmore
Top achievements
Rank 1
Share this question
or