In this tutorial you will learn how to build a complete payment app in flutter.
This tutorial is divided into two sections. In the first section we covered the UI. And in the section we will see how to do the actual payment with backend.
Check out the link for the payment app starter code. It includes graphics and some basic starter dart file
https://www.dbestech.com/flutter_payment_app_2021_10_02.zip
and check out the video link here for first part of the series.
First part we did the following
Here you will learn how to build a payment app from scratch for iOS and Android using fltuter step by step.
Flutter payment app building will cover payment UI, payment with paypal and braintree and with backend api. This tutorial also cover complex ui building using stack widgets.
This is first part of the series where we covered the payment ui. Payment ui includes home page, payment history and payment page.
In the first part we did the following
1. Building complext payment ui
2. Select with payment options with Getx
3. Make payment with paypal Braintree
4. Backend record of the payment
The widgets we have used are
1. Stack widgets
2. Positioned widgets
3. MediaQuery.removePadding
4. Container widgets
5. TextPainter widgets
6. TextSpan widgets
In the second part we did the following
1. Flutter service
2. Flutter Getx for data processing and building list.
3. Flutter Getx controller
4. Learn about flutter Future types
5. Build JSON Files
6. Read JSON files
7. Build data model
8. Build the backend
9. Build get API for the app
10. Build post API for the app and test with Postman
Video for the second part
We have also covered flutter getx fetch and display data. We have used flutter getx for building listView with obx and obs.
GetX Variables
To make list or variable observable you can simple add .obs next to the variable.
like below
bool newVar = false.obs
//or
var list = [].obs
After doing that, both the newVar and list variable would be observable.
Well, now if you have values for the variables you can just put there. If you want to change the boolean value then you need to do like this
newVar.value=true;
With this the the value of newVar would be true.
And to add a value in the list you can do like below
list.addAll("yourvalue");
now list variable will have new values.