This document is a summary of a presentation about Flutter. It introduces Flutter, shows how to set up the Flutter SDK, and demonstrates building a simple UI with widgets. It explains how to structure widgets in a tree with parents and children. It also shows how to detect the current platform and theme the app differently for iOS versus other platforms. The conclusion encourages learning more about Dart and Dart 2. Contact information is provided at the end for technical talks or writings.

1. 2018.03.13
Kenichi Kambara (@korodroid)
potatotips #49
“Hello Flutter”
Flutter

2. Flutter

3. …

4. #
!!!

5. …

6. About me
•
•
• Droidcon Stockholm 2014
• Droidcon Spain 2014
• Droidcon Amsterdam 2013
• Droidcon Paris 2013
• Smartphone & Tablet 2014 Spring Tokyo
• Developers Summit 2013 Summer & 2015
•
• Mobile Dev Blog
• Android
• NTT
(@korodroid)

7. Introduction
•
• “Hello Flutter”

10. “Hello Flutter”

11. Android Studio

12. [ ]Flutter SDK
$ git clone -b beta https://github.com/flutter/flutter.git
$ export PATH=`pwd`/flutter/bin:$PATH
$ flutter doctor

13. [Preferences]Plugins->Flutter
※Dart

14. Flutter

15. Flutter

16. Hot Reload

17. Web

18. Save HotReload
※Save HotReload ON
for Dart2

19. UI Dart

20. UI->Widgets Tree
Body
AppBar
FAB

21. Widgets Tree
Scaffold
AppBar
Floating
ActionButton
Body
(Container)

22. Widgets Tree
Scaffold(appBar: _appBar,
body: _body,
floatingActionButton: _fabButton)
※1

23. Widgets Tree
FloatingActionButton _fabButton = FloatingActionButton(
tooltip: ' ',
child: Icon(Icons.attach_money),
onPressed: (){
//
int totalBill = (amountBill * (100 + taxPercentage) / 100).round();
//
AlertDialog dialog = AlertDialog(
content: new Text(" ( ):n $totalBill")
);
showDialog(context: context, child: dialog);
}
);

24. UI

25. OS
final ThemeData iOSTheme = ThemeData(
primarySwatch: Colors.grey,
accentColor: Color(0xFFFF4081),
);
final ThemeData defaultTheme = ThemeData(
primarySwatch: Colors.blue,
accentColor: Color(0xFFFF4081)
);
void main() {
runApp(MaterialApp(
title: ' ',
theme: defaultTargetPlatform == TargetPlatform.iOS
? iOSTheme
: defaultTheme,
home: TaxCalc()
));
}

26. Conclusion
•Dart
•Dart2

27. Appendix( )

28. - Please let me know if you have any requests
such as technical speeches, technical writings and so on.
Facebook:http://fb.com/kanbara.kenichi
Google+:+Kenichi Kambara
LinkedIn:http://www.linkedin.com/in/korodroid
Twitter:@korodroid
Thank you so much.