How do I set a proportional value for row height in a listView so it occupies the entire screen?

Viewed 87

I need the items in my listView to have a height so it the list exactly fits the screen. Here's my code given below. I tried setting the Height of rows in my grid to a custom value, but that would work well, fitting the screen in some devices, while there would be an empty space in other devices due to a different screen size.

       <ListView  
              ItemsSource="{Binding PenStocks}"
              ItemSelected="Event_ItemSelected"
              ItemTapped="Event_ItemTapped"
              SeparatorVisibility="None"
              Margin="5,5,5,0"
              >
    <ListView.ItemTemplate>
        <DataTemplate>
            <ViewCell>
                <Grid Padding="9" ColumnSpacing="0" RowSpacing="0" HorizontalOptions="FillAndExpand" >
                    <Grid.RowDefinitions>
                        <RowDefinition Height="*"/>
                    </Grid.RowDefinitions>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="0.408*"/>
                        <ColumnDefinition Width="0.051*"/>
                        <ColumnDefinition Width="0.252*"/>
                        <ColumnDefinition Width="0.033*"/>
                        <ColumnDefinition Width="0.153*"/>
                        <ColumnDefinition Width="0.102*"/>
                    </Grid.ColumnDefinitions>

What can I do for this? Please help me and thank you!

3 Answers

EDIT: Rewrote this to use a bindablelayout.

View:

 <StackLayout x:Name="ParentFlexLayout" BindableLayout.ItemsSource="{Binding Colors}" HorizontalOptions="FillAndExpand" >
    <BindableLayout.ItemTemplate>
        <DataTemplate>
            <Frame BackgroundColor="{Binding .}" VerticalOptions="FillAndExpand"/>
        </DataTemplate>
    </BindableLayout.ItemTemplate>
</StackLayout>

Here we use a bindablelayout - it's very flexible, so you could give it at go and see it it meets your needs

Codebehind:

  public ObservableCollection<Color> Colors { get; set; } = new ObservableCollection<Color>();
    public MainPage()
    {
        InitializeComponent();
        BindingContext = this;
        Colors.Add(Color.Blue);
        Colors.Add(Color.Red);
        Colors.Add(Color.Green);
        Colors.Add(Color.Yellow);
    }

Result: enter image description here

I tried using an absolutelayout within the viewcell, but when I do, it doesn't work either.

                               <AbsoluteLayout AbsoluteLayout.LayoutBounds="0,0,1,0.167" AbsoluteLayout.LayoutFlags="All">
Related