Frame inside SfListView is not displaying contents

[Vance]

Can anyone explain to me why the contents of my Frame are not displayed inside of a SfListView? I just get white boxes (see image).

Thanks!

<?xml version="1.0" encoding="utf-8" ?>

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

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

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

x:Class="Prayer.Mobile.Pages.TestPage"

Title="Test Page">

<ContentPage.Content>

<syncfusion:SfListView SelectionMode="Single" ItemsSource="{Binding Items}">

<syncfusion:SfListView.ItemTemplate>

<DataTemplate>

<Frame CornerRadius="10" OutlineColor="Blue" VerticalOptions="CenterAndExpand">

<!--<Label Text="{Binding .}" />-->

<Label Text="Testing" />

</Frame>

</DataTemplate>

</syncfusion:SfListView.ItemTemplate>

</syncfusion:SfListView>

</ContentPage.Content>

</ContentPage>

using System;

using System.Collections.Generic;

using System.Linq;

using System.Text;

using System.Threading.Tasks;

using Xamarin.Forms;

using Xamarin.Forms.Xaml;

namespace Prayer.Mobile.Pages

{

[XamlCompilation(XamlCompilationOptions.Compile)]

public partial class TestPage : ContentPage

{

public class TestPageModel

{

public List<String> Items { get; set; }

}

public TestPage()

{

TestPageModel model = new TestPageModel();

model.Items = new List<string> { "One", "Two", "Three" };

BindingContext = model;

InitializeComponent();

}

}

}

[Dinesh Babu Yadav]

Hi Vance, 

 

Thanks for using Syncfusion support. 

 

We have checked the reported query from our side. We would like to let you know that ListViewItem loads properly in view initially and also while scrolling. We have attached the working sample for  your reference, please find the sample from below. From the given code snippet, we suspect that reported issue might occurs because of BindingContext which is not defined to SfListView in content page. 

 

Please refer our documentation for your reference. 

 

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

 

Sample Link : http://www.syncfusion.com/downloads/support/forum/144307/ze/SfListViewSample-33526046  

 

Video Link : http://www.syncfusion.com/downloads/support/forum/144307/ze/Sflistview_Frame-1330527559  

 

Please let us know if you need any further assistance. 

 

Regards, 

Dinesh Babu Yadav 

 

[Vance]

Thank you for your reply, but I do not think that is the issue. I have updated the XAML to define the BindingContext (as suggested) with no effect. Here is the latest version. It is an EXTREMELY simple example and I must be missing something basic as I have tried dozens of suggestions from other people for whom this works.

Please try this code and see what happens for you.

<?xml version="1.0" encoding="utf-8" ?>

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

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

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

x:Class="Prayer.Mobile.Pages.TestPage"

xmlns:local="clr-namespace:Prayer.Mobile.Pages"

Title="Test Page">

<ContentPage.BindingContext>

<local:TestPageModel />

</ContentPage.BindingContext>

<ContentPage.Content>

<syncfusion:SfListView SelectionMode="Single" ItemsSource="{Binding Items}">

<syncfusion:SfListView.ItemTemplate>

<DataTemplate>

<Frame CornerRadius="10" OutlineColor="Blue" VerticalOptions="CenterAndExpand">

<!--<Label Text="{Binding .}" />-->

<Label Text="Testing" />

</Frame>

</DataTemplate>

</syncfusion:SfListView.ItemTemplate>

</syncfusion:SfListView>

</ContentPage.Content>

</ContentPage>

using System;

using System.Collections.Generic;

using System.Collections.ObjectModel;

using System.Linq;

using System.Text;

using System.Threading.Tasks;

using Xamarin.Forms;

using Xamarin.Forms.Xaml;

namespace Prayer.Mobile.Pages

{

public class TestPageModel

{

public TestPageModel()

{

Items = new ObservableCollection<string> { "One", "Two", "Three" };

}

public ObservableCollection<String> Items { get; set; }

}

[XamlCompilation(XamlCompilationOptions.Compile)]

public partial class TestPage : ContentPage

{

public TestPage()

{

InitializeComponent();

}

}

}

[Dinesh Babu Yadav]

Hi Vance, 

 

We have checked the issue with the given template by you. Label text is not shown when simply load label inside the frame until Padding is defined. Since, we have ensured these with Xamarin.Forms.ListView too. So, you can achieve your requirement by set padding to the frame like below code snippet. 

 

Code Example : XAML 

<sync:SfListView x:Name="listView" SelectionMode="Single" ItemsSource="{Binding Items}"> 

    <sync:SfListView.ItemTemplate> 

        <DataTemplate> 

            <Frame Padding="2" CornerRadius="10" OutlineColor="Blue" VerticalOptions="CenterAndExpand"> 

                <Label Text="{Binding Title}" /> 

            </Frame> 

        </DataTemplate> 

    </sync:SfListView.ItemTemplate> 

</sync:SfListView> 

 

Please let us know if you require further assistance on this. 

 

Regards, 

Dinesh Babu Yadav. 

 

[Vance]

THANK YOU!  The Padding was the magical missing piece to the puzzle.  My page looks much better now.  :)

[Dinesh Babu Yadav]

Hi Vance, 

 

Thanks for the update. Please let us know if you require further assistance. 

 

Regards, 

Dinesh Babu Yadav