💰 Finance Manager

📌 Introduction

In this workshop, we will create a mobile application with UI that looks good using Xamarin Forms.
We will go through many steps. From the most introductory to the most complex and at the end we will have a Finance Manager that will look good and works as intended.

📑 Discussion Points

1. What is Xamarin ?
   • Pages
     • ContentPage
     • MasterDetailPage
     • NavigationPage
     • TabbedPage
     • TemplatedPage
     • CarouselPage
   • Layouts
     • Single Content
       • ContentPresenter
       • ContentView
       • ScrollView
       • Frame
       • TemplatedView
     • Multiple Children
       • StackLayout
       • AbsoluteLayout
       • RelativeLayout
       • Grid
       • FlexLayout
   • Controls
     • Label
     • Entry
     • Editor
     • Button
     • Picker
     • DatePicker
     • And More ...
2. Application Design
3. Welcome Page
   • Add SVG - Resizetizer.NT
   • Styling - Button and Labels
   • Layouts - StackLayout
   • Pages - ContentPage
4. Add Account Page
   • On first start to introduce account and balance
   • Add Separate table in DB for Accounts
   • DatabaseConnection - SQLite
5. Accounts Page
   • Collection View
   • Total balance
6. TabbedPage and Navigation
   • Create TabbedPage:
     • Positioning on bottom in Android
   • Navigation between WelcomePage and TabbedPage - NavigationPage
   • Tabs Icons
7. Expenses Page V1
   • ContentPage - ToolbarItems for top buttons
   • Default Color From Design in Android
   • Add page as Tab in TabbedPage
   • Filters
     • BindableLayout - FlexLayout
     • Global Styling - In ResourceDictionary App.xaml
   • Collection View - For Transactions
8. AddTransaction Page
   • Layout : StackLayout + Grid
   • Picker - Binding
   • DatePicker
   • Frame - Style
   • DataBinding
   • CodeBehind as View Model
9. Expenses Page V2
   • DataTemplate for Collection View Cell
   • Populate Collection View
   • Filters Design
   • Apply Filters in Backend
   • Converters
10. Stats Page
    • Charts generator
    • MVVM pattern
      • INotifyPropertyChanged
    • Microcharts
    • XAML Formatting
11. Settings
    • Theming: Dark/Light Mode
    • Xamarin.Essentials : Preferences
12. Get rid of the welcome screen after the first start
    • Xamarin.Essentials: Version Tracking
13. App Icon and Splash Screen

💵 Finance Manager with .Net 6 Backend and SQL-Server databese

📖 Bibliography

• Xamarin Forms Documentation
• Controls Reference
• Xamarin.Forms Pages
• Xamarin.Forms Layouts
• Resizetizer.NT - For adding SVGs
  • Xamarin Developer Tutorial
• SQLite-Net-Pcl
  • James Montemagno - Tutorial
  • Microsoft Docs
• Microcharts.Forms
  • DevBlog - Tutorial
  • Gerald Versluis - Tutorial
• Theming
  • James Montemagno - Tutorial
• Icons
  • James Montemagno - Tutorial
  • https://easyappicon.com/
  • Splash Screen Documentation

powered by MLSA UPB