DataTrigger for a Grid based on a Child

Question

Hi,

In below code, How can I make a Grid's DataTrigger to set the Grid's HeightRequest to ZERO when the zeera_post_age is NULL or EMPTY?

<Grid Grid.Row="5" ColumnSpacing="0" RowSpacing="0">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="Auto" />
        <ColumnDefinition Width="*" />
    </Grid.ColumnDefinitions>

    <Label Grid.Column="0" Margin="5" Text="Age : " TextColor="Red" VerticalOptions="Center" />
    <Label Grid.Column="1" Margin="5" Text="{Binding post_age}" VerticalOptions="Center" />
</Grid>

Thanks,
Jassim

Answer 1

Hi JassimAlRahma-9056,

Welcome to our Microsoft Q&A platform!

About how to use DataTrigger in Xamarin, you can refer to the document: Xamarin.Forms Triggers.

If you want to hide the Grid when post_age is NULL or EMPTY, set Grid's "IsVisible" property to "false" will be a better choice.

The following is a simple demo.

MainPage.xaml

<ContentPage.BindingContext>  
    <loacl:MainPageViewModel/>  
</ContentPage.BindingContext>  
  
<StackLayout>  
    <Entry x:Name="entry"  
            Text="{Binding Post_age}"  
            Placeholder="required field" />  
  
    <Grid Grid.Row="5" ColumnSpacing="0" RowSpacing="0">  
        <Grid.ColumnDefinitions>  
            <ColumnDefinition Width="Auto" />  
            <ColumnDefinition Width="*" />  
        </Grid.ColumnDefinitions>  
  
        <Grid.Triggers>  
            <DataTrigger TargetType="Grid"  
                    Binding="{Binding Source={x:Reference postAgeLabel},  
                                    Path=Text.Length}"  
                    Value="0">  
                <Setter Property="IsVisible" Value="False" />  
            </DataTrigger>  
        </Grid.Triggers>  
  
        <Label Grid.Column="0" Margin="5" Text="Age : " TextColor="Red" VerticalOptions="Center" />  
        <Label Grid.Column="1" Margin="5" x:Name="postAgeLabel" Text="{Binding Post_age}" VerticalOptions="Center" />  
    </Grid>  
</StackLayout>  

MainPageViewModel.cs

class MainPageViewModel : INotifyPropertyChanged  
{  
    public MainPageViewModel()  
    {  
        Post_age = "12";  
    }  
  
    string post_age;  
    public string Post_age  
    {  
        get => post_age;  
        set  
        {  
            if (value == null)  
                return;  
            post_age = value;  
            OnPropertyChanged("Post_age");  
        }  
    }  
  
    public event PropertyChangedEventHandler PropertyChanged;  
  
    protected void OnPropertyChanged(string propertyName)  
    {  
        var handler = PropertyChanged;  
        if (handler != null)  
            handler(this, new PropertyChangedEventArgs(propertyName));  
    }  
}  

Regards,
Kyle

---

If the response is helpful, please click "Accept Answer" and upvote it.

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.