preface

This article is about creating your first application for Mac, not Windows. If you are Windows please enter the pit test yourself.

At This year’s Mobile World Congress 2018, Google released the first beta of Flutter, a new mobile UI framework for Developers to build high-quality native apps on both Ios and Android. The details of this framework are not stated, please check the official documentation for yourself. Official website: flutter. IO /

start

First, you need to obtain the Fluuter SDK. There are two ways to obtain the SDK:

  • Click flutter_MACOS_v0.5.1 -beta.zip to download;
  • Using the command line download:
git clone -b beta https://github.com/flutter/flutter.git
Copy the code

Then set the mirror, skip this step if you can scale the wall:

exportPUB_HOSTED_URL=https://pub.flutter-io.cn // This parameter is required for domestic usersexportFLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn // Set this parameter for domestic usersexport PATH=`pwd`/flutter/bin:$PATH
Copy the code

Add to system path:

export PATH=`pwd`/flutter/bin:$PATH
Copy the code

Run the flutter doctor

Run the following command to see if additional dependencies need to be installed to complete the installation:

flutter doctor
Copy the code

This command examines your environment and displays the report in a terminal window. Dart SDK is already bundled into Flutter, there is no need to install Dart separately. Scrutinize the command line output for additional software that may need to be installed or further tasks that may need to be performed (shown in bold)

As shown in the figure:

The first time a flutter command (such as a flutter Doctor) is run, it downloads its own dependencies and compiles them. It will run much faster later.

Once you have installed any missing dependencies, run the flutter doctor command again to verify that you have set up the flutter properly.

IOS Settings

Install Xcode

To develop Flutter applications for iOS, you need Xcode 7.2 or higher:

Install Xcode 7.2 or later (resolve by yourself).

Configure the Xcode command line tool to use the newly installed version of Xcode

sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer
Copy the code

For most cases, this is the correct path when you want to use the latest version of Xcode. If you need to use a different version, specify the corresponding path.

Make sure the Xcode license is done by opening Xcode once or by command

sudo xcodebuild -license
Copy the code

Yes.

Using Xcode, you can run the Flutter application on an iOS device or emulator.

Setting up the iOS Emulator

To prepare to run and test your Flutter application on the iOS emulator, follow these steps:

On a Mac, find the emulator through Spotlight or use the following command:

open -a Simulator
Copy the code

Make sure your emulator is using a 64-bit device (iPhone 5S or later) by checking the Settings in the Emulator Hardware > Devices menu. Depending on the screen size of your development machine, an emulated HD iOS device may cause your screen to overflow. Set the device Scale in the emulator under Window> Scale

Launch your app.

flutter run
Copy the code

Vs code set

First install the plug-in (as shown)

Create an

After creating the project, open the project using the command line (Xcode)

open ios/Runner.xcworkspace
Copy the code

At this point, you can run your project using Xcode.

Demo

If you have any comments or suggestions on this article, please let them know in the comments below. Thank you for your support! And finally, my successful demo