Install Flutter in Android Studio:

✅ Step 1: Download and Install Flutter SDK

1.​ Go to: https://flutter.dev/docs/get-started/install
2.​ Choose your OS (Windows/macOS/Linux).
3.​ Download the Flutter SDK.
4.​ Extract it to a preferred location (e.g., C:\src\flutter).
✅ Step 2: Set Flutter Path
1.​ Add Flutter’s bin folder to System Environment Variables:
○​ Search “Edit environment variables”.
○​ In Path, add:​
C:\src\flutter\bin
✅ Steps to Set ANDROID_HOME
Find your Android SDK path​
Typically: C:\Users\<YourUsername>\AppData\Local\Android\Sdk
1.​ Set Environment Variable
○​ Press Win + S, search "Environment Variables".
○​ Under System variables, click New:
■​ Variable name: ANDROID_HOME
■​ Variable value: C:\Users\<YourUsername>\AppData\Local\Android\Sdk
2.​ Update the Path Variable
Still in Environment Variables, select Path → click Edit → New: Add:​
​
%ANDROID_HOME%\tools
%ANDROID_HOME%\platform-tools
✅ Step 3: Install Android Studio
1.​ Download from: https://developer.android.com/studio
2.​ Install and launch Android Studio.
✅ Step 4: Install Flutter and Dart Plugins in Android Studio
1.​ Open Android Studio.
2.​ Go to Settings > Plugins.
3.​ Search and install:
○​ Flutter
○​ It will auto-install Dart too.
4.​ Restart Android Studio.
✅ Step 5: Install Android SDK
 1.​ Go to Settings > Appearance & Behavior > System Settings > Android SDK.
2.​ Make sure SDK Tools include:
○​ Android SDK
○​ Android SDK Command-line Tools
○​ Android Emulator
✅ Step 6: Verify Installation
1.​ Open Terminal or Command Prompt.
Run:​
flutter doctor
2.​ Fix any issues shown (e.g., accepting licenses).

Basic Flutter Commands

Command What It Does

flutter create project_name Creates a new Flutter project.

flutter pub get Fetches the dependencies listed in pubspec.yaml.

flutter run Runs your app on the connected device/emulator.

flutter clean Clears build cache and fixes weird build issues.

flutter doctor Checks if Flutter is properly set up. Very helpful!

flutter build apk Builds a release version of your app for Android.

flutter build web Builds your app for web deployment.

flutter upgrade Upgrades Flutter SDK to the latest version.

flutter pub add Adds a package (like http, provider, etc).

package_name

👨‍💻 Common During Development

Command Use Case

flutter run -d chrome Runs the app in a web browser.

 flutter devices Lists all connected devices/emulators.

flutter emulators Lists available emulators.

flutter emulators --launch Launches a specific emulator.

emulator_id

Format to remember:
main() → runApp() → MaterialApp → Scaffold → AppBar + Body → Widgets
🔹 1. main() Function
This is where your app starts running.
void main() => runApp(MyApp());
🔹 2. MyApp Class
This sets up your whole app — usually a StatelessWidget unless you're changing state.
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold( // screen structure
appBar: AppBar(title: Text('Title')),
body: WidgetTree(),
),
);
}
}
🔹 3. Scaffold
🔹 4. AppBar
Gives your app a basic layout — like an app bar, body, floating button, etc.

🔹 5. Body
The top bar of the app — use this for the title.

This is where your actual widgets go. You usually use:

●​ Column() → vertical layout
●​ Row() → horizontal layout
●​ Container() → for colors, width, height
●​ Text(), Image(), Button(), etc.
🧩 Example: Quick Widget Structure
body: Column(
 children: [
Container(...), // Red box
SizedBox(height: 10),
Row(
children: [
Container(...), // Blue box
Container(...), // Orange box
],
)
],
)
Summary Formula (Write this in your mind):
main() → runApp() → MyApp → MaterialApp → Scaffold → AppBar + body →
Column/Row → Containers/Text

1.​ Simple Widgets, GUI Components, fonts

import 'package:flutter/material.dart';

void main() {
runApp(MaterialApp(
home: MyApp(),
));
}

