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

Expander doesn't collapse

3 Answers 728 Views

LayoutControl

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

Aldo asked on 12 May 2016, 04:32 PM

Hi,
I'm using LayoutControl with DisplayMode="Expander", but when I collapse a group, its content doesn't resize, controls disappear but LayoutControl height doesn'tchange.

I tried to use a WrapPanel to contains controls but it's the same behavior.

Am I missing something ?

This is my XAML

<Grid Grid.Row="2" Grid.Column="0" Grid.ColumnSpan="2" Margin="5">

<Grid.RowDefinitions>

<RowDefinition Height="550"/>

</Grid.RowDefinitions>

<telerik:RadLayoutControl Grid.Row="0" Grid.Column="0" Orientation="Vertical">

<telerik:LayoutControlGroup DisplayMode="Expander" IsExpanded="True" IsExpandable="True" Header="{DynamicResource layTabAccAccountCausalsFlags}">

<WrapPanel>

<CheckBox HorizontalAlignment="Left" Margin="5,0,0,0" Height="20" IsChecked="{Binding Causal.GeneralUse}" Content="{DynamicResource labTabAccAccountCausalsGenericUse}" Validation.ErrorTemplate="{StaticResource ErrorTemplate}"></CheckBox>

<CheckBox HorizontalAlignment="Left" Margin="5,0,0,0" Height="20" IsChecked="{Binding Causal.IVAUse}" Content="{DynamicResource labTabAccAccountCausalsIVAUse}" Validation.ErrorTemplate="{StaticResource ErrorTemplate}"></CheckBox>

<CheckBox HorizontalAlignment="Left" Margin="5,0,0,0" Height="20" IsChecked="{Binding Causal.CustomersUse}" Content="{DynamicResource labTabAccAccountCausalsCustomersUse}" Validation.ErrorTemplate="{StaticResource ErrorTemplate}"></CheckBox>

<CheckBox HorizontalAlignment="Left" Margin="5,0,0,0" Height="20" IsChecked="{Binding Causal.SuppliersUse}" Content="{DynamicResource labTabAccAccountCausalsSuppliersUse}" Validation.ErrorTemplate="{StaticResource ErrorTemplate}"></CheckBox>

<CheckBox HorizontalAlignment="Left" Margin="5,0,0,0" Height="20" IsChecked="{Binding Causal.ThirdPartsUse}" Content="{DynamicResource labTabAccAccountCausalsThirdPartsUse}" Validation.ErrorTemplate="{StaticResource ErrorTemplate}"></CheckBox>

<CheckBox HorizontalAlignment="Left" Margin="5,0,0,0" Height="20" IsChecked="{Binding Causal.INTRAUse}" Content="{DynamicResource labTabAccAccountCausalsINTRAUse}" Validation.ErrorTemplate="{StaticResource ErrorTemplate}"></CheckBox>

</WrapPanel>

</telerik:LayoutControlGroup>

<telerik:LayoutControlGroup DisplayMode="Expander" Margin="3" IsExpanded="True" IsExpandable="True" Header="{DynamicResource layTabAccAccountCausalsIVA}">

<Grid>

<Grid.ColumnDefinitions>

<ColumnDefinition Width="150"/>

<ColumnDefinition Width="150*"/>

</Grid.ColumnDefinitions>

<Grid.RowDefinitions>

<RowDefinition Height="40"/>

</Grid.RowDefinitions>

<Label Grid.Row="0" Grid.Column="0" Content="{DynamicResource labTabAccAccountCausalsSign}" Style="{StaticResource styleLabels}"/>

<StackPanel Orientation="Horizontal" Grid.Row="0" Grid.Column="1">

<telerik:RadRadioButton IsChecked="{Binding Causal.Sign, Converter={StaticResource boolToStringConverter}, ConverterParameter=D}" Content="{DynamicResource valGive}" Margin="3" Width="50" />

<telerik:RadRadioButton IsChecked="{Binding Causal.Sign, Converter={StaticResource boolToStringConverter}, ConverterParameter=A}" Content="{DynamicResource valHave}" Margin="3" Width="50"/>

</StackPanel>

<Label Grid.Row="1" Grid.Column="0" Content="{DynamicResource labTabAccAccountCausalsIVABookID}" Style="{StaticResource styleLabels}"/>

<Label Grid.Row="2" Grid.Column="0" Content="{DynamicResource labTabAccAccountCausalsIVASign}" Style="{StaticResource styleLabels}"/>

<StackPanel Orientation="Horizontal" Grid.Row="2" Grid.Column="1">

<telerik:RadRadioButton IsChecked="{Binding Causal.IVASign, Converter={StaticResource boolToStringConverter}, ConverterParameter=+}" Content="{DynamicResource valPlus}" Margin="3" Width="35" />

<telerik:RadRadioButton IsChecked="{Binding Causal.IVASign, Converter={StaticResource boolToStringConverter}, ConverterParameter=-}" Content="{DynamicResource valMinus}" Margin="3" Width="35"/>

</StackPanel>

</Grid>

</telerik:LayoutControlGroup>

<telerik:LayoutControlGroup DisplayMode="Expander" Margin="3" IsExpanded="True" IsExpandable="True" Header="{DynamicResource layTabAccAccountCausalsCounterpart}">

</telerik:LayoutControlGroup>

</telerik:RadLayoutControl>

</Grid>

3 Answers, 1 is accepted

answered on 12 May 2016, 04:56 PM

lay1.png

lay2.png

lay1.png Expanded
lay2.png Collapsed

Accepted

answered on 17 May 2016, 01:37 PM

Hello Aldo,

The described behavior is expected as the LayoutControl draws its elements based-on their Alignment properties. Basically, the VerticalAligment property of the LayoutControlGroup is set to Stretch by default and that is why the group is taking that much space.

Currently the control does not have exposed Expand/Collapsed events and that is why you could use EventManager to achieve the scenario. As a workaround, you can subscribe to the expanded and collapsed event of the RadExpander and depends on if the LayoutControlGroup is collapse or expand set its VerticalAlignment property to Center or Stretch.

public MainWindow()

{

EventManager.RegisterClassHandler(typeof(RadExpander), RadExpander.ExpandedEvent, new RoutedEventHandler(OnExpander));

EventManager.RegisterClassHandler(typeof(RadExpander), RadExpander.CollapsedEvent, new RoutedEventHandler(OnCollapsed));

...

private void OnCollapsed(object sender, RoutedEventArgs e)

{

var expander = sender as RadExpander;

var parentLayoutGroup = expander.ParentOfType<LayoutControlGroup>();

parentLayoutGroup.VerticalAlignment = VerticalAlignment.Center;

}

private void OnExpander(object sender, RoutedEventArgs e)

{

var expander = sender as RadExpander;

var parentLayoutGroup = expander.ParentOfType<LayoutControlGroup>();

parentLayoutGroup.VerticalAlignment = VerticalAlignment.Stretch;

}

I hope this information helps. Please let us know if you need further assistance.

Regards,
Kiril Vandov
Telerik

Do you need help with upgrading your AJAX, WPF or WinForms project? Check the Telerik API Analyzer and share your thoughts.