Flutter教程(一)

  1. Flutter简介

    Flutter官网地址
    是谷歌的便携式用户界面工具包,可以从一个代码库为移动、网络和桌面构建漂亮的本地应用程序。
    特点:开发速度快、富有表现力和灵活性的用户界面、原生性能。

  2. Mac安装方法:
    官网安装地址
    下载flutter_macos_v1.5.4-hotfix.2-stable.zip,解压命令如下:

 $ cd ~/development
 $ unzip ~/Downloads/flutter_macos_v1.5.4-hotfix.2-stable.zip

设置Flutter环境变量

$ vim ~/.bash_profile
#Futter
export PATH=$PATH:/Users/jh/development/flutter/bin

运行和测试是否安装成功

$ flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, v1.5.4-hotfix.2, on Mac OS X 10.14.4 18E226, locale zh-Hans-CN)
 
[!] Android toolchain - develop for Android devices (Android SDK version 28.0.3)
    ! Some Android licenses not accepted.  To resolve this, run: flutter doctor --android-licenses
[!] iOS toolchain - develop for iOS devices (Xcode 10.2.1)
    ✗ libimobiledevice and ideviceinstaller are not installed. To install with Brew, run:
        brew update
        brew install --HEAD usbmuxd
        brew link usbmuxd
        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.dev/platform-plugins
      To install:
        brew install cocoapods
        pod setup
[!] Android Studio (version 3.2)
    ✗ Flutter plugin not installed; this adds Flutter specific functionality.
    ✗ Dart plugin not installed; this adds Dart specific functionality.
[!] IntelliJ IDEA Ultimate Edition (version 2018.1.2)
    ✗ Flutter plugin not installed; this adds Flutter specific functionality.
    ✗ Dart plugin not installed; this adds Dart specific functionality.
[✓] VS Code (version 1.27.2)
[✓] Connected device (2 available)

! Doctor found issues in 4 categories.

IOS
配置 Xcode 命令行工具使用新安装的 Xcode 版本,从命令行运行以下命令:

 $ sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer

配置不同版本的xcode,需要切换路径的(这个我也没有使用过多版本,我只用了最新的版本)。
启动模拟器命令如下:

 $ open -a Simulator

Android
先安装Android stuido —>Android SDK---->运行的Android 4.1(API Level 16 以上的版本)
一般不使用Android模拟器,使用的都是真机调试。

简单工具调试
我使用的是Visual Studio Code,以后会使用Android Studio/IntelliJ作为开发工具吧,后续会出教程的。
1.安装Visual Studio Code这个不就不讲了。
2.在Visual Studio Code中使用快捷键commond+shift+p,输入install 选择 Extensions:Install Extensions ,查找Flutter直接下载就好。
3.下载完后点击reload或者重新打开vscode, command + shift + p 输入 flutter 选择 Flutter:Run Flutter Doctor 与shell下输入flutter doctor相同,检测flutter是否正常

创建和运行项目
1.命令生成和运行项目如下:

创建项目

 $ flutter create my_app

进入项目目录

$ cd my_app

运行项目可以先启用IOS模拟器

 $ open -a Simulator
 $ flutter run

Flutter教程(一)_第1张图片
Android 手机开启开发者调试—>usb调试开启---->如需usb安装/adb安装,既可以真机调试。因为没有ios手机和开发者账号我在这里也就不演示了。

你可能感兴趣的:(Flutter)