| ページ一覧 | ブログ | twitter |  書式 | 書式(表) |

MyMemoWiki

「Flutter」の版間の差分

提供: MyMemoWiki
ナビゲーションに移動 検索に移動
46行目: 46行目:
  
 
====[[Firebase]]====
 
====[[Firebase]]====
#プロジェクトフォルダで以下を実行しXcodeで
+
*プロジェクトフォルダで以下を実行しXcodeで
##open ios/[[R]]unner.xcworkspace
+
**open ios/[[R]]unner.xcworkspace
 
[[File:0512_ios_bundle_id.png]]
 
[[File:0512_ios_bundle_id.png]]
##[[Firebase]] にバンドルIDを登録
+
*開発者IDを登録
##cd ios
+
[[File:Flutter_xcode_sign.png]]
##pod setup
+
**[[Firebase]] にバンドルIDを登録
#https://developers.google.com/identity/sign-in/ios/start-integrating
+
**cd ios
 +
**pod setup
 +
*https://developers.google.com/identity/sign-in/ios/start-integrating
  
 
==環境構築==
 
==環境構築==

2020年4月11日 (土) 11:50時点における版

Flutter

Dart |


SDK

Widget

拡張パッケージ

Flutter Studio

UIをデザイナで作成できる

Install

Mac

開発者登録

インストール

  1. sdkダウンロード
  2. unzipで解凍
  3. .bash_profile にPATH登録
  4. flutter doctor コマンドで必要な作業のチェックとヘルプ

実行

  1. xcodeのダウンロード
  2. command line tools の有効化
    1. sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer/
    2. sudo xcodebuild -runFirstLaunch
  3. cocoapods のインストール
    1. sudo gem install cocoapods
    2. pod setup
  4. シミュレーターの起動
    1. open - a Simulator
  5. プロジェクトの作成
    1. flutter create my_app
  6. プロジェクトディレクトリで、
    1. flutter run

Firebase

  • プロジェクトフォルダで以下を実行しXcodeで

0512 ios bundle id.png

  • 開発者IDを登録

Flutter xcode sign.png

環境構築

Firebase

Flutterfire

Firebase Auth

example

Google Sign in

example

Tips

AndroidX対応

メニュー

ドロワーメニュー

return Scaffold(
  appBar: AppBar(),
  drawer: Drawer(),
  body: Center(),
);

画面遷移

呼び出し元

RaisedButton(
  onPressed: (){
    Navigator.push(
      context,
      MaterialPageRoute(builder: (context) => SecondRoute()),
    );
  },
  child: const Text('Open Second Screen'),

呼び出し先

import 'package:flutter/material.dart';
 
class SecondRoute extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return _SecondRouted();
  }
}
 
class _SecondRouted extends State<SecondRoute> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(),
      body: Center(),
    );
  }
}

Dialog

画像選択

画像切り抜き

DB

Sqlite