class MyApp extends StatelessWidget {

@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Simple Colored Widgets'),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Container(
width: 120,
height: 80,
color: Colors.red,
child: Center(
child: Text(
'I am Red box',
 )),
),
SizedBox(height: 10),​ ​ ​ //for space between widgets
Container(
width: 120,
height: 80,
color: Colors.green,
child: Center(
child: Text(
'I am Green Box',
)),
),
SizedBox(height: 10),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Container(
width: 120,
height: 80,
color: Colors.blue,
child: Center(
child: Text(
'Blue',
)),
),
SizedBox(width: 10),
Container(
width: 120,
height: 80,
color: Colors.orange,
child: Center(
child: Text(
'Orange',
)),
),
], ), ], ),), ), ); }}
 2.​ Alarm on and alarm off
import 'package:flutter/material.dart';

void main() => runApp(MaterialApp(home: AlarmToggle()));

class AlarmToggle extends StatefulWidget {

@override
_AlarmToggleState createState() => _AlarmToggleState();
}

class _AlarmToggleState extends State<AlarmToggle> {

bool isAlarmOn = false;

@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: ElevatedButton(
onPressed: () {
 setState(() {
isAlarmOn = !isAlarmOn;
});
},
child: Text(isAlarmOn ? 'Alarm Off' : 'Alarm On'),​ ​ //button text
),
),
);
}
}
 3.​ Calculator
import 'package:flutter/material.dart';

void main() => runApp(MaterialApp(home: MyApp()));

class MyApp extends StatefulWidget {

@override
State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {

String output = "0";
double num1 = 0, num2 = 0;
String _output = "", operand = "";

final buttons = [
"C", "⌫", "%", "/",
"7","8","9","*",
"4", "5", "6", "-",
"1", "2", "3", "+",
"+/-", "0", ".", "=",
];

void buttonPressed(String text) {

setState(() {
if (text == "=") {
num2 = double.parse(_output);
if (operand == "+") _output = (num1 + num2).toString();
if (operand == "-") _output = (num1 - num2).toString();
if (operand == "*") _output = (num1 * num2).toString();
if (operand == "/") _output = (num1 / num2).toString();
num1 = 0;
num2 = 0;
operand = "";
} else if (text == "C") {
_output = "0";
num1 = 0;
num2 = 0;
operand = "";
} else if (["+", "-", "*", "/"].contains(text)) {
num1 = double.parse(_output);
operand = text;
_output = "0";
} else {
 _output = _output == "0" ? text : _output + text;
}
output = _output;
});
}

@override
Widget build(BuildContext context) {
return Scaffold(
body: Column(
children: [
Text(output),
Expanded(
child: GridView.builder(
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: 4),
itemCount: buttons.length,
itemBuilder: (context, index) {
return ElevatedButton(
onPressed: () => buttonPressed(buttons[index]),
child: Text(buttons[index]),
);
}, ), ), ], ), ), ); }}
 4.​ 2-D game(ball gesture movement)
import 'package:flutter/material.dart';

void main() => runApp(MaterialApp(home: Game()));

class Game extends StatefulWidget {

@override
State<Game> createState() => _GameState();
}

class _GameState extends State<Game> {

double left = 100, top = 100;
int score = 0;
Color ballColor = Colors.red;

void move(DragUpdateDetails d) {
setState(() {
// Directly using d.delta.dx and d.delta.dy for movement
left += d.delta.dx;
top += d.delta.dy;

// Change color and score condition when the ball is moved

if (left > 150 && top > 200) {
ballColor = Colors.green;
score++;
}
});
}

@override
Widget build(BuildContext context) {
return Scaffold(
body: GestureDetector(
onPanUpdate: move, // Detecting drag movement
child: SizedBox.expand(
child: Stack(
children: [
AnimatedPositioned(
duration: Duration(milliseconds: 100),
left: left,
top: top,
child: Container(
width: 50,
height: 50,
 decoration: BoxDecoration(
color: ballColor, // Change ball color when moved
shape: BoxShape.circle,
),
),
),
Positioned(
top: 40,
left: 20,
child: Text("Score: $score",
style: TextStyle(fontSize: 24, color: Colors.black)),
),
],
),
),
),
);
}
}

​ ​ //ball moves based on touch gestures

 5.​ Movie Rating application similar to IMDB
import 'package:flutter/material.dart';

void main() => runApp(MaterialApp(home: MovieApp()));

