I am engaged on a .NET MAUI utility the place I am making an attempt to show an inventory of photos in a CollectionView
. Regardless of following the documentation, my photos usually are not being displayed. Right here is the code for my MainPage.xaml
and MainPage.xaml.cs
.
MainPage.xaml:
<?xml model="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="Maui.NFT.Market.MainPage">
<ContentPage.Sources>
<DataTemplate x:Key="ImageTemplate">
<Picture Supply="{Binding .}"
Side="AspectFit"
HorizontalOptions="Fill"
WidthRequest="137"
HeightRequest="137">
<Picture.Clip>
<RoundRectangleGeometry
Rect="0,0,137,137"
CornerRadius="16" />
</Picture.Clip>
</Picture>
</DataTemplate>
<Type TargetType="CollectionView">
<Setter Property="ItemTemplate" Worth="{StaticResource ImageTemplate}"/>
<Setter Property="ItemsLayout">
<LinearItemsLayout
Orientation="Horizontal"
ItemSpacing="14"/>
</Setter>
</Type>
</ContentPage.Sources>
<Grid>
<CollectionView ItemsSource="{Binding ImageList}"/>
</Grid>
</ContentPage>
MainPage.xaml.cs:
namespace Maui.NFT.Market
{
public partial class MainPage : ContentPage
{
public Record<string> ImageList { get; set; }
public MainPage()
{
InitializeComponent();
GenerateData();
BindingContext = this;
}
personal void GenerateData()
{
ImageList = new Record<string>();
for (var i = 1; i <= 18; i++)
{
ImageList.Add($"ima{i.ToString("00")}.png");
}
}
}
}
Mission Construction:
- The pictures
ima01.png
toima18.png
are within the rootResourcesImages
folder. - Every picture file’s
Construct Motion
is ready toContent material
, andCopy to Output Listing
is ready toCopy if newer
.
Difficulty:
The CollectionView
shows the proper variety of gadgets (18), however no photos are proven. As an alternative, I get empty areas the place the photographs ought to be. I verified that the BindingContext
is ready accurately and the record of picture paths is populated as anticipated.
What I’ve Tried:
- Verified the picture recordsdata are accurately included within the undertaking and set with the proper properties.
- Checked the output listing to make sure the photographs are being copied.
- Simplified the XAML and code-behind to concentrate on displaying a single
CollectionView
. - Confirmed there aren’t any errors or warnings within the output console.
Query:
What could possibly be inflicting the photographs to not show within the CollectionView
, and the way can I resolve this concern?
Checked Picture Inclusion in Mission:
Ensured the picture recordsdata are included within the undertaking.
Set the Construct Motion of the photographs to Content material and Copy to Output Listing to Copy if newer.
Verified Output Listing:
After constructing the undertaking, confirmed that the photographs are current within the output listing.
Simplified XAML and C# Code:
Created a simplified model of MainPage.xaml and MainPage.xaml.cs to concentrate on displaying a single CollectionView.
Checked Output Console:
Confirmed that there aren’t any errors or warnings within the output console indicating points with loading the photographs.
What I Anticipated:
I anticipated the photographs to be displayed accurately throughout the CollectionView, filling the display screen with the offered photos.