SfListview

[Yogita]

Hi ,

please help me to bind the itemsource the string type list. I Used directly but it take extra space. so please help me to bind string type of list with fit proper content.

Regards,

Yogita Magdum

 

[Lakshmi Natarajan]

Hi Yogita, 

 

Thank you for using Syncfusion products. 

 

We have checked the reported query “bind the itemsource the string type list” from our side. We would like to inform you that you can bind the list of strings to the SfListView by binding the list to the SfListView.ItemsSource property. 

 

Please refer to the following code snippets to achieve your requirement, 

 

ViewModel: Populate items for the list. 

public class ContactsViewModel : INotifyPropertyChanged 

{ 

    public List<string> ContactsInfo { get; set; } 

 

    public ContactsViewModel() 

    { 

        ContactsInfo = new List<string>(); 

        GenerateInfo(); 

    } 

 

    public void GenerateInfo() 

    { 

        ContactsInfo = CustomerNames.ToList(); 

    } 

 

    string[] CustomerNames = new string[] { 

        "Kyle", 

        "Gina", 

        "Irene", 

        "Katie", 

        ... 

    }; 

} 

 

XAML: Bind the list to the ItemsSource property. 

<syncfusion:SfListView x:Name="listView" ItemsSource="{Binding ContactsInfo}"> 

    <syncfusion:SfListView.ItemTemplate > 

        <DataTemplate> 

            <Grid x:Name="grid"> 

                <Label LineBreakMode="NoWrap" TextColor="#474747" Text="{Binding .}"/> 

            </Grid> 

        </DataTemplate> 

    </syncfusion:SfListView.ItemTemplate> 

</syncfusion:SfListView> 

 

Please refer to our user guidance document to bind ItemsSource in SfListView from the following link, 

UG link: https://help.syncfusion.com/xamarin/listview/getting-started#binding-data-to-the-sflistview 

 

The SfListView allows you to populate list in the XAML as mentioned below, 

<ContentPage xmlns=http://xamarin.com/schemas/2014/forms 

             xmlns:x=http://schemas.microsoft.com/winfx/2009/xaml 

             xmlns:local="clr-namespace:ListViewXamarin" 

             xmlns:syncfusion="clr-namespace:Syncfusion.ListView.XForms;assembly=Syncfusion.SfListView.XForms" 

             xmlns:ListCollection="clr-namespace:System.Collections.Generic;assembly=netstandard" 

             x:Class="ListViewXamarin.MainPage"> 

 

             <ContentPage.Content> 

        <StackLayout> 

            <syncfusion:SfListView> 

                <syncfusion:SfListView.ItemsSource> 

                    <ListCollection:List x:TypeArguments="x:String"> 

                        <x:String>Item 1</x:String> 

                        <x:String>Item 2</x:String> 

                        <x:String>Item 3</x:String> 

                        <x:String>Item 4</x:String> 

                        <x:String>Item 5</x:String> 

                        <x:String>Item 6</x:String> 

                        <x:String>Item 7</x:String> 

                        <x:String>Item 8</x:String> 

                        <x:String>Item 9</x:String> 

                        <x:String>Item 10</x:String> 

                    </ListCollection:List> 

                </syncfusion:SfListView.ItemsSource> 

                <syncfusion:SfListView.ItemTemplate > 

                    <DataTemplate> 

                        <Grid x:Name="grid"> 

                            <Label LineBreakMode="NoWrap" TextColor="#474747" Text="{Binding .}"/> 

                        </Grid> 

                    </DataTemplate> 

                </syncfusion:SfListView.ItemTemplate> 

            </syncfusion:SfListView> 

        </StackLayout> 

    </ContentPage.Content> 

</ContentPage> 

 

Note: The SfListView is completely developed with UI Virtualization(Item recycling) concept and it only creates the element only which are in view on initial loading. While scrolling, we have cache the created elements and recycled it by updating only the BindingContext of the SfListView item. So, we suggest you to bind ItemTemplate for SfListView. 

 

Please refer to the following documentation regarding the same, 

UG link: https://help.syncfusion.com/xamarin/listview/getting-started#defining-an-itemtemplate 

 

Also, you can skip the UI virtualization by using the SfListView.ListViewCachingStratedy as CreateNewTemplate. Please refer to our documentation regarding the same, 

UG link: https://help.syncfusion.com/xamarin/listview/scrolling#how-to-handle-the-recycle-of-the-listview-items 

 

Please find the sample for the same from the following link, 

Sample: https://www.syncfusion.com/downloads/support/forum/167105/ze/ListViewXamarin324970217 

 

#Regarding I Used directly but it take extra space 

We would like to inform you that the default ItemSize for the ListViewItem is 40d. Also, you can customize the item size by using the following ways, 

 

API	Description
ItemSize	The SfListView allows customizing the size of items by setting the ItemSize property. This property can be customized at runtime.    UG link: https://help.syncfusion.com/xamarin/listview/viewappearance#item-size
AutoFitMode	The SfListView allows dynamically adjusting size of items based on the content loaded in the SfListView.ItemTemplate by defining the SfListView.AutoFitMode property.    The control contains the following three types of AutoFitMode:    Height: AutoFit the items based on the content.  DynamicHeight: AutoFit the items based on the content if size of the content is changed at run time.  None: The SfListView items are layout by SfListView.ItemSize.    UG link: https://help.syncfusion.com/xamarin/listview/item-size-customization#autofit-the-items-based-on-the-content
QueryItemSize	The SfListView allows customizing the size of the item on-demand by the QueryItemSize event using the item index.    UG link: https://help.syncfusion.com/xamarin/listview/item-size-customization#customize-item-size-of-a-particular-item-on-demand

 

Please let us know if you need further assistance. 

 

Regards, 

Lakshmi Natarajan