class MovieApp extends StatelessWidget {

@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text("Movies")),
body: Padding(
padding: EdgeInsets.all(16),
child: Column(
children: [
Row(
children: [
Column(
children: [
Image.asset("assets/image.jpg", width: 100, height: 140),
SizedBox(height: 5),
Text("Inception", style: TextStyle(fontSize: 16)),
Row(
children: [
Icon(Icons.star, color: Colors.amber),
Icon(Icons.star, color: Colors.amber),
Icon(Icons.star, color: Colors.amber),
Icon(Icons.star, color: Colors.amber),
Icon(Icons.star_border, color: Colors.amber),
],
),
],
),
SizedBox(width: 20),
Column(
children: [
Image.asset("assets/image.jpg", width: 100, height: 140),
SizedBox(height: 5),
Text("Interstellar", style: TextStyle(fontSize: 16)),
Row(
children: [
Icon(Icons.star, color: Colors.amber),
Icon(Icons.star, color: Colors.amber),
Icon(Icons.star, color: Colors.amber),
Icon(Icons.star, color: Colors.amber),
 Icon(Icons.star, color: Colors.amber),
],
),
],
),
],
),
SizedBox(height: 20),
Row(
children: [
Column(
children: [
Image.asset("assets/image.jpg", width: 100, height: 140),
SizedBox(height: 5),
Text("Dark Knight", style: TextStyle(fontSize: 16)),
Row(
children: [
Icon(Icons.star, color: Colors.amber),
Icon(Icons.star, color: Colors.amber),
Icon(Icons.star, color: Colors.amber),
Icon(Icons.star, color: Colors.amber),
Icon(Icons.star, color: Colors.amber),
],
),
],
),
SizedBox(width: 20),
Column(
children: [
Image.asset("assets/image.jpg", width: 100, height: 140),
SizedBox(height: 5),
Text("Tenet", style: TextStyle(fontSize: 16)),
Row(
children: [
Icon(Icons.star, color: Colors.amber),
Icon(Icons.star, color: Colors.amber),
Icon(Icons.star, color: Colors.amber),
Icon(Icons.star_border, color: Colors.amber),
Icon(Icons.star_border, color: Colors.amber),
],
),
],
),
],
 ),
],
),
),
);
}
}
Add images in flutter:

6.​ Develop an application to connect to a web service and to retrieve data with HTTP
Add the http package In your pubspec.yaml file:
dependencies:
flutter:
sdk: flutter
http: ^0.13.6

import 'package:flutter/material.dart';
import 'package:http/http.dart' as http;
import 'dart:convert';

void main() => runApp(MaterialApp(home: WebApp()));

class WebApp extends StatefulWidget {

@override
State<WebApp> createState() => _WebAppState();
}
class _WebAppState extends State<WebApp> {
String title = "Loading...";

void getData() async {

var res = await http
.get(Uri.parse('https://jsonplaceholder.typicode.com/posts/1'));
setState(() => title = jsonDecode(res.body)['title']);
}

@override
void initState() {
super.initState();
getData();
}

@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text("API Data")),
body: Center(child: Text(title)),
);
}}
 7.​ Develop a simple shopping application
import 'package:flutter/material.dart';

void main() => runApp(MaterialApp(home: ShopApp()));

class ShopApp extends StatefulWidget {

@override
State<ShopApp> createState() => _ShopAppState();
}

class _ShopAppState extends State<ShopApp> {

int total = 0;

void addItem(int price) {

setState(() {
total += price;
});
}

void purchase() {
showDialog(
context: context,
builder: (_) => AlertDialog(
title: Text("Purchase Complete"),
content: Text("Total: ₹$total"),
actions: [
TextButton(
onPressed: () {
Navigator.pop(context);
setState(() => total = 0);
},
child: Text("OK"),
)
],
),
);
}

@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text("Shop")),
body: Column(
children: [
 Text("Total: ₹$total", style: TextStyle(fontSize: 20)),
Column(
children: [
Image.asset("assets/image.jpg", width: 100, height: 100),
Text("Shoes - ₹1500"),
ElevatedButton(
onPressed: () => addItem(1500), child: Text("Add to Cart")),
],
),
Column(
children: [
Image.asset("assets/image.jpg", width: 100, height: 100),
Text("Watch - ₹2500"),
ElevatedButton(
onPressed: () => addItem(2500), child: Text("Add to Cart")),
],
),
Column(
children: [
Image.asset("assets/image.jpg", width: 100, height: 100),
Text("Headphones - ₹1000"),
ElevatedButton(
onPressed: () => addItem(1000), child: Text("Add to Cart")),
],
),
ElevatedButton(
onPressed: purchase,
child: Text("Purchase"),
),
],
),
);
}
}
 10. Hangman Game
