No content

環境 Flutter version 1.2.0 Android Studio

今日のゴール DatePickerを使ってカレンダー を作成 !

今日の流れ Date Pickerとは 1.2.0 in DataPicker DataPickerを使った 　 カレンダー作成 Flutter1.2.0の内容 Flutterとその概要

講義 ・Date Pickerとは ・1.2.0 in DataPicker ・Flutter1.2.0の内容 ・Flutterとその概要

Flutterとは？

Flutterとは？ ・googleが2017年5月に正式リリースしたモバイルアプリケーションフレー ムワーク ・Flutterはフレームワークで開発言語はDart ・開発環境はAndroidStudio、VisualStudioCodeのいずれか ・Flutterを用いることでAndroid/iOS両方のアプリを同時に作ることができ る ・Flutterを用いることでAndroid/iOS両方のアプリを同時に作ることができ る ・2019年のアップデートでweb向けのpreview版もリリースされている

Flutterの需要

レイアウトの書き方 ・Scaffold レイアウト全体 ・appBar アプリ上部に表示されるタイトル バー部分 ・body レイアウト部分、Textが2つは いっています ・floatingActionButton カウントアップ用のボタン

よく利用するレイアウトのパーツ Layout Navigation ・Container ・Column & Row ・AxisAlignment ・ListView ・GridView ・Stack ・Card ・Container ・Column & Row ・AxisAlignment ・ListView ・GridView ・Stack ・Card ・AppBar ・BottomNavigationBar ・TabBar ・SliverAppBar ・Drawer

講義 ・Date Pickerとは ・1.2.0 in DataPicker ・Flutter1.2.0の内容 ・Flutterとその概要

Flutter1.2.0の内容 ・パフォーマンスの向上 ・iOS向けのUIウィジェットの改修(Material、Cuprrino) →ピクセルパーフェクトで描画されるようになりました ・デスクトップアプリ開発の前準備でキーボード等のイベ ントの対応 ・アプリ内課金のサポート、ビデオプレイヤー &WebView、マップのバグ回収

Flutter1.2.0の更新内容 ・アイコンフォントツリーの改修 ・テキストフィールドの自動入力 ・ドラッグ&ドロップの機能追加 ・マテリアルデザインの更新(RangeSlider、TimePicker、DatePicker) ・レスポンシブなダイアログの追加 ・その他機能回収

講義 ・Date Pickerとは ・1.2.0 in DataPicker ・Flutter1.2.0の内容 ・Flutterとその概要

Date Pickerとは ・Flutter標準のカレンダーUI ・今までは年の範囲と日付の指定ができた ・Date Pickerを用いることでカレンダーの 操作が簡単にできる →年／日付の指定と取得

講義 ・Date Pickerとは ・1.2.0 in DataPicker ・Flutter1.2.0の内容 ・Flutterとその概要

1.2.0 in Date Picker ・日付の範囲指定機能の追加 ・デザインの刷新 →月の移動がスムーズになりました

ここからハンズオンです！！

Flutterを使う上での注意点 ・Android/iOSのネイティブコードを書かなければ行けないケースが有る →Flutterは画面と共通ロジックを素早く作れますが、OS独自の実装は必 要になります ・Android/iOSの知識がなければリリースまでできない →Android/iOS共にアプリを出すにあたってガイドラインと規約の理解、 リリースまでの開発の流れの知識が必要になる

Flutter Projectを作成

デフォルトのコードをビルドすると・・ ちなみに 数字カウントアプリが開きます

デフォルトのコードをビルドすると・・ ちなみに 数字カウントアプリが開きます