Flutter工作空间管理插件workspace的使用

工作空间布局（Workspace Layout）

Flexible Columns Layout - Demo, Prototype

以下是使用 workspace 插件实现灵活列布局的一个演示：

示例代码

以下是一个完整的示例代码，展示如何使用 workspace 插件来管理 Flutter 应用的工作空间。

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

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

class WorkspaceApp extends StatelessWidget {
  WorkspaceApp({super.key}) {
    // 生成单元格的方法
    generateCell([String title = '']) => WorkspacePanel(widgetContent: Text(title));

    // 创建多个单元格
    final c0 = generateCell('0');
    final c1 = generateCell('1');
    final c2 = generateCell('2');
    final c3 = generateCell("3");

    // 将单元格添加到工作空间中
    workspace.add(c0);
    final c2_right = generateCell('2-r');
    workspace.addRight(workspace.root, c1);
    workspace.addBottom(workspace.root, c2);
    workspace.addRight(c2, c2_right);
    workspace.addRight(c2_right, generateCell('2-r-r'));
    workspace.addBottom(c2_right, generateCell('2-r-b'));
    workspace.addBottom(c2, generateCell('2-b'));
    final c1_right = generateCell('1-r');
    workspace.addRight(c1, c1_right);
    workspace.addRight(c1_right, generateCell('1-r-r'));
    workspace.addBottom(c1_right, c3);
    workspace.addBottom(c3, generateCell('3-b'));
    final c1_bottom = generateCell('1-b');
    final c1_bottom_bottom = generateCell('1-b-b');
    final c1_bottom_right = generateCell('1-b-r');
    workspace.addBottom(c1, c1_bottom);
    workspace.addRight(c1_bottom, c1_bottom_right);
    workspace.addBottom(c1_bottom, c1_bottom_bottom);
    workspace.addRight(c1_bottom_bottom, generateCell('1-b-b-r'));
    workspace.addRight(c1_bottom_right, generateCell('1-b-r-r'));

    // 可选：注释掉的代码用于扩展更多布局
    // workspace.addRight(c3, c4);
    // workspace.addRight(c4, generateCell());
    // workspace.addRight(c1, c2);
    // workspace.addBottom(c2, c5);
    // workspace.addRight(c5, c6);
    // workspace.addBottom(c6, generateCell());
  }

  final Workspace workspace = Workspace();

  // 主应用构建方法
  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      title: 'WorkspaceGrid',
      theme: ThemeData(scaffoldBackgroundColor: Colors.black12),
      home: Scaffold(
        body: WorkspaceInherited(
          workspace: workspace,
          child: LayoutBuilder(
            builder: (context, constraints) {
              return ValueListenableBuilder(
                valueListenable: workspace.panels,
                builder: (_, List<WorkspacePanel> value, __) {
                  return workspace.positionPanelsAt(
                    workspace.root,
                    parentWidth: constraints.maxWidth,
                    parentHeight: constraints.maxHeight,
                  );
                },
              );
            },
          ),
        ),
      ),
    );
  }
}