C#•17mo ago

✅ How to access specific fields from an [ObservableProperty] ObservableCollection<Object>?

Hoping to pick someone's brain on MVVM and MAUI. So I have a ViewModel that looks like:

public partial class TermsViewModel : ObservableObject
{
    public TermsViewModel()
    {
        Terms = new ObservableCollection<Term>();
    }
    
    [ObservableProperty]
    ObservableCollection<Term> terms;
}

public partial class TermsViewModel : ObservableObject
{
    public TermsViewModel()
    {
        Terms = new ObservableCollection<Term>();
    }
    
    [ObservableProperty]
    ObservableCollection<Term> terms;
}

public partial class TermsViewModel : ObservableObject
{
    public TermsViewModel()
    {
        Terms = new ObservableCollection<Term>();
    }
    
    [ObservableProperty]
    ObservableCollection<Term> terms;
}

public partial class TermsViewModel : ObservableObject
{
    public TermsViewModel()
    {
        Terms = new ObservableCollection<Term>();
    }
    
    [ObservableProperty]
    ObservableCollection<Term> terms;
}

and I want to have the xaml create each of the objects in the ObservableCollection... But the items are of type Term, so how do I tell the xaml to access the

IdText

IdText

IdText

IdText of the

Term

Term

Term

Term object and print that?

    <CollectionView
        ItemsSource="{Binding Terms}">
        <CollectionView.ItemTemplate>
            <DataTemplate x:DataType="x:String">
                <SwipeView>
                    <SwipeView.RightItems>
                        <SwipeItems>
                            <SwipeItem Text="Delete" 
                                       BackgroundColor="Red"/>
                        </SwipeItems>
                    </SwipeView.RightItems>
                    <SwipeView.LeftItems>
                        <SwipeItems>
                            <SwipeItem Text="Edit" 
                                       BackgroundColor="Orange"/>
                        </SwipeItems>
                    </SwipeView.LeftItems>
                </SwipeView>
            </DataTemplate>
        </CollectionView.ItemTemplate>
    </CollectionView>

    <CollectionView
        ItemsSource="{Binding Terms}">
        <CollectionView.ItemTemplate>
            <DataTemplate x:DataType="x:String">
                <SwipeView>
                    <SwipeView.RightItems>
                        <SwipeItems>
                            <SwipeItem Text="Delete" 
                                       BackgroundColor="Red"/>
                        </SwipeItems>
                    </SwipeView.RightItems>
                    <SwipeView.LeftItems>
                        <SwipeItems>
                            <SwipeItem Text="Edit" 
                                       BackgroundColor="Orange"/>
                        </SwipeItems>
                    </SwipeView.LeftItems>
                </SwipeView>
            </DataTemplate>
        </CollectionView.ItemTemplate>
    </CollectionView>

    <CollectionView
        ItemsSource="{Binding Terms}">
        <CollectionView.ItemTemplate>
            <DataTemplate x:DataType="x:String">
                <SwipeView>
                    <SwipeView.RightItems>
                        <SwipeItems>
                            <SwipeItem Text="Delete" 
                                       BackgroundColor="Red"/>
                        </SwipeItems>
                    </SwipeView.RightItems>
                    <SwipeView.LeftItems>
                        <SwipeItems>
                            <SwipeItem Text="Edit" 
                                       BackgroundColor="Orange"/>
                        </SwipeItems>
                    </SwipeView.LeftItems>
                </SwipeView>
            </DataTemplate>
        </CollectionView.ItemTemplate>
    </CollectionView>

    <CollectionView
        ItemsSource="{Binding Terms}">
        <CollectionView.ItemTemplate>
            <DataTemplate x:DataType="x:String">
                <SwipeView>
                    <SwipeView.RightItems>
                        <SwipeItems>
                            <SwipeItem Text="Delete" 
                                       BackgroundColor="Red"/>
                        </SwipeItems>
                    </SwipeView.RightItems>
                    <SwipeView.LeftItems>
                        <SwipeItems>
                            <SwipeItem Text="Edit" 
                                       BackgroundColor="Orange"/>
                        </SwipeItems>
                    </SwipeView.LeftItems>
                </SwipeView>
            </DataTemplate>
        </CollectionView.ItemTemplate>
    </CollectionView>

