Flutter第一个应用 #

flutter create my_first_app
cd my_first_app

flutter create --org com.example --platforms android,ios,web my_app

my_first_app/
├── android/           # Android原生项目
├── ios/               # iOS原生项目
├── web/               # Web项目
├── lib/               # Dart代码目录
│   └── main.dart      # 应用入口
├── test/              # 测试代码
├── pubspec.yaml       # 项目配置文件
└── README.md          # 项目说明

import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: const MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

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++;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
        title: Text(widget.title),
      ),
      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: FloatingActionButton(
        onPressed: _incrementCounter,
        tooltip: 'Increment',
        child: const Icon(Icons.add),
      ),
    );
  }
}

flutter devices

iPhone 15 Pro (simulator) • xxx • ios
sdk gphone64 arm64 (emulator) • emulator-5554 • android
Chrome (web) • chrome • web-javascript

flutter run

flutter run -d chrome
flutter run -d iPhone
flutter run -d emulator-5554

Performing hot reload...
Reloaded 1 of 123 libraries in 123ms.

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: '我的第一个应用',
      home: const MyHomePage(title: '欢迎学习Flutter'),
    );
  }
}

theme: ThemeData(
  colorScheme: ColorScheme.fromSeed(seedColor: Colors.blue),
  useMaterial3: true,
),

void _incrementCounter() {
  setState(() {
    _counter += 2;
  });
}

floatingActionButton: Row(
  mainAxisAlignment: MainAxisAlignment.end,
  children: [
    FloatingActionButton(
      heroTag: 'decrement',
      onPressed: () {
        setState(() {
          _counter--;
        });
      },
      child: const Icon(Icons.remove),
    ),
    const SizedBox(width: 10),
    FloatingActionButton(
      heroTag: 'increment',
      onPressed: _incrementCounter,
      child: const Icon(Icons.add),
    ),
  ],
),

void _incrementCounter() {
  print('Before: $_counter');
  setState(() {
    _counter++;
  });
  print('After: $_counter');
}

debugPrint('Counter value: $_counter');

flutter pub global activate devtools
flutter pub global run devtools

flutter build apk
flutter build apk --release
flutter build apk --split-per-abi

flutter build ios
flutter build ipa

flutter build web

flutter clean
flutter pub get
flutter run

flutter emulators
flutter emulators --launch <emulator_id>

flutter devices
flutter config --android-sdk /path/to/sdk