Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Flutter at Google I/O 2019

Flutter at Google I/O 2019

- Beyond Mobile: Material Design, Adaptable UIs, and Flutter
- Beyond Mobile: Building Flutter Apps for iOS, Android, Chrome OS, and Web
- Building for iOS with Flutter
- Pragmatic State Management in Flutter
- Dart: Productive, Fast, Multi-Platform - Pick 3

Katsumi Onishi

May 16, 2019
Tweet

More Decks by Katsumi Onishi

Other Decks in Programming

Transcript

  1. 4

  2. Widgets Update 8 • Floating Action Button Trasitions • Reorderable

    List View • Range Slider - Later this month (May) • Search Bar Extension -> Search Delegate
  3. 15 Adaptive Design 引用) Responsive vs Adaptive Design – Kloudteam

    https://blog.kloud.team/responsive-vs-adaptive-design-646bb1c106a3
  4. 16

  5. 24

  6. 25

  7. 28

  8. 29

  9. 41

  10. 45

  11. 47

  12. 48 not using Material on iOS • iOS ユーザー そのプラットフォームの体験に慣れている。

    • 異なる体験を提供すると混乱する • Flutter のSDKには、それをサポートする仕組みがある • Cupertino Widgets
  13. Adaptive UI 56 class LogScreen extends StatelessWidget { @override Widget

    build(BuildContext context) { return AdaptivePageScaffold( title: 'Your Log', child: ListView.builder( itemCount: dayModels.length, itemBuilder: (context, index) => DailyDisplay(dayModels[index]), ), ); } }
  14. Adaptive UI 57 class AdaptivePageScaffold extends StatelessWidget { @override Widget

    build(BuildContext context) { if (_isIOS) { return AdaptiveTextTheme( child: CupertinoPageScaffold( navigationBar: CupertinoNavigationBar( middle: Text(title), ), resizeToAvoidBottomInset: false, child: child, ), );
  15. Adaptive UI 58 } else { return AdaptiveTextTheme( child: Scaffold(

    appBar: AppBar( title: Text(title), ), drawer: ModalRoute.of(context).isFirst ? MainDrawer() : null, body: child, ), ); } } }
  16. 59

  17. 60 • RedBrogdon/building_for_ios_IO19: Code used during the I/O '19 talk,

    "Building for iOS with Flutter" https://github.com/RedBrogdon/building_for_ios_IO19 • Platform specific behaviors and adaptations - Flutter https://flutter.dev/docs/resources/platform-adaptations
  18. 62

  19. 80

  20. 81

  21. 82

  22. 83

  23. 84

  24. 89

  25. Google I/O 2019 - Sessions • Beyond Mobile: Material Design,

    Adaptable UIs, and Flutter https://events.google.com/io/schedule/events/1d9c02ed-bdc5-4a32-90bc-7316d6d1fb55 • Beyond Mobile: Building Flutter Apps for iOS, Android, Chrome OS, and Web https://events.google.com/io/schedule/events/03d8425c-54ca-437b-bac7-ece76cca8347 • Building for iOS with Flutter https://events.google.com/io/schedule/events/37261739-76c8-45fe-a8a8-5cd9b1a894c2 • Pragmatic State Management in Flutter https://events.google.com/io/schedule/events/0cedc311-b646-4b29-b952-d7c7a832bfbd • Dart: Productive, Fast, Multi-Platform - Pick 3 https://events.google.com/io/schedule/events/664c8a66-50d8-41d5-933c-0983f878b377 91
  26. Google I/O 2019 - YouTube • Flutter at Google I/O

    2019 https://www.youtube.com/playlist?list=PLjxrf2q8roU2no7yROrcQSVtwbYyxAGZV 92
  27. Source code • RedBrogdon/building_for_ios_IO19: Code used during the I/O '19

    talk, "Building for iOS with Flutter" https://github.com/RedBrogdon/building_for_ios_IO19 • 2d-inc/developer_quest: Respository for the I/O 2019 demo: Become a tech lead, slay bugs, and don't get fired. https://github.com/2d-inc/developer_quest • 93
  28. 94 Recap • Google I/O 2019 — Flutter Recap! – ProAndroidDev https://proandroiddev.com/google-i-o-2019-flutter-recap-c4e33ef5c47b

    • What’s new in Flutter at IO ‘19? – Flutter Community – Medium https://medium.com/flutter-community/whats-new-in-flutter-at-io-19-bb7b03d98c0f • Google Developers Japan: Flutter: モバイル、ウェブ、組み込み、そしてデスクトップのポータ ブル UI フレームワーク https://developers-jp.googleblog.com/2019/05/flutter-ui.html •
  29. 95