패키지, 저장소 및 앱 카테고리 검색

패키지 상세v0.0.2

golden_layout

http://golden-layout.com/ 기반의 Flutter용 내부 창 라이브러리

30일 다운로드
21
좋아요
36
Pub 점수
40

패키지 설치

flutter pub add golden_layout

패키지 개요

공개 정보를 바탕으로 생성한 선택 가이드입니다.

Golden Layout는 Flutter 애플리케이션에 Golden Layout 라이브러리의 강력한 창 관리 기능을 가져오는 Flutter 패키지입니다. 개발자들이 여러 패널을 사용해 복잡하고 크기 조절 및 드래그 가능한 UI 레이아웃을 만들 수 있으며, 중첩된 배열과 동적 콘텐츠를 지원합니다. 내부 애플리케이션 인터페이스용으로 설계되어 대시보드, IDE 또는 데이터 시각화 플랫폼과 같은 사용자 정의 작업 공간이 필요한 도구에 적합합니다. 패키지는 Flutter 위젯 시스템에 원활하게 통합되며 성능과 반응성을 유지합니다.

사용 사례

  • 대시보드 인터페이스
  • IDE와 유사한 개발 환경
  • 데이터 시각화 도구
  • 다중 패널 보고 앱
  • 사용자 작업 공간 맞춤 설정

주요 기능

  • 크기 조절 및 드래그 가능한 패널
  • 중첩 레이아웃 지원
  • 동적 패널 배치
  • 다양한 콘텐츠 유형 지원
  • Flutter 위젯과의 통합

적합한 대상

  • 복잡한 UI를 구축하는 개발자
  • 유연한 워크스페이스 레이아웃이 필요한 애플리케이션
  • 다중 패인 인터페이스를 요구하는 도구
  • 데스크톱과 유사한 Flutter 애플리케이션
  • UI 중심의 내부 도구

고려 사항

  • 모바일 우선 디자인에 최적화되지 않음
  • 사용 가능한 문서가 제한적입니다
  • 고급 사용 사례를 위해 맞춤형 스타일링이 필요할 수 있습니다
  • 데스크톱 또는 태블릿 환경에 가장 적합
  • 상태 관리의 잠재적 복잡성

원본 README

연결된 소스 저장소의 README 원문 스냅샷입니다. 최신 내용은 저장소에서 확인하세요.

Buy Me A Coffee Donate golden_layout

golden_layout

A Flutter inspired package from http://golden-layout.com/

Demo: https://rodydavis.github.io/golden_layout/

screenshot

Example

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

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
        visualDensity: VisualDensity.adaptivePlatformDensity,
      ),
      home: MyHomePage(title: 'Flutter Golden Layout'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  final _controller = WindowController();
  int _count = 0;

  @override
  void initState() {
    final _group = WindowGroup();
    _group.addTab(_getTab(_count++));
    (_controller.base as WindowColumn).children.add(_group);
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
        actions: [
          IconButton(
            tooltip: 'Add Window',
            icon: Icon(Icons.restore),
            onPressed: () {
              if (mounted)
                setState(() {
                  _controller.base =
                      WindowColumn([WindowGroup()..addTab(_getTab(_count++))]);
                });
            },
          ),
          IconButton(
            tooltip: 'Add Group',
            icon: Icon(Icons.list),
            onPressed: () {
              if (mounted)
                setState(() {
                  final _group = WindowGroup();
                  _group.addTab(_getTab(_count++));
                  (_controller.base as WindowColumn).children.add(_group);
                });
            },
          ),
          IconButton(
            tooltip: 'Add Row',
            icon: Icon(Icons.category),
            onPressed: () {
              if (mounted)
                setState(() {
                  final _group1 = WindowGroup()..addTab(_getTab(_count++));
                  final _group2 = WindowGroup()..addTab(_getTab(_count++));
                  (_controller.base as WindowColumn)
                      .children
                      .add(WindowRow([_group1, _group2]));
                });
            },
          ),
        ],
      ),
      body: GoldenLayout(
        controller: _controller,
      ),
    );
  }

  WindowTab _getTab(int count) {
    return WindowTab(
        title: 'Window $count',
        child: Container(color: Colors.red[100 * count]));
  }
}

카테고리

소스 저장소

이 패키지를 사용하는 프로젝트

아직 데이터가 없습니다.