Create Nothing app with flutter

Parth Jansari
Dec 4, 2017 · 4 min read

note: this app will do absolutely nothing (shh….. it’s a hello world app) & YOU NEED TO HAVE A WORKING SETUP OF ANDROID STUDIO

Hats off Chilango Labs(no one is sponsoring this post)for coming up with this crazy idea please try there app https://play.google.com/store/apps/details?id=com.gorro.nothing&hl=en

Github Repo for this app: https://github.com/parth181195/flutter-nothing-app


First Steps — 5 min Setup

Clone repo and add to $PATH:

$ git clone -b alpha https://github.com/flutter/flutter.git

Run flutter doctor

$ flutter doctor

Creating your nothing Flutter app

$ flutter create nothing

run your nothing app

$ cd nothing
$ flutter run

if you want to reload whole app Press shift+r(R) and to hot reload press r in terminal.

We are all set for development in flutter

your project folder must be looking like this

inside lib folder and you will find a main.dart this is the file where all our code will go.
first, we need to clear all the code in main.dart and start with an empty file.
first, we need to import material package from flutter

then we will create a function which will initialize our app

but at this point in time, your IDE must be going crazy on what the hack is HomePage.it will show error cause we haven’t created HomePage class.

now let’s declare HomePage class

there we go we have our nothing app ready. even if you just copy pasted the whole thing your app must be looking like this. now let’s understand individual components from code.

what’s in code!!!

on line 1 you can see we have imported the package:flutter/material.dart this package contains all Flutter widgets implementing Material Design.

after that, we declare a function called run app, inside the main function.now hears where the things get more interesting inside run app we pass a class called MaterialApp which contains Flutter widgets implementing Material Design. Then we set HomePage class as the home of our app. inside our homepage class we will override class for our build method inside build method we will pass BuildContext context and we will return a scaffold class which provides us with This class provides APIs for showing drawers, snack bars, and bottom sheets. then we will pass a new center widget as body. now you must be wondering what is a widget.

Widget

Widgets are the basic building blocks of a Flutter app’s user interface. Each widget is an immutable declaration of part of the user interface. Unlike other frameworks that separate views, view controllers, layouts, and other properties, Flutter has a consistent, unified object model: the widget.

A widget can define:

  • a structural element (like a button or menu)
  • a stylistic element (like a font or color scheme)
  • an aspect of layout (like padding)
  • and so on…

and as child of center we will pass Text widget an s we are done with coding our center app. now we are done with coding part of our app you can now set app icon by using image provided bellow you if you want to generate different icon sizes use this service(it’s free): https://makeappicon.com/

android icon will go to projectdir/android\app\src\main\res

ios icon will go to projectdirios\Runner\Assets.xcassets\AppIcon.appiconset

you need to create a JSON file of ios which contains image details as array inside

{
“images” : [
{
“size” : “20x20”,“idiom” : “iphone”,“filename” : “Icon-App-20x20@2x.png”,“scale” : “2x”}
]
}

GDG Gandhinagar

Google Developer Group is for developers who are interested in Google’s developer technology; everything from the Android, Chrome, Drive, and Google Cloud platforms, to product APIs like the Cast API, Maps API, and YouTube API.

Parth Jansari

Written by

GDG Gandhinagar

Google Developer Group is for developers who are interested in Google’s developer technology; everything from the Android, Chrome, Drive, and Google Cloud platforms, to product APIs like the Cast API, Maps API, and YouTube API.

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade