Flutter Payment App | App Development Tutorial for Beginners for iOS and Android from Scratch

Here you will learn how to build a payment app from scratch for iOS and Android using flutter 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.

Patreons download the complete code from the link below
https://www.patreon.com/posts/56925458

Download the starter code from the link below
https://www.dbestech.com/tutorials/flutter-payment-app-with-paypal

Payment integration for Paypal in Flutter
https://youtu.be/3G8QYPZOSJo

Read a good book and motivate yourself to achieve your dream
https://amzn.to/3A73INw

For flutter ios development if you need to buy apple computer check out the link below
https://amzn.to/3nrE6Ii

Flutter task management app
https://www.dbestech.com/tutorials/flutter-task-management-app-with-restful-api

Timeline
0:0:35 Starter code
0:0:43 Project structure
0:02:55 Explain complex layout and start positioning
0:03:20 Introduce positioned and stack widget
0:05:50: Static class for color in flutter project
0:08:19 Declare the header of the app using private variables and it’s functions
0:09:10 Multiple Stack widgets
0:11:50 Display images using DecorationImage and AssetImage
0:23:40 Start working on the listView for flutter listview with image and text using one side border and shadow spread radius and blur radius
0:26:15 ListView styling and decoration
0:29:10 Explain row and column layout
0:33:15 Showing the list image
0:35:30 Showing the text with the listview and image next to each other
0:44:00 Showing the dots using custom functions based on the length of the text
0:45:45 Get text width using TextPainter and TextSpan and get dynamic text width
1:01:30 Start drawing half oval
1:04:10 Showing all the items in a list which has texts and images
1:07:38 Wrap widgets using ListView.Builder
1:10:00 ListView.builder within Positioned widget
1:11:39 MediaQuery.removePadding to remove top padding of listview builder
1:12:33 Create a reusable button
1:24:45 Start showing overlay using showModalButtomSheet
1:25:20 showModalButtomSheet for overlay and customize the overlay with heights and positions
1:34:08 Show buttons in a column
1:46:25 Required and optional parameters for widgets
1:48:10 Cancel the modal of showModalButtonSheet using Navigator.pop(context)
1:57:25 Start working for paybill page payment page
2:06:00 Introduce the idea for the layout

This is first part of the series where we covered the payment ui. Payment ui includes home page, payment history and payment page. The widgets we have used are
1. Stack widgets
2. Positioned widgets
3. MediaQuery.removePadding
4. Container widgets
5. TextPainter widgets
6. TextSpan widgets

The concepts would covered here are

1. Building complext payment ui
2. Select with payment options with Getx
3. Make payment with paypal Braintree
4. Backend record of the payment