Hide column or row when content is not visible
Asked Answered
P

1

12

I have an XAML Grid with columns and I would like to hide or collapse the column when the content is not visible.

Example: I have this layout:

<Grid >      
    <Button Grid.Column="0" x:Name="FirstButton"  Text="First button" />      
    <Button Grid.Column="1"x:Name="SecondButton"  Text="Second button" />
</Grid>

When FirstButton is not visible I want this result

  <Grid >      
    <Button Grid.Column="1"x:Name="SecondButton"  Text="Second button" />
</Grid>
Putnam answered 10/4, 2017 at 12:33 Comment(0)
P
17

Answering myself :

  <Grid>      
      <Grid.ColumnDefinitions>
        <ColumnDefinition Width="{Binding Path=IsVisible, Converter={StaticResource IsVisibleToGridLength}" BindingContext="{x:Reference FirstButton}"   />
        <ColumnDefinition Width="{Binding Path=IsVisible, Converter={StaticResource IsVisibleToGridLength}" BindingContext="{x:Reference SecondButton}" />
  </Grid.ColumnDefinitions>
        
  <Button Grid.Column="0" x:Name="FirstButton"  Text="First button" />      
  <Button Grid.Column="1"x:Name="SecondButton"  Text="Second button" />
</Grid>

And for the converter part

class IsVisibleToGridLengthConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, CultureInfo language)
    {
        try
        {
            GridUnitType t = GridUnitType.Star;
            if (parameter != null)
            {
                Enum.TryParse<GridUnitType>((string)parameter, true, out t);                    
            }

            if (value != null)
            {
                bool d = (bool)value;
                return d == false ? new GridLength(0,GridUnitType.Absolute) : new GridLength(1, t);
            }
            return null;
        }
        catch (Exception exp)
        {                
            return null;
        }
    }
    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo language)
    {
        return null;
    }
}

And Obviously the App.xml part

<Application  x:Class="MyNameSpace.App"
xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:class="clr-namespace:MyNameSpace.Class;assembly=MyNameSpace"/>
<Application.Resources>
  <ResourceDictionary>     
    <class:IsVisibleToGridLengthConverter  x:Key="IsVisibleToGridLength"/>   
  </ResourceDictionary>
</Application.Resources>
</Application>

Hope it helps !!

Putnam answered 10/4, 2017 at 12:36 Comment(1)
If you're getting: "System Exception cannot resolve Name on Element" Reason: BindingContext="{x:Reference Firstbutton}" "Firstbutton" needs to be "FirstButton" to match the appropriate x:Name.Soulier

© 2022 - 2024 — McMap. All rights reserved.