Expander doesn't collapse

4 posts, 1 answers
  1. Aldo
    Aldo avatar
    39 posts
    Member since:
    Feb 2011

    Posted 12 May Link to this post

    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"/>
                                <RowDefinition Height="40"/>
                                <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}">
                            <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.CustomersUse}" Content="{DynamicResource labTabAccAccountCausalsCustomersUse}" Validation.ErrorTemplate="{StaticResource ErrorTemplate}"></CheckBox>
                    </telerik:LayoutControlGroup>
                </telerik:RadLayoutControl>
            </Grid>

  2. Aldo
    Aldo avatar
    39 posts
    Member since:
    Feb 2011

    Posted 12 May in reply to Aldo Link to this post

    lay1.png Expanded
    lay2.png Collapsed
  3. UI for WPF is Visual Studio 2017 Ready
  4. Answer
    Kiril Vandov
    Admin
    Kiril Vandov avatar
    324 posts

    Posted 17 May Link to this post

    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.
  5. Aldo
    Aldo avatar
    39 posts
    Member since:
    Feb 2011

    Posted 18 May in reply to Kiril Vandov Link to this post

    Thank you, I need it in XAML only, so changing LayoutControl VerticalAlignment to Top and LayoutControlGroup VerticalAlignment to Center works fine.

    Thanks a lot
    Regards
Back to Top