I'm not sure how best to handle a "complex" object vs. just an

ObservableCollection<string>

ObservableCollection<string>

ObservableCollection<string>

ObservableCollection<string>.

I essentially want the

term.Name

term.Name

term.Name

term.Name to be displayed for each

Term

Term

Term

Term object in the Collection, but when the

term.Name

term.Name

term.Name

term.Name is tapped in my app, I want it to reference pass the

term.Id

term.Id

term.Id

term.Id to an eventual call to open a

CoursePage(term.Id)

CoursePage(term.Id)

CoursePage(term.Id)

CoursePage(term.Id)

leowest•8/26/24, 2:41 AM

For a start, ObservableCollection does not required ObservableProperty, it already is an observable object.

public partial class TermsViewModel : ObservableObject
{
    public TermsViewModel()
    {
        Terms = new ObservableCollection<Term>();
    }
    
    public ObservableCollection<Term> Terms { get; set; }
}

public partial class TermsViewModel : ObservableObject
{
    public TermsViewModel()
    {
        Terms = new ObservableCollection<Term>();
    }
    
    public ObservableCollection<Term> Terms { get; set; }
}

leowest•8/26/24, 2:41 AM

In addition to that you should not need to specify the DataType

leowest•8/26/24, 2:44 AM

and to bind the properties it would be as simple as using {Binding Id}{Binding Id} or {Binding Name}{Binding Name}

leowest•8/26/24, 2:45 AM

https://learn.microsoft.com/en-us/dotnet/maui/user-interface/controls/collectionview/populate-data?view=net-maui-8.0

leowest•8/26/24, 2:45 AM

https://learn.microsoft.com/en-us/dotnet/maui/xaml/fundamentals/data-binding-basics?view=net-maui-8.0
For more information these links should be of help

DaClownieOP•8/26/24, 2:56 AM

Phenomenal, I’ll read up and use your information to start. I appreciate the time you put in to your answer and I’ll update if I make progress or hit snares. Thanks!

