Flutter for Android devs

3be52a14c8c58209263d7f83204b8dc7?s=47 Rui Kowase
April 13, 2018

Flutter for Android devs

3be52a14c8c58209263d7f83204b8dc7?s=128

Rui Kowase

April 13, 2018
Tweet

Transcript

  1. 2.

    Profile • Name: Rui Kowase / 小和瀬 塁 • Account:

    @rkowase 2 Skill: Flutter, Android, etc...
  2. 3.

    What’s Flutter Flutter makes it easy and fast to build

    beautiful mobile apps. https://github.com/flutter/flutter
  3. 7.

    Get Started: Install on macOS $ unzip ~/Downloads/flutter_macos_v0.2.8-beta.zip $ export

    PATH=`pwd`/flutter/bin:$PATH $ flutter doctor https://flutter.io/setup-macos/
  4. 8.

    Get Started: Configure Editor • Install Flutter plugin (Preferences >

    Plugins > Browse repositories) • Restart Android Studio https://flutter.io/get-started/editor/
  5. 11.

    Flutter for Android Developers • Views ◦ What is the

    equivalent of a View in Flutter? ◦ How do I update Widgets? ◦ How do I layout my Widgets? Where is my XML layout file? ◦ How do I add or remove a component from my layout? ◦ In Android, I can animate a view by calling animate(); how do I animate a Widget? ◦ How do I use a Canvas to draw/paint? ◦ How do I build custom widgets? • Intents ◦ What is the equivalent of an Intent in Flutter? ◦ How do I handle incoming intents from external applications in Flutter? ◦ What is the equivalent of startActivityForResult() ? • Async UI ◦ What is the equivalent of runOnUiThread() in Flutter? ◦ How do you move work to a background thread? ◦ What is the equivalent of OkHttp on Flutter? ◦ How do I show the progress for a long-running task in Flutter? • Project Structure & Resources ◦ Where do I store my resolution dependent image files? ◦ Where do I store strings? How do I handle localization? ◦ What is the equivalent of a Gradle file? How do I add dependencies? • Layouts ◦ What is the equivalent of a LinearLayout ◦ What is the equivalent of a RelativeLayout ◦ What is the equivalent of a ScrollView • Gesture Detection and Touch Event Handling ◦ How do I add an onClick listener to a widget in Flutter ◦ How do I handle other gestures on widgets • Listviews & Adapters ◦ What is the alternative to a ListView in Flutter ◦ How do I know which list item is clicked on ◦ How do I update ListView’s dynamically • Working with Text ◦ How do I set custom fonts on my Text widgets ◦ How do I style my Text widgets • Form Input ◦ What is the equivalent of a “hint” on an Input ◦ How do I show validation errors • Flutter Plugins ◦ How do I access the GPS sensor ◦ How do I access the Camera ◦ How do I log in with Facebook ◦ How do I build my own custom native integrations ◦ How do I use the NDK in my Flutter application https://flutter.io/flutter-for-android/
  6. 13.
  7. 14.

    Hello World import 'package:flutter/material.dart'; void main() => runApp(new MyApp()); class

    MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return new MaterialApp( title: 'Welcome to Flutter', home: new Scaffold( appBar: new AppBar( title: new Text('Welcome to Flutter'), ), body: new Center( child: new Text('Hello World'), ), ), ); } } https://flutter.io/get-started/codelab/
  8. 15.

    Hello World import 'package:flutter/material.dart'; void main() => runApp(new MyApp()); class

    MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return new MaterialApp( title: 'Welcome to Flutter', home: new Scaffold( appBar: new AppBar( title: new Text('Welcome to Flutter'), ), body: new Center( child: new Text('Hello World'), ), ), ); } } https://flutter.io/get-started/codelab/ Immutable
  9. 16.

    Intent void main() { runApp(new MaterialApp( home: new MyAppHome(), //

    becomes the route named '/' routes: <String, WidgetBuilder> { '/a': (BuildContext context) => new MyPage(title: 'page A'), '/b': (BuildContext context) => new MyPage(title: 'page B'), '/c': (BuildContext context) => new MyPage(title: 'page C'), }, )); } Navigator.of(context).pushNamed('/b');