Flutter Talk (Easy)

_setup.md

$ flutter create flutter_talk

$ cd flutter_talk

Now open emulator or attach device

$ flutter run

main.01.dart

// Step 1
// Blank app

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Text(
        'This is your home page',
      ),
    );
  }
}

main.02.dart

// Step 2
// Personalize it

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Text(
        'Hello, CodeRGV',
      ),
    );
  }
}

main.03.dart

// Step 3
// Center it

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Text(
          'Hello, CodeRGV',
        ),
      ),
    );
  }
}

main.04.dart

// Step 4
// Add FAB

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Text(
          'Hello, CodeRGV',
        ),
      ),
      floatingActionButton: FloatingActionButton(
        child: Icon(Icons.laptop),
      ),
    );
  }
}

main.05.dart

// Step 5
// Test the FAB

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Text(
          'Hello, CodeRGV',
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          print('Hello, there');
        },
        child: Icon(Icons.laptop),
      ),
    );
  }
}

main.06.dart

// Step 6
// Make it stateful (perform a full reload)

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Text(
          'Hello, CodeRGV',
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          print('Hello, there');
        },
        child: Icon(Icons.laptop),
      ),
    );
  }
}

main.07.dart

// Step 7
// Add a stateful variable

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  bool sayHello = false;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Text(
          'Hello, CodeRGV',
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          print('Hello, there');
        },
        child: Icon(Icons.laptop),
      ),
    );
  }
}

main.08.dart

// Step 8
// Update the variable

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  bool sayHello = false;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Text(
          'Hello, CodeRGV',
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          setState(() {
            sayHello = !sayHello;
            print(sayHello);
          });
        },
        child: Icon(Icons.laptop),
      ),
    );
  }
}

main.09.dart

// Step 9
// Hello in a string

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  bool sayHello = false;

  @override
  Widget build(BuildContext context) {
    String helloString = 'Hello, CodeRGV';
    return Scaffold(
      body: Center(
        child: Text(
          helloString,
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          setState(() {
            sayHello = !sayHello;
          });
        },
        child: Icon(Icons.laptop),
      ),
    );
  }
}

main.10.dart

// Step 10
// Hello and goodbye

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  bool sayHello = false;

  @override
  Widget build(BuildContext context) {
    String helloString = 'Hello, CodeRGV';

    if (sayHello == false) {
      helloString = 'Goodbye, CodeRGV';
    }

    return Scaffold(
      body: Center(
        child: Text(
          helloString,
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          setState(() {
            sayHello = !sayHello;
          });
        },
        child: Icon(Icons.laptop),
      ),
    );
  }
}

main.11.dart

// Step 11
// Make it fancy

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  bool sayHello = false;

  @override
  Widget build(BuildContext context) {
    String helloString = 'Hello, CodeRGV';

    if (sayHello == false) {
      helloString = 'Goodbye, CodeRGV';
    }

    return Scaffold(
      body: Center(
        child: Text(
          helloString,
          style: TextStyle(
            color: Colors.purple,
            fontSize: 18,
            fontWeight: FontWeight.bold,
            letterSpacing: 2,
          ),
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          setState(() {
            sayHello = !sayHello;
          });
        },
        child: Icon(Icons.laptop),
      ),
    );
  }
}