![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-fdSkGH4TWGxv65TL8n8ojKbSeHfrxvE-q0itPHN5ULggsm6MCgcgHSmALGOex5OkTS7cG_9qlv37kQCwORnUv6RxALTLCiZ34r97plVFcrSiBRSWdouqTu1Ao6aIPpKbcLSWWyBwZR3ZAlEJrwaESwThKLO-3LkG-uKQp92MHV4p2qGi5oE-UwJPUQ/w640-h426/ubuntu_flutter.png)
In this tutorial, we will show you how to write a HelloWorld application using Flutter. With Flutter, you can create natively compiled, multi-platform applications from a single codebase, which can be used on any device.
Prerequisites
Before you begin this guide you'll need the following:
- A local development environment. You can check out the following tutorial here...
- Installed Android Studio. You can check out the following tutorial here...
- Installed and configured Flutter. You can check out the following tutorial here...
Step 1 — Create Your Flutter Project
Let's start by creating our project in the following directory /home/digitalriver/flutterprojects
Run the following command to create the project directory:
mkdir /home/digitalriver/flutterprojects
Navigate to the created directory:
cd /home/digitalriver/flutterprojects
Run the following command:
flutter create hello_world_app
You’ll see the following output:
Creating project hello_world_app...
Running "flutter pub get" in hello_world_app... 3.8s
Wrote 96 files.
All done!
In order to run your application, type:
$ cd hello_world_app
$ flutter run
Your application code is in hello_world_app/lib/main.dart.
Step 2 — Modify The Following File lib/main.dart
In this step, we are going to modify the contents in the following file lib/main.dart.
Modify the contents of the following file: lib/main.dart using your favorite text editor for this example we are using vi:
vi lib/main.dart
import 'package:flutter/material.dart';
void main(){
runApp(
new MaterialApp(
title: 'Hello World App',
home: new myApp(),
)
);
}
class myApp extends StatelessWidget {
@Override
Widget build(BuildContext context) {
return new Scaffold(
appBar: new AppBar(
title: new Text('Hello World App'),
),
body: new Center(
child: new Text(
'Hello, world!'
),
),
);
}
}
Save the file contents and quit the text editor
Step 3 — Run The App
In this step, we are going to run the app in our selected IDE.
Run the app in the way your IDE describes. You should see either Android, iOS, Windows, Linux, macOS, or web output, depending on your chosen device.
flutter run
You should get output similar to the following:
Conclusion
In this article, you should have created a basic HelloWorld app and run it in your IDE of choice.
Comments
Post a Comment