You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

如何在Windows和macOS平台上体验Flutter多窗口功能?

如何体验Flutter多窗口(Multi-Window)功能

嘿,我刚好跟进过Flutter多窗口功能的开发进展,给你梳理下具体的上手步骤,帮你快速体验这个功能:

1. 切换到Flutter Master分支

因为这个功能目前仅在Flutter的master分支中可用(已合并到engine,但尚未发布到稳定版),所以首先需要切换到最新的master版本:

flutter channel master
flutter upgrade

2. 准备项目并编写多窗口代码

你可以创建一个新的Flutter项目,或者在现有项目中添加以下代码来测试多窗口功能:
首先,在main.dart中导入dart:ui库:

import 'dart:ui';
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(
      home: Scaffold(
        appBar: AppBar(title: const Text('Flutter Multi-Window Demo')),
        body: Center(
          child: ElevatedButton(
            onPressed: () {
              // 创建新窗口
              final newWindow = PlatformDispatcher.instance.createWindow();
              // 给新窗口渲染内容
              newWindow.render(
                const MaterialApp(
                  home: Scaffold(
                    appBar: AppBar(title: Text('New Window')),
                    body: Center(child: Text('This is a separate window!')),
                  ),
                ),
              );
            },
            child: const Text('Open New Window'),
          ),
        ),
      ),
    );
  }
}

3. 运行项目测试

在Windows、macOS或Linux平台上运行项目(目前这个功能仅支持这三个桌面平台):

# Windows
flutter run -d windows

# macOS
flutter run -d macos

# Linux
flutter run -d linux

点击主窗口的按钮,就能看到新的窗口弹出来了。

注意事项

  • 这个功能还处于开发阶段,API可能会在后续版本中调整,不要用于生产环境
  • 如果你遇到问题,可以查看你关注的GitHub议题里的最新评论,那里会有开发者分享的最新进展和解决方案
  • 你提到的那份文档里详细说明了多窗口的设计思路、API细节和生命周期管理,建议结合代码测试一起阅读,能更深入理解功能逻辑

内容的提问来源于stack exchange,提问作者makri aymen abderraouf

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.04.27 12:27:28