An Introduction to Flutter: Features, History, and Sample Code

Flutter is a Google‑developed UI toolkit that enables a single codebase to run on both Android and iOS while delivering native performance and deep platform integration.

Built with the Dart programming language, Flutter is easy to pick up for developers familiar with Java or JavaScript, offering a reactive framework and a UI design model similar to web development.

The framework aims to provide beautiful, high‑performance, high‑stability, high‑frame‑rate, low‑latency cross‑platform mobile applications, with UI components that feel native on each platform.

Compared with React Native, Flutter also offers a reactive view system and delivers a truly native experience, such as platform‑specific back navigation icons and scrolling physics.

Flutter was first announced at Google I/O 2017, entered beta in early 2018, reached beta 3 in May, and later released its first preview version before the stable 1.0 launch, quickly gaining over 27 k GitHub stars and a 50 % increase in active users.

Key advantages include high productivity (single codebase for Android and iOS, less code for more features, hot‑reload for rapid iteration and debugging), elegant customizable UI (built‑in Material Design and Cupertino widgets), and a modern responsive framework with powerful APIs for animation, gestures, and effects.

Example of a simple stateful widget in Dart:

class CounterState extends State<Counter> {
  int counter = 0;

  void increment() {
    // Notify Flutter that the state has changed; Flutter will call build() to update UI
    setState(() {
      counter++;
    });
  }

  Widget build(BuildContext context) {
    // This method is re‑executed after setState()
    return new Row(
      children: <Widget>[
        new RaisedButton(
          onPressed: increment,
          child: new Text('Increment'),
        ),
        new Text('Count: $counter'),
      ],
    );
  }
}

Flutter also allows access to native platform features via platform channels. A sample method to retrieve the battery level demonstrates this:

Future<Null> getBatteryLevel() async {
  var batteryLevel = 'unknown';
  try {
    int result = await methodChannel.invokeMethod('getBatteryLevel');
    batteryLevel = 'Battery level: $result%';
  } on PlatformException {
    batteryLevel = 'Failed to get battery level.';
  }
  setState(() {
    _batteryLevel = batteryLevel;
  });
}

Developers can mix Flutter with existing native code (Java, Swift, ObjC) to reuse libraries and SDKs, providing a unified development experience across platforms.

The first preview release added 32‑bit iOS (ARMv7) support, improved the video player package, introduced Firebase Dynamic Links, and enhanced documentation for embedding Flutter widgets in existing apps. The VS Code Flutter extension also gained new features such as an outline view and emulator launch.

To upgrade an existing Flutter installation on the beta channel, simply run: $ flutter upgrade For learning Flutter quickly, the official Chinese site (https://flutter-io.cn/), community videos, newsletters, GitHub repository, and various tutorials are recommended.