So we’ve got the demo running on Windows and Android as well as on Mac and iOS. Next is to turn that demo into something worth using. Granted we’re only doing a simple to-do app, but the basic concepts are here to make a great application.
First thing we want to do is open our application from last time. It should just be in the Open Recent area on the left when you first open Visual Studio 2022. Open it up and run it to make sure everything still works. You should get the .NET character with a button that counts the number of times it is clicked. Go to the MainPage.xaml file and delete all of the code within and including the ScrollView (leave the ContentPage alone). Next remove the OnCoutnerClicked method from the MainPage.xaml.cs file. Your MainPage.xaml should look like this:
Now, add a folder for the Model that we are going to create. Call it
Models. Now in that new folder create a class called
ActionItems.cs and enter the following code:
Now that we have a model we need to use it. Back in the MainPage.xaml file add an attribute to the top to create a namespace for models as seen in line 4 below:
Next let’s add some data. We’ll start with static data for now but will move to an API later. First inside the ContentPage add a CollectionView. The CollectionView is like a ScrollView mixed with a ListView, only a bit more powerful than that. I won’t go into too much about what it is here but you can read the excellent docs at Microsoft for more information. Add the following code to create an array of ActionItems to the page:
CollectionView.ItemsSource add a
ItemTemplate will include a simple
HorizontalStackLayout which is simply a
StackLayout with the layout property set to horizontal. See the nice things that Microsoft did to save us a few key strokes here and there? Anyway add this code:
Click save and run the app. You have the basic UI setup for the To Do application.
Next time we’ll focus on the backend of the frontend. We’ll move the data out of the XAML and into code where data belongs. For now let me know what you think of this series I hope you enjoy.