0% found this document useful (0 votes)
43 views5 pages

Flutter 1st Lecture

Uploaded by

khanbalochtaunsa
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
43 views5 pages

Flutter 1st Lecture

Uploaded by

khanbalochtaunsa
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 5

Select the operating system on which you are installing Flutter:

1- Window
2- MacBook
3- Linux
4- ChromeOS

Click the link and follow the instruction to install flutter SDK

https://docs.flutter.dev/get-started/install/windows#update-your-path

Or

Installation in Windows
In this section, let us see how to install Flutter SDK and its requirement in a

windows system.

Step 1 − Go to URL, https://flutter.dev/docs/get-started/install/windows and

download the latest Flutter SDK.

Step 2 − Unzip the zip archive in a folder, say C:\flutter\

Step 3 − Update the system path to include the flutter bin directory.

Step 4 − Flutter provides a tool, a flutter doctor to check that all the requirement of

flutter development is met.

Run flutter doctor

Install VS Code
VS Code is a lightweight editor with complete Flutter app execution and debug
support.

● VS Code, latest stable version


Install the Flutter and Dart plugins
1. Start VS Code.
2. Invoke View > Command Palette….
3. Type “install”, and select Extensions: Install Extensions.
4. Type “flutter” in the extensions search field, select Flutter in the list, and click
Install. This also installs the required Dart plugin.

Validate your setup with the Flutter Doctor


1. Invoke View > Command Palette….
2. Type “doctor”, and select the Flutter: Run Flutter Doctor.
3. Review the output in the OUTPUT pane for any issues. Make sure to select
Flutter from the dropdown in the different Output Options

Install Android Studio


Android Studio offers a complete, integrated IDE experience for Flutter.

● Android Studio, version 2020.3.1 (Arctic Fox) or later

Alternatively, you can also use IntelliJ:

● IntelliJ IDEA Community, version 2021.2 or later


● IntelliJ IDEA Ultimate, version 2021.2 or later

Install the Flutter and Dart plugins


The installation instructions vary by platform.

Mac
Use the following instructions for macos:

1. Start Android Studio.


2. Open plugin preferences (Preferences > Plugins as of v3.6.3.0 or later).
3. Select the Flutter plugin and click Install.
4. Click Yes when prompted to install the Dart plugin.
5. Click Restart when prompted.

Linux or Windows
Use the following instructions for Linux or Windows:

1. Open plugin preferences (File > Settings > Plugins).


2. Select Marketplace, select the Flutter plugin, and click Install.

What you'll use


You need two pieces of software to complete this lab: the Flutter SDK and an editor.

You can run this codelab by using any of the following devices:

● A physical device (Android or iOS) connected to your computer and set to


developer mode
● The iOS simulator (requires installing Xcode tools)
● The Android emulator (requires setup in Android Studio)
● A browser (Chrome is required for debugging)
● A Windows, Linux, or macOS desktop application

Every Flutter app you create also compiles for the web. In your IDE under the devices
pulldown, or at the command line using flutter devices, you should now see
Chrome and Web server listed. The Chrome device automatically starts Chrome. The
Web server starts a server that hosts the app so that you can load it from any
browser. Use the Chrome device during development so that you can use DevTools,
and the web server when you want to test on other browsers. For more information,
see Building a web application with Flutter and Write your first Flutter app on the
web.

Also, Flutter apps can compile for desktop. You should see your operating system
listed in your IDE under devices, for example: Windows (desktop), or at the command
line using flutter devices. For more information on building apps for desktop, see
Write a Flutter desktop application.

Step 1: Create the starter Flutter app


Create a simple, templated Flutter app, using the instructions in Getting Started with
your first Flutter app. Name the project startup_namer (instead of flutter_app).
Tip: If you don’t see “New Flutter Project” as an option in your IDE, make sure you
have the plugins installed for Flutter and Dart.

You’ll mostly edit lib/main.dart, where the Dart code lives.

1. Replace the contents of lib/main.dart.


Delete all of the code from lib/main.dart. Replace with the following code,
which displays “Hello World” in the center of the screen.

import 'package:flutter/material.dart';

void main() {
runApp(const MyApp());
}

class MyApp extends StatelessWidget {


const MyApp({super.key});

@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Welcome to Flutter',
home: Scaffold(
appBar: AppBar(
title: const Text('Welcome to Flutter'),
),
body: const Center(
child: Text('Hello World'),
),
),
);
}
}

You might also like