Flutter桌面应用程序开发完整指南

Viewed 0

引言

开发人员可以选择编写多种类型的应用程序:控制台应用程序、移动应用程序、Web应用程序和桌面应用程序。桌面应用程序在具有各种UI元素的系统窗口内运行。如果您要制作桌面应用程序,有多种不同的框架、UI工具包和编程语言可供选择。

有两种类型的桌面应用程序开发API:特定于平台的和跨平台的。特定于平台的API仅支持一种目标操作系统,例如Cocoa API为macOS平台开发提供接口。跨平台API允许开发人员使用单个通用API为多个操作系统制作桌面应用程序。

如今,跨平台开发框架流行的原因包括:开发人员可以为多个平台维护单一的代码库,因为跨平台框架的API为特定于平台API提供了很好的抽象;快速功能交付,无需通过编写特定于平台代码为不同操作系统实现相同功能。

在本文中,我将解释如何使用Flutter创建、构建和发布原生跨平台桌面应用程序,并讨论Flutter受欢迎的原因。

什么是Flutter?

Flutter是一个跨平台的应用程序开发框架,我们可以使用它为多个平台构建本地编译的应用程序:移动、桌面和Web。已知支持的输出目标是Android、iOS、HTML、HTML Canvas、Linux、Windows、macOS和Fushia。Flutter使用Dart作为应用程序开发语言。

Flutter目前更专注于移动应用程序开发,但也支持基于桌面的目标。该框架带有自己的小部件工具包。当特定的Flutter应用程序启动时,Flutter将通过Skia图形库呈现应用程序的UI控件。

为什么Flutter如此受欢迎?

在跨平台框架开发领域,最关键的问题是如何放置所有平台的抽象层,即如何为开发人员提供通用API而不会给应用程序带来性能问题。Electron等桌面应用程序开发框架引入了用于渲染的Web浏览器,Apache Cordova和Ionic移动应用程序开发框架以类似方式解决这个问题。尽管这些框架为开发人员提供了简单的跨平台API,但由于基于Web浏览器的渲染,仍存在严重的性能问题。

Flutter通过Dart库提供简单的跨平台API,同时还保持卓越的性能。

使用Flutter开发桌面应用程序

在本教程中,我将展示如何使用Flutter制作一个简单的跨平台桌面应用程序。

搭建Flutter开发环境

安装Flutter相对简单,通常涉及输入一些终端命令。之后,我们需要启用桌面开发模式。使用以下命令:

flutter config --enable-<platform>-desktop

其中<platform>可以是linux、windows或macos。如果启用了桌面模式,flutter devices命令应列出您当前的操作系统。

创建一个新的Flutter应用

我们可以使用create命令创建一个新应用程序:

flutter create desktop-app

上面的命令将搭建一个简单的入门项目。入门项目包含最少的代码和注释,以帮助我们了解Flutter的工作原理。

lib/main.dart文件包含应用程序的主要源代码。修改主要源代码以创建一个简单的“Hello World”应用程序:

import 'package:flutter/material.dart';
void main() {
  runApp(MyApp());
}
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'TextPad',
      theme: ThemeData(
        primarySwatch: Colors.green,
      ),
      home: Scaffold(
        body: Center(
          child: Text('Hello World')
        ),
      ),
    );
  }
}

编辑源文件后,输入以下命令来运行您的应用程序:

flutter run -d <platform>

其中<platform>是linux、windows或macos。上述命令将在原生窗口中打开Flutter“Hello World”应用程序,窗口样式根据当前操作系统和系统主题配置进行设置。

调试Flutter应用

Flutter开发环境支持热重载功能。当应用程序在调试模式下运行时,我们可以r在输入flutter run命令的控制台中按键来触发热重载。尝试更改文本小部件的内容以测试此功能。

实现跨平台桌面应用程序

让我们用Flutter实现一个小的跨平台桌面应用程序。我们将制作一个名为“TextPad”的小型文本编辑器应用程序。TextPad有一个大的多行文本字段,可以在其中输入笔记,还有一个操作按钮将当前笔记保存到文件中。保存文件后,TextPad将显示任务完成的通知消息。

与之前的Hello-World应用程序类似,将以下源代码添加到主应用程序源文件中:

