dghub_tab 是一个用于 Flutter 的标签页管理插件，它可以帮助你轻松地创建和管理标签页。以下是使用 dghub_tab 的基本步骤：

1. 添加依赖

首先，你需要在 pubspec.yaml 文件中添加 dghub_tab 依赖：

dependencies:
  flutter:
    sdk: flutter
  dghub_tab: ^1.0.0  # 请使用最新版本

然后运行 flutter pub get 来安装依赖。

2. 导入包

在你的 Dart 文件中导入 dghub_tab 包：

import 'package:dghub_tab/dghub_tab.dart';

3. 创建标签页

你可以使用 DghubTab 组件来创建标签页。以下是一个简单的示例：

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

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

class MyApp extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      home: TabDemo(),
    );
  }
}

class TabDemo extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Dghub Tab Demo'),
      ),
      body: DghubTab(
        tabs: [
          DghubTabItem(
            title: Text('Tab 1'),
            content: Center(child: Text('Content of Tab 1')),
          ),
          DghubTabItem(
            title: Text('Tab 2'),
            content: Center(child: Text('Content of Tab 2')),
          ),
          DghubTabItem(
            title: Text('Tab 3'),
            content: Center(child: Text('Content of Tab 3')),
          ),
        ],
      ),
    );
  }
}

4. 自定义标签页

你可以通过 DghubTab 的构造函数来自定义标签页的外观和行为。以下是一些常用的属性：

• initialIndex: 初始显示的标签页索引。
• indicatorColor: 标签指示器的颜色。
• indicatorWeight: 标签指示器的厚度。
• labelColor: 选中标签的文本颜色。
• unselectedLabelColor: 未选中标签的文本颜色。
• labelStyle: 选中标签的文本样式。
• unselectedLabelStyle: 未选中标签的文本样式。
• isScrollable: 标签是否可以滚动。

5. 处理标签页切换

你可以通过 onTabChanged 回调来处理标签页切换事件：

DghubTab(
  tabs: [
    DghubTabItem(
      title: Text('Tab 1'),
      content: Center(child: Text('Content of Tab 1')),
    ),
    DghubTabItem(
      title: Text('Tab 2'),
      content: Center(child: Text('Content of Tab 2')),
    ),
    DghubTabItem(
      title: Text('Tab 3'),
      content: Center(child: Text('Content of Tab 3')),
    ),
  ],
  onTabChanged: (index) {
    print('Switched to tab $index');
  },
)

6. 动态添加或删除标签页

你可以通过 DghubTabController 来动态添加或删除标签页：

class TabDemo extends StatefulWidget {
  [@override](/user/override)
  _TabDemoState createState() => _TabDemoState();
}

class _TabDemoState extends State<TabDemo> {
  DghubTabController _tabController;

  [@override](/user/override)
  void initState() {
    super.initState();
    _tabController = DghubTabController();
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Dghub Tab Demo'),
      ),
      body: DghubTab(
        controller: _tabController,
        tabs: [
          DghubTabItem(
            title: Text('Tab 1'),
            content: Center(child: Text('Content of Tab 1')),
          ),
          DghubTabItem(
            title: Text('Tab 2'),
            content: Center(child: Text('Content of Tab 2')),
          ),
        ],
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          setState(() {
            _tabController.addTab(
              DghubTabItem(
                title: Text('New Tab'),
                content: Center(child: Text('Content of New Tab')),
              ),
            );
          });
        },
        child: Icon(Icons.add),
      ),
    );
  }
}