导航菜单
首页 >  Flutter  > 开发体验初探

开发体验初探

Create a sample Flutter app#

To use Flutter DevTools from VS Code, install theFlutter extension.This also automatically installs theDart extension.With these extensions, you can debug your application.

Open the Command Palette.

Go to View > Command Palette orpress + Shift + P.

Type flutter.

Select the Flutter: New Project.

When prompted for Which Flutter Project, select Application.

Create or select the parent directory for the new project folder.

When prompted for a Project Name, enter test_drive.

Press Enter.

Wait for project creation to complete.

Open the lib directory, then the main.dart.

To learn what each code block does, check out the comments in that Dart file.

The previous commands create a Flutter project directory called test_drive thatcontains a simple demo app that uses Material Components.

Run your sample Flutter app#

Run your example application on your desktop platform, in the Chrome web browser, in an iOS simulator, orAndroid emulator.

info提示

Though you can deploy your app to the web,the web target doesn't supporthot reload at this time.

Open the Command Palette.

Go to View > Command Palette orpress + Shift + P.

Type flutter.

Select the Flutter: Select Device.

If no devices are running, this command prompts you to enable a device.

Select a target device from Select Device prompt.

After you select a target, start the app.Go to Run >Start Debugging or press F5.

Wait for the app to launch.

You can watch the launch progress in the Debug Console view.

After the app build completes, your device displays your app.

Starter app on macOSTry hot reload#

Flutter offers a fast development cycle with Stateful Hot Reload,the ability to reload the code of a live running app withoutrestarting or losing app state.

You can change your app source code, run the hot reload command inVS Code, and see the change in your target device.

Open lib/main.dart.

Change the word pushed to clicked in the following string.It is on line 109 of the main.dart file as of this writing.

OriginalNew'You have pushed the button this many times:' ,'You have clicked the button this many times:' ,error重点提醒

Don't stop your app. Let your app run.

Save your changes: invoke Save All, or click Hot Reload.

Your app updates the string as you watch.

Starter app after hot reload

相关推荐: