跳转到正文
YGJoon 技术博客

简单了解Flutter

发布于:
·1.6k 字 · 约 4 分钟·作者:
一套代码跑 iOS/Android/Web/桌面:自绘渲染的三层架构、万物皆 Widget 的组合思想,附 Hello Flutter 上手例子
简单了解Flutter文章封面
目录

为什么选择 Flutter?

很多人会问,为什么要选择 Flutter,而不是 React Native、Kotlin、Swift 这些原生或跨平台的框架呢?其实理由很简单:

Flutter 是怎么运作的?

Flutter 的架构分为三层:

这一层是开发者最常接触的部分,用 Dart 编写。你可以通过这层提供的各种控件(比如按钮、文本框、列表等)来快速搭建界面。

Flutter 的引擎是用 C++ 写的,主要负责渲染和事件处理。移动端默认使用自研的 Impeller 渲染器(Skia 作为备选),能够在屏幕上高效绘制 UI。

这个部分负责与操作系统交互,比如窗口管理、输入输出设备的处理等。每个平台都有它的嵌入层,比如 iOS 的是用 Objective-C 或 Swift 实现的,而 Android 则是 Java 或 Kotlin。

Flutter 的核心:Widget

Flutter 的一大特色就是它的 UI 是完全由 Widget 组成的。可以说,Flutter 的世界里一切皆 Widget。它们有点像是积木,你可以通过组合这些小组件,搭建出复杂的用户界面。

Flutter 的 Widget 分为两种:

顾名思义,它的状态是固定的,比如一个简单的文本显示组件。这类组件不需要响应用户的交互或者数据变化。

这类组件是可以随着用户的操作或者数据的变化而更新的,比如按钮点击后的状态变化、表单输入等。

每个 Widget 可以包含其他 Widget,通过这种嵌套的方式,构建出复杂的 UI 布局。灵活性和复用性是 Flutter 的一个大亮点。

实战:写一个简单的 Flutter 应用

让我们来通过代码感受一下 Flutter 的魅力。以下是一个简单的 “Hello, Flutter!” 应用:

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('Hello, Flutter!'),
        ),
        body: Center(
          child: Text(
            '欢迎来到 Flutter 的世界!',
            style: TextStyle(fontSize: 24),
          ),
        ),
      ),
    );
  }
}

这段代码通过几个简单的组件搭建了一个基本的应用:一个带标题的 AppBar 和一个居中的文本。运行起来效果很简单,但是已经包含了 Flutter 的基本框架。

Flutter 的日常功能

Flutter 提供了许多强大的功能,让开发变得简单高效。下面是一些常用的功能介绍:

使用 Navigator 可以实现页面之间的跳转和堆栈管理,非常适合复杂的应用。

使用 http、dio 库,可以方便地进行网络请求,获取数据并处理响应。

如果你需要保存用户偏好或者本地缓存,可以使用 shared_preferences 插件,操作简单且高效。

Flutter 提供了丰富的插件支持,涵盖了各种原生功能的调用,比如相机、蓝牙、地理位置等。你还可以根据需求自定义插件,实现更复杂的功能。

实战:我为什么选 Flutter

我手里的项目——几套 GetX 电商模板、Windows 桌面串口调光应用、音乐 App——清一色是 Flutter,选型理由很实际:一个人开发,一套 Dart 代码覆盖 iOS/Android/Windows,热重载让 UI 迭代快一个数量级。但取舍也真实存在:Dart 生态比前端小众,冷门硬件能力(比如串口)没有现成插件时,就得自己走 ffi/win32 做平台桥接;桌面端的体验也还在追赶移动端。我的判断是:Flutter 适合”UI 驱动、需要多端”的独立开发和小团队,重度依赖某平台独占能力的项目,原生或混合方案更稳。

参考:Flutter 官方文档 docs.flutter.dev

Flutter 的未来

随着 Flutter 的不断更新和发展,它的生态系统越来越成熟,功能也越来越强大。Flutter 3.0 的发布标志着它在 Web 和桌面端的支持已经趋于完善,未来会有更多领域采用 Flutter 作为首选框架。

无论是初学者还是经验丰富的开发者,Flutter 都提供了一个高效、优雅的解决方案。如果你希望用更少的时间和精力构建高质量的跨平台应用,Flutter 无疑是一个很好的选择。


分享这篇文章



相关文章

上一篇
Flutter PageView 组件详解
下一篇
Flutter Bloc 状态管理详解
YGJoon 的头像

YGJoon

记录 Flutter、Web 与原生移动端工程实践。更多背景见关于页,源码与项目见GitHub。