How to hide a Grid row and ListView column so that no empty space is visible?

Question

I have two issues with Xamarin Grid and ListView.

(1) In ListView, I have seven columns. Based on a condition, the fifth and sixth columns need to be hidden in such a way that there is no blank space visible after forth column. I tried to set IsVisble=false but it shows blank space in between.

(2) Similar issue is with Grid. Inside a ContentView, I have Grid with ten rows. Based on certain condition, I want to hide rows seven and eight in such a way that the empty portion should get collapsed. User should not be able to view the empty row.

If from code-behind I try removing rows using the below code, I suspect the .XAML may crash as row numbers need to be reordered.

GridView gv = listview.View as GridView;
GridViewColumn cd = gv.Columns[0];
gv.Columns.Remove(cd);
gv.Columns.Add(cd);

Answer 1

For the grid problem, just be sure to use Binding to set the RowHeight dynamically. So as soon as you want to hide those rows, you set the height to 0.

Code would look like this:

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:Test"
             x:Class="Test.MainPage">
    <StackLayout Margin="0,20,0,0">
        <Grid RowSpacing="0" VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand">
            <Grid.RowDefinitions>
                <RowDefinition Height="50" />
                <RowDefinition Height="{Binding RowHeight}" />
                <RowDefinition Height="{Binding RowHeight}" />
                <RowDefinition Height="50" />
                <RowDefinition Height="50" />
            </Grid.RowDefinitions>

            <Label Text="Row 1" Grid.Row="0" HorizontalTextAlignment="Center" />
            <Label Text="Row 2" Grid.Row="1" HorizontalTextAlignment="Center" />
            <Label Text="Row 3" Grid.Row="2" HorizontalTextAlignment="Center" />
            <Label Text="Row 4" Grid.Row="3" HorizontalTextAlignment="Center" />
            <Label Text="Row 5" Grid.Row="4" HorizontalTextAlignment="Center" />
        </Grid>

        <Button Text="Hide rows" Clicked="OnClicked" />
    </StackLayout>
</ContentPage>

public partial class MainPage : ContentPage, INotifyPropertyChanged
{
    private int _rowHeight = 50;
    public int RowHeight
    {
        get => _rowHeight;
        set
        {
            _rowHeight = value;
            OnPropertyChanged();
        }
    }

    public MainPage()
    {
        InitializeComponent();
        BindingContext = this;
    }

    private void OnClicked(object sender, System.EventArgs e)
    {
        RowHeight = 0;
    }
}

Answer 2

You can set the row Height to Auto and then bind the IsVisible property of the content you want to hide.