Flutter: AppBarの外にTabBarを配置する

プログラミング
スポンサーリンク




Flutterで、TabBarをAppBarの外に配置させるのに少々手間取ったので、備忘録としてソースコードだけ載せときます。

クラス化しているので、そのままコピペして使えると思います。

 

スポンサーリンク

ソースコード

import 'package:flutter/material.dart';

// ------------------------------------
// AppBarの外にTabBarを表示するやつ
// ------------------------------------
class WithoutTabBar extends StatelessWidget {
  final List<Widget> tabHeader;
  final TabBar tabBar;
  final TabBarView tabBarView;

  WithoutTabBar({
    Key key,
    this.tabHeader,
    this.tabBar,
    this.tabBarView,
  })  : assert(tabHeader != null),
        assert(tabBar != null),
        assert(tabBarView != null),
        assert(tabBar.tabs.length == tabBarView.children.length),
        super(key: key);

  @override
  Widget build(BuildContext context) {
    return Container(
      child: Column(
        children: [
          Column(
            children: tabHeader,
          ),
          tabBar,
          Expanded(
            child: tabBarView,
          )
        ],
      ),
    );
  }
}

 

 

コメント

タイトルとURLをコピーしました