Xamarin.forms: CarouselView : The type initializer for 'Xamarin.Forms.ItemsView' threw an exception

[MuziburRahman]

Description

When trying to use a CasrouselView in the AboutPage.xaml of the default template of a simple Xamarin.Forms app, this error says that there is something wrong.

Steps to Reproduce

1. Create a Master-Detail templated project keeping iOS unselected 👍
   

2. in the AboutPage.xaml, insert a third ROwDefinition below the existing two definitions:

<Grid.RowDefinitions>
     <RowDefinition Height="Auto" />
     <RowDefinition Height="*" />
     <RowDefinition Height="Auto" /> <!-- this is the new row definition-->
</Grid.RowDefinitions>

1. Add a new class TestDataType in AboutViewModel.cs :

public class TestDataType
{
    public string Name { get; set; }
    public int ID { get; set; }
}

and declare a list of TestDataType in AboutViewModel :

public List<TestDataType> DataSource;

public AboutViewModel()
{
    Title = "About";

    DataSource = new List<TestDataType>
    {
        new TestDataType{Name = "name1", ID = 1} ,
        new TestDataType{Name = "name2", ID = 2}
    };

    OpenWebCommand = new Command(() => Device.OpenUri(new Uri("https://xamarin.com/platform")));
}

1. Now use this list as an ItemsSource for a CarouselView in AboutPage.xaml which will fill the 3rd row we have inserted earlier:

<CarouselView
    x:Name="TestCarousel"
    Grid.Row="2"
    ItemsSource="{Binding DataSource}">
    <CarouselView.ItemTemplate>
        <DataTemplate x:DataType="vm:TestDataType">
            <StackLayout 
                Orientation="Vertical">
                <Label Text="{Binding Name}"/>
                <Label Text="{Binding ID}" HorizontalOptions="Center"/>
            </StackLayout>
        </DataTemplate>
    </CarouselView.ItemTemplate>
</CarouselView>

so the AboutPage.xaml now looks like this:

1. now build and run the app in an android phone to get the error

Basic Information

• Version with issue: Xamarin.Forms 4.0.0.62955-pre2
• IDE: Visual Studio 2019 preview 2
• Platform Target Frameworks:
  
  
  
  • Android: Android 8.1 (Oreo)
  
  
• Android depoly target: Lollipop (Android 5.1 API 22)

[samhouts]

@MuziburRahman Did you enable the CollectionView_Experimental flag? See https://docs.microsoft.com/en-us/xamarin/xamarin-forms/release-notes/4.0/4.0.0-pre4

[MuziburRahman]

@samhouts thanks. That removed the exception. But the android designer still shows the exception and doesn't render the view

[MuziburRahman]

and the app doesn't show any label, what more is wrong with my code? @samhouts

[arif-imran]

@MuziburRahman I am in the same situation i can't see any UI content in my app which is binded to the CollectionView in my case

[MuziburRahman]

@arif-imran my problem was solved when I used
public List<TestDataType> DataSource { get; set };
instead of
public List<TestDataType> DataSource;
that is, changed the field to a property.

[MeikandaNayanar]

I had the same issue and now it is resolved with the last update by 'MuziburRahman commented on Feb 24'. Will this be resolved in upcoming releases?

[arif-imran]

Enabling CollectionView_Experimental flag, worked for me (May be in the future when collection view is shipped in the stable release we might not need to add the experimental flags.). Only a Property can be bound to any data bindable control, so we must only use them and not fields.