Flutterログ #1 Hello Worldしてみる
きっかけ
Flutterが周りで流行ってきているので使ってみる。ノートも使ってみたかったし。
いつのまにか社内で勉強会が実施されてた。そしてtogetterはこちら。
どういうプロダクトなのか
この中の、CARTUNE作ってるマイケルのCTO @najeira さんのスライド読んでわかった気になった。
noteも見つけたので読みやすい方で。
環境構築
当方はmacOS High Sierra (10.13.4)なので↑で。
SDKをダウンロードして適当に配置してPATHを通した後、以下を実行。
$ flutter doctor
╔════════════════════════════════════════════════════════════════════════════╗
║ Welcome to Flutter! - https://flutter.io ║
║ ║
║ The Flutter tool anonymously reports feature usage statistics and crash ║
║ reports to Google in order to help Google contribute improvements to ║
║ Flutter over time. ║
║ ║
║ Read about data we send with crash reports: ║
║ https://github.com/flutter/flutter/wiki/Flutter-CLI-crash-reporting ║
║ ║
║ See Google's privacy policy: ║
║ https://www.google.com/intl/en/policies/privacy/ ║
║ ║
║ Use "flutter config --no-analytics" to disable analytics and crash ║
║ reporting. ║
╚════════════════════════════════════════════════════════════════════════════╝
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel beta, v0.3.1-pre.33, on Mac OS X 10.13.4 17E199, locale ja-JP)
[!] Android toolchain - develop for Android devices (Android SDK 27.0.3)
! Some Android licenses not accepted. To resolve this, run: flutter doctor --android-licenses
[!] iOS toolchain - develop for iOS devices (Xcode 9.3)
✗ Missing Xcode dependency: Python module "six".
Install via 'pip install six' or 'sudo easy_install six'.
✗ libimobiledevice and ideviceinstaller are not installed. To install, run:
brew install --HEAD libimobiledevice
brew install ideviceinstaller
✗ ios-deploy not installed. To install:
brew install ios-deploy
✗ CocoaPods not installed.
CocoaPods is used to retrieve the iOS platform side's plugin code that responds to your plugin usage on the Dart side.
Without resolving iOS dependencies with CocoaPods, plugins will not work on iOS.
For more info, see https://flutter.io/platform-plugins
To install:
brew install cocoapods
pod setup
[✓] Android Studio (version 3.0)
✗ Flutter plugin not installed; this adds Flutter specific functionality.
✗ Dart plugin not installed; this adds Dart specific functionality.
[!] IntelliJ IDEA Community Edition (version 2016.1.2)
✗ Flutter plugin not installed; this adds Flutter specific functionality.
✗ Dart plugin not installed; this adds Dart specific functionality.
✗ This install is older than the minimum recommended version of 2017.1.0.
[!] Connected devices
! No devices available
! Doctor found issues in 4 categories.Welcomeされた後でいろいろ言われるので、✗になってるところを言われたとおりひとつずつ解決すると、以下のようにキレイになる。(デバイスはiPhoneでやった)
$ flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel beta, v0.3.1-pre.33, on Mac OS X 10.13.4 17E199, locale ja-JP)
[✓] Android toolchain - develop for Android devices (Android SDK 27.0.3)
[✓] iOS toolchain - develop for iOS devices (Xcode 9.3)
[✓] Android Studio (version 3.0)
[✓] IntelliJ IDEA Community Edition (version 2018.1.1)
[✓] Connected devices (1 available)続いてXcodeを最新にして、examples/hello_world フォルダ直下でXcodeプロジェクトを開く。
$ cd {SDK_PATH}/flutter/examples/hello_world
$ open ios/Runner.xcworkspace最初はSigningを解決してから、コマンドラインで以下を実行すると実機にインストールされた。
$ flutter runすると、真っ黒なhello worldが表示された。おしまい。
ついでに、Xcodeのファイル構成を見てみた。App.frameworkがアウトプットの出力先なのかな。
ソースコードは、libフォルダ以下にある。
$ pwd
{SDK_PATH}/flutter/examples/hello_world
$ ls lib
arabic.dart main.dart
$ vi main.dart// Copyright 2015 The Chromium Authors. All rights reserved.
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.
import 'package:flutter/widgets.dart';
void main() => runApp(const Center(child: const Text('Hello, world!', textDirection: TextDirection.ltr)));ちなみにAndroidは
開発者向けオプションをONにしてUSBデバッグを有効にした後で、抜き差ししたら接続確認のポップアップが出てOKしたらいけました。後は一緒です。久々にやったのでハマりました。。
$ pwd
{SDK_PATH}/flutter/examples/hello_world
$ flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel beta, v0.3.1-pre.33, on Mac OS X 10.13.4 17E199, locale ja-JP)
[✓] Android toolchain - develop for Android devices (Android SDK 27.0.3)
[✓] iOS toolchain - develop for iOS devices (Xcode 9.3)
[✓] Android Studio (version 3.0)
[✓] IntelliJ IDEA Community Edition (version 2018.1.1)
[✓] Connected devices (1 available)$ flutter run
Launching lib/main.dart on E5823 in debug mode...
Initializing gradle... 1.6s
Resolving dependencies... 56.4s
Running 'gradlew assembleDebug'... 13.2s
Built build/app/outputs/apk/debug/app-debug.apk (29.6MB).
Installing build/app/outputs/apk/app.apk... 12.8s
I/FlutterActivityDelegate(12648): onResume setting current activity to this
Syncing files to device E5823... 1.5s
🔥 To hot reload your app on the fly, press "r". To restart the app entirely, press "R".
An Observatory debugger and profiler on E5823 is available at: http://127.0.0.1:8100/
For a more detailed help message, press "h". To quit, press "q".こんなかんじで起動できるはずです。
この記事が気に入ったらサポートをしてみませんか？