import 'package:flutter/material.dart';

void main() => runApp(MaterialApp(home: Hangman()));

class Hangman extends StatefulWidget {

@override
State<Hangman> createState() => _HangmanState();
}

class _HangmanState extends State<Hangman> {

final word = "Sam";
final guessed = <String>{};
int tries = 0;

@override
Widget build(BuildContext context) {
String display = word.split('').map((c) => guessed.contains(c) ? c : "_").join(' ');
bool won = !display.contains("_");
 bool lost = tries >= 6;

return Scaffold(
appBar: AppBar(title: Text("Hangman")),
body: Column(
children: [
Text(lost ? "You Lost!" : won ? "You Won!" : display),
Wrap(
children: "ABCDEFGHIJKLMNOPQRSTUVWXYZ".split('').map((l) {
return ElevatedButton(
onPressed: guessed.contains(l) || won || lost ? null : () {
//If any of those are true, the button is disabled by setting onPressed: null.
setState(() {
guessed.add(l);
if (!word.contains(l)) tries++;
});
},
child: Text(l),
);
}).toList(), ​ //comes for map(l)
),
Text("Tries left: ${6 - tries}")
],
),
);
}
}
 9. Google Maps Integration
import 'package:flutter/material.dart';
import 'package:flutter_map/flutter_map.dart';
import 'package:latlong2/latlong.dart';

void main() => runApp(MaterialApp(home: MapPage()));

class MapPage extends StatelessWidget {

@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text('Simple Map')),
body: FlutterMap(
options: MapOptions(
center: LatLng(13.0827, 80.2707),
zoom: 13,
),
children: [
TileLayer(
urlTemplate: 'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
subdomains: ['a', 'b', 'c'],
),
],
),
);
}
}
pubspec.yaml
environment:
sdk: '>=3.7.0 <4.0.0'

dependencies:
flutter:
sdk: flutter
flutter_map: ^6.1.0
latlong2: ^0.9.0
 8.​ Push notification
1. Go to firebase console website and create a project and choose parent as licet.ac.in →
continue and disable google analytics → continue and create project
2. Navigate to android studio project → android → app → src → main → AndroidManifest.xml
amd in the first line search for package=com.example.pushnotification​
If not found note as → com.example.<appname>​
3. In the firebase select android and follow the steps to add commands in files

✅ Procedure (Simplified)
​

Step 1: Create a new Flutter project

flutter create ex8
cd ex8

Step 2: In pubspec.yaml, add:

dependencies:
flutter:
sdk: flutter
firebase_core: ^2.27.0
firebase_messaging: ^14.7.9

Step 3: Get dependencies

bash
CopyEdit
flutter pub get

Step 4: Replace main.dart with the following code.

Step 5: Run the application

bash
CopyEdit
flutter run -d chrome

✅ Minimal main.dart
dart
CopyEdit
import 'package:flutter/material.dart';
import 'package:firebase_core/firebase_core.dart';
import 'package:firebase_messaging/firebase_messaging.dart';

void main() async {

WidgetsFlutterBinding.ensureInitialized();
await Firebase.initializeApp();
FirebaseMessaging.onBackgroundMessage(_handleBackground);
runApp(MyApp());
}

Future<void> _handleBackground(RemoteMessage message) async {

 print('Background message: ${message.notification?.title}');
}

class MyApp extends StatelessWidget {

@override
Widget build(BuildContext context) {
FirebaseMessaging.instance.getToken().then((token) {
print("Token: $token");
});

FirebaseMessaging.onMessage.listen((message) {
print('Foreground Notification: ${message.notification?.body}');
});

return MaterialApp(
home: Scaffold(
appBar: AppBar(title: Text("Push Notifications")),
body: Center(child: Text("Waiting for messages...")),
),
);
}
}