import 'dart:io';
import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
    final textController = new TextEditingController();
    final globalKey = GlobalKey<ScaffoldState>();
    final String fileName = 'textPadNote.txt';

     Future<void> _exportToFile(BuildContext context) async {
       final File file = File('${Directory.current.absolute.path}/${fileName}');
       final snackBar = SnackBar(content: Text('Saved to: ${file.path}'));

       await file.writeAsString(textController.text);
       globalKey.currentState.showSnackBar(snackBar);
    }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'TextPad',
      theme: ThemeData(
                brightness: Brightness.dark,
           ),
      home: Scaffold(
        key: globalKey,
        appBar: AppBar(
          title: Text('TextPad'),
          actions: <Widget>[
              IconButton(
                    icon: const Icon(Icons.save),
                    tooltip: 'Export to ${fileName}',
                    onPressed: () {_exportToFile(context);}
                  )]
        ),
        body: Center(
          child: TextField(
                controller: textController,
                maxLines: null,
                keyboardType: TextInputType.multiline,
                expands: true,
                  decoration: InputDecoration(
    hintText: 'Play with your notes here...',
    contentPadding: EdgeInsets.all(12.0)
  ),
          ),
        ),
      ),
    );
  }
}

使用可移植的二进制文件构建您的Flutter桌面应用程序

在发布应用程序之前,可以构建Flutter应用程序以获取可移植的二进制文件。这些二进制文件可以与用户或测试人员共享。使用以下命令制作优化的二进制文件:

flutter build <platform>

其中<platform>是linux、windows或macos。

如何发布您的应用程序

发布Flutter应用程序有多种方式,部署方式取决于操作系统的类型。例如,为Linux用户发布应用程序,可以将Flutter应用程序部署到Snapcraft软件商店。为Windows用户部署应用程序,可以借助第三方工具制作Windows安装程序包(MSI)或新的Windows应用程序包(MSIX)。

以下是一种发布Windows版Flutter应用的方法:

1. 为现有的Flutter应用程序添加桌面支持

要将桌面支持添加到现有Flutter项目,请从项目根目录在终端中运行以下命令:

flutter create --platforms=windows,macos,linux .

这会将必要的桌面文件和目录添加到现有Flutter项目中。要仅添加特定桌面平台,将platforms列表更改为仅包含要添加的平台。

2. 创建main_desktop.dart文件

例如,如果main.dart文件包含标准代码,可以创建main_desktop.dart文件并添加以下关键行:

debugDefaultTargetPlatformOverride = TargetPlatform.fuchsia;

以确保桌面平台正确识别。

3. hover安装和环境配置

使用以下命令安装hover:

go get -u github.com/go-flutter-desktop/hover

hover将出现在Go语言的SDK的bin文件夹下。如果遇到环境变量错误,如缺少gcc,需要安装MinGW-w64并配置环境变量。例如,将MinGW的bin目录(如C:\Program Files (x86)\mingw-w64\i686-6.2.0-posix-sjlj-rt_v5-rev1\mingw32\bin)添加到系统PATH中。

4. 初始化并打包

在Flutter项目目录下,运行以下命令初始化hover:

hover init github.com/my-organization/flutter_bloc_super

其中地址前缀固定,后面写项目名称。这将生成一个go文件夹。然后,执行构建命令以生成可执行文件。生成的exe文件可以在指定路径中找到,双击即可运行。

常见问题

如果报错如“cc1.exe: sorry, unimplemented: 64-bit mode not compiled in”,主要原因是本地cc1.exe版本不是64位的。解决方案是下载64位版本的MinGW-w64并重新配置环境变量。

结论

如今,Electron在桌面应用程序开发中非常流行,因为它允许开发人员使用Web技术制作桌面应用程序。然而,由于高物理资源使用率,Electron应用程序经常成为膨胀软件。Flutter的性能比Electron好,因为它不在Web浏览器上执行应用程序的GUI逻辑。

Flutter带来了一些学习曲线,包括使用Dart编程语言和全新的小部件工具包。但Flutter的初始阶段以其令人印象深刻的整体性能和功能给开发者留下了深刻印象。我相信Flutter桌面很快会与Electron竞争,为跨平台开发提供高效解决方案。

0 Answers