Flutter笔记 桌面端运用多窗口办理计划


作者李俊才 (jcLee95)blog.csdn.net/qq_28550263
邮箱 : 291148484@163.com
本文地址blog.csdn.net/qq_28550263…


【简介】:文本首要介绍 Flutter 桌面运用开发中多窗口办理。 辅导开发者能够更轻松地构建具有多窗口功用的桌面运用程序,介绍一种简略的方式来创立和办理多个窗口,支持在 Windows、macOS 和 Linux 上构建原生桌面运用程序。使得开发者能够轻松地创立新窗口,操控窗口的巨细、方位、最小化、最大化、全屏、封闭等操作,以及在不同窗口之间同享数据。
不同于单窗口,多串口中能够创立办理多个窗口,例如下main这个场景:

  • 运用启动时,翻开一个窗口作为主窗口;
  • 主窗口上一个创立子窗口,而且能够以 播送 或许 指定子窗口ID两种方式发送消息;
  • 子串口能够有多个,不论主窗口仍是众多子窗口,都以ID作为其通讯的标识;
  • 运用栏失活和激活时显现为两种颜色、两种文字予以区分;>
    另请拜见《桌面运用窗口定制库 bitsdojo_window》,地址:blog.csdn.net/qq_28550263…

这里仅仅基本完成了多窗口功用。关于更进一步的解说和杂乱需求的示例将在我 将于明年(2014)出书的《flutter运用开发——从基础到项目实战》一书中进行介绍,到时将发布出书信息,敬请重视。

目 录* * *


1. 概述

1.1 多窗口办理简介

desktop_multi_window它供给了一种简略的方式来创立和办理多个窗口。这个库的首要方针是使开发者能够更轻松地构建具有多窗口功用的桌面运用程序。这个库支持在WindowsmacOSLinux上构建原生桌面运用程序。它供给了一系列的API,使得开发者能够轻松地创立新窗口,操控窗口的巨细方位最小化最大化全屏封闭。此外,它还供给了在不同窗口之间同享数据(窗口通讯)的功用。

运用desktop_multi_window,开发者能够专注于运用程序的中心功用,而不需要花费很多的时间和精力在窗口办理上。这使得Flutter桌面运用开发变得更加简略和高效。

1.2 窗口生命状况简介

在运用desktop_multi_window库时,还有一个配套运用的库是desktop_lifecycle。在桌面运用中,一个窗口在任何时候都可能被用户激活或非激活。例如,当用户点击一个窗口或许运用 Alt Tab 切换到一个窗口时,该窗口就会被激活;当用户点击其他窗口或许运用 Alt Tab 切换到其他窗口时,该窗口就会被非激活。这些状况改变对于桌面运用的用户体会非常重要,因而需要被正确地处理。

2. 库的装置和装备

2.1 增加多窗口依靠

要在Flutter项目中运用desktop_multi_window,首先需要在项目的 pubspec.yaml 文件中增加desktop_multi_window作为依靠并保存。具体过程如下:

  1. 翻开pubspec.yaml文件。
  2. dependencies部分增加desktop_multi_window的依靠,如下所示:
dependencies:
  flutter:
    sdk: flutter
  desktop_multi_window: ^0.2.0
  1. 保存 pubspec.yaml 文件。
  2. 在终端中运转 flutter pub get 指令,以获取 desktop_multi_window 的依靠包。

2.2 装备窗口状况依靠

要在 Flutter 项目中运用desktop_lifecycle,首先需要在项目的pubspec.yaml文件中增加desktop_lifecycle的依靠。具体过程如下:

  1. 翻开 pubspec.yaml 文件,在 dependencies 部分增加 desktop_lifecycle 的依靠并保存。如下所示:
dependencies:
  flutter:
    sdk: flutter
  desktop_lifecycle: ^0.1.1
  1. 在终端中运转flutter pub get指令,以获取desktop_lifecycle的依靠包。

2.3 初始化窗口办理

在增加了 desktop_multi_window 的依靠之后,你能够在项目中运用 desktop_multi_window。以下是初始化的过程:

  1. 在项目的 main.dart 文件中导入 desktop_multi_window 库,如下所示:
