Objects in Binding not displayed in the ListView

Question

I have a ListView with items in Binding via the ItemsSource property. I cannot understand why the DataTemplate data is not displayed. They are still downloaded correctly from the internet but are not displayed. I've tried both inserting the ItemsSource property from c # and xaml, but the result doesn't change

xaml

<yummy:PancakeView x:Name="ViewFrasi" IsVisible="False" Grid.Row="1" CornerRadius="30,30,0,0" BackgroundColor="White" VerticalOptions="FillAndExpand">
        <yummy:PancakeView.Border>
            <yummy:Border Color="Blue" Thickness="4"/>
        </yummy:PancakeView.Border>
        <Grid Margin="15">
            <ListView x:Name="Frasi"
                      ItemsSource="{Binding FrasiJsonOnline1}">
                <ListView.Header>
                    <Grid>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="40"/>
                        </Grid.RowDefinitions>
                        <BoxView CornerRadius="100" Grid.Row="0" HorizontalOptions="End" WidthRequest="40">
                            <BoxView.Background>
                                <LinearGradientBrush  StartPoint="1,0" EndPoint="1,1">
                                    <GradientStop Color="Blue" Offset="0" />
                                    <GradientStop Color="LightBlue" Offset="1.0" />
                                </LinearGradientBrush>
                            </BoxView.Background>
                        </BoxView>
                        <Image Source="checked.png" Grid.Row="0" HorizontalOptions="End" HeightRequest="20" Margin="0,0,10,0"/>
                        <Button x:Name="BtSave" IsVisible="False" Clicked="BtSave_Clicked" BackgroundColor="Transparent" Grid.Row="0" HorizontalOptions="End" HeightRequest="25"/>
                        <ImageButton Source="close.png" Grid.Row="0" HorizontalOptions="Start" HeightRequest="20" Margin="5,0,0,0" Clicked="Close_Clicked" BackgroundColor="Transparent"/>
                    </Grid>
                </ListView.Header>
                <ListView.ItemTemplate>
                    <DataTemplate>
                        <Grid>
                            <ScrollView>
                                <Grid>
                                    <Grid.RowDefinitions>
                                        <RowDefinition Height="50"/>
                                    </Grid.RowDefinitions>
                                    <Grid.ColumnDefinitions>
                                        <ColumnDefinition Width="1*"/>
                                        <ColumnDefinition Width="5*"/>
                                    </Grid.ColumnDefinitions>
                                    <ImageButton Grid.Row="0" Grid.Column="0" Source="IconCopy.png" Clicked="CopyClipboard_Clicked"/>
                                    <Label Grid.Row="0" Grid.Column="1" Text="Test" TextColor="Black" FontSize="15"/>
                                </Grid>
                            </ScrollView>
                        </Grid>
                    </DataTemplate>
                </ListView.ItemTemplate>
            </ListView>

        </Grid>
    </yummy:PancakeView>

c#

private async void CategoryView_SelectionChanged(object sender, SelectionChangedEventArgs e)
    {
        var selected = e.CurrentSelection;         
        ClassCategory model = e.CurrentSelection.FirstOrDefault() as ClassCategory;

        WebClient clientw = new WebClient();
        clientw.Credentials = new NetworkCredential("xxxxxxx", "xxxxxx");
        string Frasi1 = "ftp://epiz_27426656@ftpupload.net/htdocs/" + model.Titolo + ".json";
        string contents1 = await clientw.DownloadStringTaskAsync(Frasi1);
        ObservableCollection<FraseClass> FrasiJsonOnline1 = JsonConvert.DeserializeObject<ObservableCollection<FraseClass>>(contents1);

        ViewFrasi.IsVisible = true;
        ViewFrasi.TranslationY = 600;
        ViewFrasi.TranslateTo(0, 0, 500, Easing.SinInOut);

    }

Answer 1

When you bind the ListView's ItemsSource to FrasiJsonOnline1.

That means you are binding to the BindingContext.FrasiJsonOnline1.

 ItemsSource="{Binding BindingContext.FrasiJsonOnline1}".

So FrasiJsonOnline1 should be a property of your BindingContext. For example, if you BindingContext is myViewModel, FrasiJsonOnline1 should be a property of myViewModel, then the binding will success:

public partial class MainPage : ContentPage
{
    public MainPage()
    {
        InitializeComponent();

        BindingContext = new myViewModel();
    }
}

public class myViewModel
{
    public ObservableCollection<FraseClass> FrasiJsonOnline1 { get; set; }

    public myViewModel()
    {
        FrasiJsonOnline1 = new ObservableCollection<FraseClass>();
        //...your codes
    }
}

If you define the FrasiJsonOnline1 like the way you do:

public class myViewModel
{
    public myViewModel()
    {

    }

    private async void CategoryView_SelectionChanged(object sender, SelectionChangedEventArgs e)
    {
        ObservableCollection<FraseClass> FrasiJsonOnline1 = JsonConvert.DeserializeObject<ObservableCollection<FraseClass>>(contents1);
    }
}

FrasiJsonOnline1 is defined inside the method and it is a local variable. The BindingContext(myViewModel) does not have a property called FrasiJsonOnline1 and the binding won't work.

Answer 2

You are using a local variable, make it a public property outside the method and change its value inside the method as shown here:

public ObservableCollection<FraseClass> FrasiJsonOnline1 { get; set; }

private async void CategoryView_SelectionChanged(object sender, SelectionChangedEventArgs e)
    {
        var selected = e.CurrentSelection;         
        ClassCategory model = e.CurrentSelection.FirstOrDefault() as ClassCategory;

        WebClient clientw = new WebClient();
        clientw.Credentials = new NetworkCredential("xxxxxxx", "xxxxxx");
        string Frasi1 = "ftp://epiz_27426656@ftpupload.net/htdocs/" + model.Titolo + ".json";
        string contents1 = await clientw.DownloadStringTaskAsync(Frasi1);
        FrasiJsonOnline1 = JsonConvert.DeserializeObject<ObservableCollection<FraseClass>>(contents1);

        ViewFrasi.IsVisible = true;
        ViewFrasi.TranslationY = 600;
        ViewFrasi.TranslateTo(0, 0, 500, Easing.SinInOut);

    }