MAUI CollectionView.ItemTemplate not transport values

Giuseppe Furlan 16 Reputation points
2022-12-01T11:49:15.4+00:00

Hi,
in ViewModel CS I have defined a Class

public class StrucTappe  
{  
    public int Id { get; set; }  
    public string ImgUrl { get; set; }  
    public string Text1 { get; set; }  
    public string Text2 { get; set; }  
    public string Help1 { get; set; }  
    public string Help2 { get; set; }  
    public string Help3 { get; set; }  
    public bool Helpb1 { get; set; }  
    public bool Helpb2 { get; set; }  
    public bool Helpb3 { get; set; }  
    public int Points { get; set; }  

    public StrucTappe(int id, string imgUrl, string text1, string text2, string help1, string help2, string help3, bool helpb1, bool helpb2, bool helpb3, int points)  
    {  
        Id = id;  
        ImgUrl = imgUrl;  
        Text1 = text1;  
        Text2 = text2;  
        Help1 = help1;  
        Help2 = help2;  
        Help3 = help3;  
        Helpb1 = helpb1;  
        Helpb2 = helpb2;  
        Helpb3 = helpb3;  
        Points = points;  
    }  
}  

And I have populated it

[ObservableProperty]  
ObservableCollection<StrucTappe> listaTappe = new ObservableCollection<StrucTappe>();  

public TappePageView()  
{  
    listaTappe.Add(new StrucTappe(1, "foto_1.jpg", "Text 11", "Text 12", "Help 11", "Help 12", "Help 13", false, false, false, 20));  
    listaTappe.Add(new StrucTappe(2, "foto_2.jpg", "Text 21", "Text 22", "Help 21", "Help 22", "Help 23", false, false, false, 20));  
    listaTappe.Add(new StrucTappe(3, "foto_3.jpg", "Text 31", "Text 32", "Help 31", "Help 32", "Help 33", false, false, false, 20));  
    listaTappe.Add(new StrucTappe(4, "foto_4.jpg", "Text 41", "Text 42", "Help 41", "Help 42", "Help 43", false, false, false, 20));  
}  

But in XAML not show the information. Here my XAML ..

    <ScrollView Grid.Row="2" Grid.ColumnSpan="3">  
        <CollectionView ItemsSource="{Binding ListaTappe}" SelectionMode="Single">  
            <CollectionView.ItemTemplate>  
                <DataTemplate>  
                    <Frame Grid.Row="0" Grid.Column="0" Padding="5,5">  
                        <Grid RowDefinitions="*, *, *"  
                        ColumnDefinitions=".40*, .40*, .20*"  
                        Padding="0,5">  

                            <Image Grid.RowSpan="3" Source="{Binding ImgUrl}" HeightRequest="100" />  

                            <AbsoluteLayout Grid.Row="0" Grid.Column="1" Grid.RowSpan="2" >  
                                <Label FontSize="12" Text="{Binding Text1}" />  
                                <Label FontSize="12" Text="{Binding Text2}" Margin="45, 0"  />  
                            </AbsoluteLayout>  

                            <AbsoluteLayout Grid.Row="2" Grid.Column="1" >  
                                <Label Margin="-5, 5" Text="Punti:" />  
                                <Label Margin="45, 0" Text="{Binding Points}" FontAttributes="Bold" TextColor="Red" FontSize="20" />  
                            </AbsoluteLayout>  

                            <AbsoluteLayout Grid.Row="0" Grid.Column="2" >  
                                <Label Margin="-5, 5" Text="Help 1:"/>  
                                <CheckBox Margin="45, 0" IsChecked="{Binding Helpb1}" />  
                            </AbsoluteLayout>  

                            <AbsoluteLayout Grid.Row="1" Grid.Column="2" >  
                                <Label Margin="-5, 5" Text="Help 2:"/>  
                                <CheckBox Margin="45, 0" IsChecked="{Binding Helpb2}" />  
                            </AbsoluteLayout>  

                            <AbsoluteLayout Grid.Row="2" Grid.Column="2" >  
                                <Label Margin="-5, 5" Text="Help 3:"/>  
                                <CheckBox Margin="45, 0" IsChecked="{Binding Helpb3}" />  
                            </AbsoluteLayout>  

                        </Grid>  
                    </Frame>  
                </DataTemplate>  
            </CollectionView.ItemTemplate>  
        </CollectionView>  
    </ScrollView>  

Where am I doing wrong?
Thanks.

Update:

thank you for your help.

I have not been precise in my information given above.
The main problem I find in the compilation phase, I get the following error.

266480-error-compiling.png

( ImgUrl not found)

If I running the application in Debug mode (Windows Machine) with this source:

                            <Image Grid.RowSpan="3" Source="foto_1.jpg" HeightRequest="100" />  

                            <AbsoluteLayout Grid.Row="0" Grid.Column="1" Grid.RowSpan="2" >  
                                <Label FontSize="12" Text="text1" />  
                                <Label FontSize="12" Text="text2" Margin="45, 0"  />  
                            </AbsoluteLayout>  

                            <AbsoluteLayout Grid.Row="2" Grid.Column="1" >  
                                <Label Margin="-5, 5" Text="Punti:" />  
                                <Label Margin="45, 0" Text="points" FontAttributes="Bold" TextColor="Red" FontSize="20" />  
                            </AbsoluteLayout>  

                            <AbsoluteLayout Grid.Row="0" Grid.Column="2" >  
                                <Label Margin="-5, 5" Text="Help 1:"/>  
                                <CheckBox Margin="45, 0" IsChecked="true" />  
                            </AbsoluteLayout>  

                            <AbsoluteLayout Grid.Row="1" Grid.Column="2" >  
                                <Label Margin="-5, 5" Text="Help 2:"/>  
                                <CheckBox Margin="45, 0" IsChecked="false" />  
                            </AbsoluteLayout>  

                            <AbsoluteLayout Grid.Row="2" Grid.Column="2" >  
                                <Label Margin="-5, 5" Text="Help 3:"/>  
                                <CheckBox Margin="45, 0" IsChecked="true" />  
                            </AbsoluteLayout>  

The application works correctly, but images and texts are fixed. If during the application running I change the image source ..

    from     Source="foto_1.jpg"      to    Source="{Building ImgUrl}"  

The Image change correctly in real time, the same changes in Text LABEL, change regulary the content.

I go to re running application with the last changes, appear the error.

Why ?? Where I wrong ?

Giuseppe

.NET MAUI
.NET MAUI
A Microsoft open-source framework for building native device applications spanning mobile, tablet, and desktop.
3,714 questions
{count} votes

1 answer

Sort by: Most helpful
  1. Giuseppe Furlan 16 Reputation points
    2022-12-06T09:12:58.867+00:00

    I'm self taught, I'm discovering MAUI .NET by myself.
    For this I have some difficulties and I ask you for help.

    Fixed the data structure to transport, now I'm faced with the problem of populating a

    ObservableCollection<strucTappe> lT

    This collection is used in the page that is called from Main with the passing of 2 parameters:

    await Shell.Current.GoToAsync($"{nameof(TappePage)}?targa={EnTarga.Text.Trim()}&ngara={EnNgara.Text.Trim()}");

    On the called ModelView page I entered:

    [QueryProperty("Ngara", "ngara")]
    [QueryProperty("Tag", "tag")]

    public partial class StagesPageView : ObservableObject
    {
    [ObservableProperty]
    string ngara;
    [ObservableProperty]
    string license plate;

     [ObservableProperty]  
     ObservableCollection<strucTappe> lT;  
    

    }

    I would like to use the two variables 'ngara' and 'targa' to execute a SQL query and populate the lT collection, but I always find them NULL.

    Is there a position where I find the 2 variables populated with the information coming from the MainPage ?

    Thanks

    0 comments No comments

Your answer

Answers can be marked as Accepted Answers by the question author, which helps users to know the answer solved the author's problem.