// mian函数中对窗口初始化形式进行操控
if (args.firstOrNull == 'multi_window') {
  runApp(const SubWindow());
}else{
  runApp(const MainWindow());
}
  1. 在你的 Flutter 代码中,你能够运用WindowController类来操控窗口。例如,你能够运用WindowController.fromWindowId(windowId) 来获取一个窗口的操控器,然后运用这个操控器来操控窗口的巨细、方位、标题等特点。

至此,desktop_multi_window 的装置和设置就完成了。接下来,你就能够运用 desktop_multi_window 来创立和办理你的 Flutter 桌面运用程序的多个窗口了。

3. 创立和办理窗口

3.1 创立新窗口

在 desktop_multi_window 中,新窗口的创立是通过 DesktopMultiWindow.createWindow 办法完成的。这个办法接纳一个 JSON 字符串作为参数,该字符串包含了新窗口的一些初始设置。例如:

final window = await DesktopMultiWindow.createWindow(jsonEncode({
  'args1': 'Sub window',
  'args2': 100,
  'args3': true,
  'business': 'business_test',
}));

3.2 办理窗口特点

你能够运用 WindowController 类来办理窗口的特点,如巨细、方位、标题等。例如,你能够运用以下代码来设置窗口的巨细和方位:

window
  ..setFrame(const Offset(0, 0) & const Size(1280, 720))
  ..center()
  ..setTitle('Another window')
  ..show();

在上述代码中,setFrame 办法用于设置窗口的巨细和方位,center 办法用于将窗口居中,setTitle 办法用于设置窗口的标题,show 办法用于显现窗口。

3.3 窗口的最小化、最大化、全屏和封闭操作

你能够运用 WindowController 类来进行窗口的最小化、最大化、全屏和封闭操作。例如,你能够运用以下代码来最小化窗口:

window.minimize();

你能够运用以下代码来最大化窗口:

window.maximize();

你能够运用以下代码来全屏窗口:

window.fullScreen();

你能够运用以下代码来封闭窗口:

window.close();

4. 窗口活动状况办理

4.1 监听窗口激活状况

desktop_lifecycle 供给了 DesktopLifecycle 类,你能够通过 DesktopLifecycle.instance.isActive 来获取当时窗口的激活状况。例如:

bool isActive = DesktopLifecycle.instance.isActive.value;

你也能够增加监听器来监听窗口的激活状况改变。例如:

DesktopLifecycle.instance.isActive.addListener(() {
  bool isActive = DesktopLifecycle.instance.isActive.value;
  // 在这里处理窗口的激活状况改变
});

4.2 处理窗口激活和非激活状况

当窗口的激活状况发生改变时,你能够在监听器中进行相应的处理。例如,你能够在窗口被激活时履行一些操作,而在窗口被非激活时履行一些其他的操作。以下是一个示例:

DesktopLifecycle.instance.isActive.addListener(() {
  bool isActive = DesktopLifecycle.instance.isActive.value;
  if (isActive) {
    // 窗口被激活,履行一些操作
  } else {
    // 窗口被非激活,履行一些其他的操作
  }
});

5. 在不同窗口之间同享数据

desktop_multi_window供给了一种在不同窗口之间同享数据的机制。你能够运用DesktopMultiWindow.invokeMethod办法来向指定的窗口发送数据,然后在那个窗口中运用DesktopMultiWindow.setMethodHandler办法来接纳和处理这些数据。以下是一个示例,展现了如何向指定的窗口发送数据:

final windowId = 1; // 窗口的 ID
final data = 'Hello, world!'; // 要发送的数据
DesktopMultiWindow.invokeMethod(windowId, 'onSend', data);

在上述代码中,invokeMethod 办法的第一个参数是窗口的 ID,第二个参数是办法名,第三个参数是要发送的数据。

然后,你能够在接纳数据的窗口中运用 setMethodHandler 办法来接纳和处理这些数据:

DesktopMultiWindow.setMethodHandler((MethodCall call, int fromWindowId) async {
  if (call.method == 'onSend') {
    final data = call.arguments; // 接纳到的数据
    // 在这里处理数据
  }
});

在上述代码中,setMethodHandler办法接纳一个回调函数,这个函数有两个参数:一个是 MethodCall 目标,包含了办法名和参数;另一个是发送数据的窗口的 ID。你能够在这个回调函数中依据办法名来判断数据的类型,然后进行相应的处理。