Dynamic Horizontal List View in xamarin forms - xamarin.forms

Question

I need to integrate the Dynamic horizontal listview in my project. I found this concept below blog on the website. But I confused this code to integrate into my project. Kindly suggest me an idea to anyone. I need this image type grid or horizontal listview( https://i.stack.imgur.com/OvJZE.png).
Mainpage.xaml.cs
public void SetupUserStack()
{
---------- issue in _itemSelectCommand in my code
cButtonList.Add(new CircleButton(_itemSelectCommand)
{ CircleSize = otherCircleSize, CircleFontSize = 35, Text = initials, BackgroundColor = Color.White, TextColor = ourBlue, BorderColor = ourBlue, BorderWidth = 1.5 });
var b2 = new Button() { Text = lname, TextColor = ourBlue };
//otherGrid.Children.Add(LargeCB, 0, 0);
otherGrid.Children.Add(cButtonList[i], 0, 0);
otherGrid.Children.Add(b2, 0, 1);
UserStack.Children.Add(otherGrid);
}
Blog I refer: horizontal-list-view-with-circular-button-styling-in-xamarin-forms

Answer 1

This is the another way to achieve the same thing. Xamarin forms now support the Bindable Layouts
XAML Code:
<ScrollView
Orientation="Horizontal"
HorizontalScrollBarVisibility="Default">
<StackLayout Margin="20,0,20,0"
Orientation="Horizontal"
BindableLayout.ItemsSource="{Binding LogoImages}">
<BindableLayout.ItemTemplate>
<DataTemplate>
<Image
HeightRequest="25"
Margin="0,0,5,0"
Source="{Binding logoImage}">
</Image>
</DataTemplate>
</BindableLayout.ItemTemplate>
</StackLayout>
</ScrollView>
Here is more information with the example :
Bindable Layouts

Answer 2

Use a collectionView to create a horizontal-list would be easier and faster, for example:
<CollectionView ItemsSource="{Binding Monkeys}"
ItemsLayout="HorizontalList">
<CollectionView.ItemTemplate>
<DataTemplate>
<Grid Padding="10">
<Grid.RowDefinitions>
<RowDefinition Height="35" />
<RowDefinition Height="35" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="70" />
<ColumnDefinition Width="140" />
</Grid.ColumnDefinitions>
<Image Grid.RowSpan="2"
Source="{Binding ImageUrl}"
Aspect="AspectFill"
HeightRequest="60"
WidthRequest="60" />
<Label Grid.Column="1"
Text="{Binding Name}"
FontAttributes="Bold"
LineBreakMode="TailTruncation" />
//...your layout
</Grid>
</DataTemplate>
</CollectionView.ItemTemplate>
</CollectionView>
The Monkeys should be a list that in your ViewModel.
You can check the sample with MVVM structure here:collectionviewdemos
In your linking blog, he creates the grid dynamically with the users.Count and I think it hard to integrate his code to MVVM structure.