Preface: As a mobile application development framework, Flutter has many advantages and some limitations. The biggest advantage is - cross-platform development: Flutter can perform cross-platform development on multiple platforms such as iOS and Android, and use a set of codes to write applications, saving development time and costs.
Flutter can compile programs for the following platforms:
1. Android: Flutter can generate APK files of Android applications and run them on Android devices.
2. iOS: Flutter can generate IPA files for iOS applications and run them on iOS devices.
3. Web: Flutter can be compiled into JavaScript to generate applications that can run in a web browser.
4. Windows: Flutter can generate desktop applications on the Windows operating system.
5. macOS: Flutter can generate desktop applications on the macOS operating system.
6. Linux: Flutter can generate desktop applications on the Linux operating system.
It is worth noting that although Flutter can be compiled into applications for different platforms, the experience on each platform may be different, and some platform-related adjustments and optimizations may be required.
Let's take Android development as an example,
To build a Flutter development environment, please follow the steps below:
1. Install the Flutter SDK:
First, you need to download and install the Flutter SDK. On the official Flutter website ( https://flutter.dev ), select the installation package corresponding to your operating system to download. Unzip the downloaded file, and add the bin directory of flutter to the PATH environment variable of the system, so that you can use the flutter command directly on the command line.
Install the Dart SDK: Flutter uses the Dart language for development, so you also need to install the Dart SDK. The Dart SDK is already included in the Flutter SDK, so you don't need to install it separately.
2. Run flutter doctor on the command line to check the installation, configuration environment and dependencies of the Flutter SDK, and give corresponding suggestions and tips.
-
[×] indicates that it is not working properly
-
[!] indicates that there are still some problems
-
Only when all are [√], the system environment is completely installed, and your inspection report is correct
See what configuration is missing, what is needed, and search for what configuration to add
3. Configure the editor:
Choose an editor that suits you for Flutter development. Commonly used editors include Android Studio, Visual Studio Code (VS Code) and IntelliJ IDEA. Install the editor of your choice, I chose Android Stuido, search for Dart and flutter plugins in File>Setting>Plugins, and install them, these two plugins can provide code completion, debugging and other features to improve development efficiency.
add tool
4. Create a new flutter project
The next step is fine, click Run
In the project directory, your application's UI code is located in lib/main.dart.
4. Configure the emulator or real device:
In order to run and debug a Flutter application on an emulator or a real device, you need to configure the device accordingly. For Android development, you can use an Android emulator or connect a real device via USB. For iOS development, you need to use Xcode to emulate or connect to a real device.
During the compilation process, some files were not successfully downloaded. Click run again, and I can run the display directly here.
6. Compile apk
Or command line, enter flutter build apk in the corresponding directory to compile apk
7. The main content file lib/main.dart
After the content is modified and saved, the view can be updated, that is, the ability to quickly debug. This alone makes me have a great impression of flutter
import 'package:flutter/material.dart';
void main() {
runApp(const MyApp());
}
/// 这里我们的MyApp是一个类，继承了StatelessWidget
class MyApp extends StatelessWidget {
const MyApp({super.key});
/// 这个组件是这个app的根 这是一个无状态部件，然后实现构造方法，
@override
Widget build(BuildContext context) {
///构造方法里面通过MaterialApp()函数定义风格，然后是标题、主题和主页面信息，
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
///这里有一个Colors.blue，你试一下改成red，或者green。
///如果你这时候项目是运行在模拟器 或者真机上的话，你可以修改后Ctrl + S 进行保存。就能同步展示
colorScheme: ColorScheme.fromSeed(seedColor: Colors.green),
useMaterial3: true,
),
/// 这里主页面home中调用MyHomePage()函数，也就是我们当前页面所显示的内容。
home: const MyHomePage(title: 'Flutter Demo Home Page'),
);
// return MaterialApp(
// title: '天气预报小程序',
// theme: ThemeData(
// primarySwatch: Colors.blue,
// ),
// home: WeatherPage(),
// );
}
}
/// 这里MyHomePage继承StatefulWidget，
/// 这是一个有状态的部件，这里就需要一个状态了，
/// 通过createState()得到一个_MyHomePageState，
/// 这个_MyHomePageState()就是这个页面的主要内容了，它里面是
class MyHomePage extends StatefulWidget {
const MyHomePage({super.key, required this.title});
final String title;
@override
State<MyHomePage> createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
int _counter = 0;
void _incrementCounter() {
setState(() {
_counter++;
});
}
/// 在 build 方法中，我们通常通过对基础 Widget 进行相应的 UI 配置，或是组合各类基础 Widget 的方式进行 UI 的定制化。
@override
Widget build(BuildContext context) {
///这里返回一个Scaffold，这是一个脚手架，用来构建页面
return Scaffold(
///然后我们看Scaffold中的内容，AppBar 是页面的导航栏，我们直接将 MyHomePage 中的 title 属性作为标题使用。
appBar: AppBar(
backgroundColor: Theme.of(context).colorScheme.inversePrimary,
///这里我们从App.build方法创建的MyHomePage对象中获取值，并使用它来设置appbar的标题。
title: Text(widget.title),
),
///body 则是一个 Text 组件，显示了一个根据 _counter 属性可变的文本：‘You have pushed the button this many times:$_counter’。
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
const Text(
'You have pushed the button this many times:',
),
Text(
'$_counter',
style: Theme.of(context).textTheme.headlineMedium,
),
],
),
),
///floatingActionButton，则是页面右下角的带“+”的悬浮按钮。我们将 _incrementCounter 作为其点击处理函数。
floatingActionButton: FloatingActionButton(
onPressed: _incrementCounter,
tooltip: 'Increment',
child: const Icon(Icons.add),
),
);
}
}
https://blog.csdn.net/ly_xiamu/article/details/131931803
reference:
https://www.cnblogs.com/libo-web/p/16060590.html
Building Android Flutter development environment - Programmer Sought
Create value, happy to share! 776147358