Lleowest and to bind the properties it would be as simple as using `{Binding Id}` or `{Bi...

DaClownieOP•8/26/24, 6:48 PM

Hey, so I'm hitting build time errors when trying to reference the Name and IdText fields of the Term objects inside the ObservableCollection we talked about

DaClownieOP•8/26/24, 6:49 PM

Rider showed no issues until I tried to Build, visual studio on windows recognizes that it can't make the connection, but I can't quite figure out a way to resolve it

DaClownieOP•8/26/24, 6:49 PM

DaClownieOP•8/27/24, 1:30 AM

I still can't figure out what I'm missing to make this work. The IDE knows its a Term, but at build time it tries to find the property IdText inside the TermsViewModel and not in the Term.

DaClownieOP•8/27/24, 1:32 AM

If I remove the IdText you see whats on the lines right below, Label "Text={Binding}" />Label "Text={Binding}" /> gets annotated by Rider with DataContext=TermDataContext=Term

leowest•8/27/24, 1:35 AM

can you show me your model

leowest•8/27/24, 1:35 AM

preferable if u have a github its easier

DaClownieOP•8/27/24, 1:35 AM

using System;
using System.Collections.Generic;

namespace LibrandriaMAUI.Models;

public partial class Term
{
    
    public Guid Id { get; set; }

    public string Name { get; set; } = null!;

    public DateTime StartDate { get; set; }

    public DateTime EndDate { get; set; }

    public string UserId { get; set; }

    public string? IdText { get; set; }

    public DateTime DateCreated { get; set; }

    public DateTime DateModified { get; set; }

    private Term() { }

    public Term(string name, DateTime startDate, DateTime endDate,
        string userId)
    {
        Id = Guid.NewGuid();
        Name = name;
        StartDate = startDate;
        EndDate = endDate;
        UserId = userId;
        IdText = Id.ToString();
    }
}

using System;
using System.Collections.Generic;

namespace LibrandriaMAUI.Models;

public partial class Term
{
    
    public Guid Id { get; set; }

    public string Name { get; set; } = null!;

    public DateTime StartDate { get; set; }

    public DateTime EndDate { get; set; }

    public string UserId { get; set; }

    public string? IdText { get; set; }

    public DateTime DateCreated { get; set; }

    public DateTime DateModified { get; set; }

    private Term() { }

    public Term(string name, DateTime startDate, DateTime endDate,
        string userId)
    {
        Id = Guid.NewGuid();
        Name = name;
        StartDate = startDate;
        EndDate = endDate;
        UserId = userId;
        IdText = Id.ToString();
    }
}

Lleowest preferable if u have a github its easier

DaClownieOP•8/27/24, 1:36 AM

The github is set to private unless I can add specific users. I have to learn how to hide certain bits of info before i can make it public (connection strings, etc)

DDaClownie I still can't figure out what I'm missing to make this work. The IDE knows its a...

leowest•8/27/24, 1:36 AM

and here are u binding via DI?

DaClownieOP•8/27/24, 1:36 AM

probably just need to pan out a proper .gitignore but i haven't got there

DDaClownie The github is set to private unless I can add specific users. I have to learn ho...

leowest•8/27/24, 1:37 AM

I mean u could make it public for a short period so I can clone it and then hide it again

DaClownieOP•8/27/24, 1:37 AM

give me a moment

leowest•8/27/24, 1:37 AM

for connection strings etc usually env vars are used

leowest•8/27/24, 1:38 AM

or things u dont want to commit to your git

leowest•8/27/24, 1:38 AM

and yes also a gitignore for obvious reasons

leowest•8/27/24, 1:38 AM

because u dont want to push the bin folder etc

leowest•8/27/24, 1:39 AM

https://www.jetbrains.com/help/rider/Run_Debug_Configuration.html#envvars-progargs

DaClownieOP•8/27/24, 1:40 AM

check your messages

DaClownieOP•8/27/24, 1:40 AM

sent it privately

leowest•8/27/24, 1:40 AM

sadly I dont get dms, u can send here nad delete short after

leowest•8/27/24, 1:40 AM

DaClownieOP•8/27/24, 1:40 AM

tell me when i can delete

DaClownieOP•8/27/24, 1:40 AM

and set private again

DaClownieOP•8/27/24, 1:40 AM

:kek:

leowest•8/27/24, 1:41 AM

see like u dont want ever to push these

leowest•8/27/24, 1:41 AM

u can try running a dotnet new gitignoredotnet new gitignore

leowest•8/27/24, 1:42 AM

that folder alone is probably making your project like 100~+ mbs to upload to git haha

DaClownieOP•8/27/24, 1:42 AM

ok done, will it automatically remove things from the repo that is being ignored? or will I need to clean that up

leowest•8/27/24, 1:43 AM

mmm it should does rider not have a git changes u can view?

DaClownieOP•8/27/24, 1:44 AM

Just shows changed files, I'll deal with that part a bit later, add it to my todo list :kek:

leowest•8/27/24, 1:50 AM

the binding looks fine, let me delve into

leowest•8/27/24, 1:51 AM

I can also see u wired things right in the DI

DaClownieOP•8/27/24, 1:54 AM

Ok, thats good to know

DaClownieOP•8/27/24, 1:55 AM

I might have to rework how the database works, or how I interact with it. As it stands now, I need to add any IP that tries to connect to the Db to an allowed conneciton list. Probably need some sort of backend api that does the routing so its "local" (i'm spitballing, don't know what i'm talking about it, but assuming something like that is the proper methodology)

DaClownieOP•8/27/24, 1:56 AM

I could also just host my own instance on my server, but I didn't want to spend all that time lol

leowest•8/27/24, 1:57 AM

I mean depends is this a external database hosted somewhere?

DaClownieOP•8/27/24, 1:57 AM

yep

leowest•8/27/24, 1:57 AM

then u can't run it locally without creating your own

DaClownieOP•8/27/24, 1:58 AM

I have an unRAID server that I could run a MySQL docker on

leowest•8/27/24, 1:58 AM

you could dump all the scripts and create a local one for testing purpose if u want

DaClownieOP•8/27/24, 1:58 AM

I figured just grabbing some web hosting would make my life simpler, but as i've been going, nothing has been easy lol

leowest•8/27/24, 2:00 AM

also keep in mind this

leowest•8/27/24, 2:00 AM

✅ How to access specific fields from an [ObservableProperty] ObservableCollection<Object>?

Similar Threads

Similar Threads

Similar Threads