Posts

Android Studio - Assignment [Containers Solution]

Image
Assignment : Create an app using Containers and its functions as shown in the image below Code : import 'package:flutter/material.dart' ; void main () { runApp( MyApp ()) ; } class MyApp extends StatelessWidget { @override Widget build (BuildContext context) { return MaterialApp ( home: Scaffold ( backgroundColor: Colors. amber , appBar: AppBar ( backgroundColor: Colors. white70 , title: Text ( 'Myapp' ) , ) , body: SafeArea ( child: Row ( mainAxisAlignment: MainAxisAlignment. spaceBetween , children: <Widget>[ Container ( width: 80.0 , color: Colors. orange , height: double. infinity , ) , Column ( mainAxisAlignment: MainAxisAlignment. center , children: <Widget>[ Container ( width: 100.0 , ...

#5 Android Studio - Columns & Rows

Image
Tutorial on how to add multiple widgets using Column and Row functions We are adding multiple widgets by using the functions Column() or Row() . Inorder to add multiple widgets we have to add a function called children <Widget>[] inside which we can add our multiple containers as shown in the image below.  Refer #4 Android Studio - Container to learn about containers and how to add them   Here in the image below i have given different colors and removed padding and margins to avoid confusions     Using different functions to re-arrange widgets 1. a) verticalDirection: VerticalDirection.up, is used to arrange the containers in the top     b) verticalDirection: VerticalDirection.down,   is used to arrange the containers in the bottom   2. a) mainAxisAlignment: MainAxisAlignment.start, is similar to verticalDirection: VerticalDirection.up as it places the children close to the main Axis ie, the top      b) mainAxisA...

#4 Android Studio - Container

Image
Tutorial on How to add container class and add padding and margin to our Flutter Project Container class in flutter is a convenience widget that combines common painting, positioning, and sizing of widgets.In this lesson we will learn about how to add container class to our project and add paddings and margins to the container. Step 1 : Add container widget by typing Container() in body and add a background color and text to make the container visible Step 2 : Add Paddings.Paddings help to re arrange the text inside the container.There are different types of padding eg. EdgeInsets.only(any one direction : 30.0) [single direction] EdgeInsets.all(20.0) [all direction]  EdgeInsets.fromLTRB(left, top, right, bottom) [specific direction] EdgeInsets.Symmetric(horizontal : 5.0, vertical: 2.0) [horizontal & Vertical]   Step 3 : Add Margins.Margin are used to give spacing outside the container and the codes are same as that of padding   Note : Padding is used to give spac...

#3 Android Studio - Add App Icon

Image
 Tutorial on how to change the App icon Step 1 : In order to add the App icon, first download the picture from the link given below and upload it to the App icon generator . Make sure to d ownload and unzip the folder generated from the app generator. Download Image :   Diamond.png Note : Choose only the required app sizes while choosing in the app icon generator   Step 2 : Then open Android studio and open Show In Explorer from Android - app - src - main - and right click on res where you can see the similar folder names of that downloaded from the icon generator (inside Android).Now replace the files of android studio with the downloaded files. Step 3 : Do the same for iOS by opening Show in Explorer from iOS - runner - and right click on Assets.xcassets and replace the corresponding file with the downloaded file.   Step 4 : You can run the app to see the changes you made to the app icon.Here you might have noticed that the android app icons are i...