xamarin.forms.listview

removing empty space of listview in xamarin forms


I am using xamarin.forms listview for my project. The design is below:

<ContentView x:Name="Overlay" IsVisible="False"
                         VerticalOptions="Center" HorizontalOptions="Center" Margin="10,20,10,30"
                         AbsoluteLayout.LayoutBounds="0,0,1,1" AbsoluteLayout.LayoutFlags="All" BackgroundColor="LightGray">
                <StackLayout Spacing="0">
                    <StackLayout Padding="20" BackgroundColor="#9C6114" Spacing="0">
                        <Label Text="Country Name" TextColor="White" FontAttributes="Bold" HorizontalTextAlignment="Center" VerticalTextAlignment="Center"></Label>
                    </StackLayout>
                    <StackLayout Spacing="0">
                <ListView x:Name="CountryList" HasUnevenRows="True" Margin="10,0,0,0">
                    <ListView.ItemTemplate>
                        <DataTemplate>
                            <ViewCell>
                                <StackLayout Orientation="Horizontal">
                                    <Switch IsToggled="{Binding IsToggle}"></Switch>
                                    <Label Text="{Binding CountryName}"></Label>
                                </StackLayout>
                            </ViewCell>
                        </DataTemplate>
                    </ListView.ItemTemplate>
                        <ListView.Footer>
                            <StackLayout Orientation="Horizontal">
                                <Button x:Name="btncancel" Text="Cancel" TextColor="White" BackgroundColor="#9C6114" HorizontalOptions="CenterAndExpand" Clicked="btncancel_Clicked"></Button>
                                <Button x:Name="btnsubmit" Text="Submit" TextColor="White" BackgroundColor="#9C6114" HorizontalOptions="CenterAndExpand" Clicked="btnsubmit_Clicked"></Button>
                            </StackLayout>            
                        </ListView.Footer>
                </ListView>
                    </StackLayout>
                </StackLayout>
            </ContentView>

For this listview, there is emplty space below the listview. I cannot remove the extra spaces in listview. Please see the attached image.enter image description here

Please help me to resolve this issues.


Solution

  • I had a problem that was similar to that. I followed this link: https://xamarinsharp.com/2017/05/20/xamarin-forms-listview-height-change-dynamically-using-mvvm-and-also-solve-empty-space-issue/

    Basically, if you didn't already, you'll need to set up your project with MVVM. In your XAML you'll have to give a HeighRequest property to your listview and set it's value as: HeighRequest="{Binding Height}". In your viewmodel, add this:

    int _height;

    public int Height

        {
            get { return _height; }
            set
            {
                _height = value;
                OnPropertyChanged("Height");
            }
        }
    

    Then, in your viewModel's constructor (or wherever you set up your listview's objects), add this:

            Height = (**object**.Count * 60) + (**object**.Count * 10);
    

    This worked just fine for me!