flutter 不用状态栏的导航栏

flutter 不用状态栏的导航栏,第1张

参考

//旅拍
class TravelPage extends StatefulWidget {
  TravelPage({Key? key}) : super(key: key);

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

class _TravelPageState extends State<TravelPage>
    with SingleTickerProviderStateMixin {
  List<String> tabs = ["推荐", "附近", "热门", "旅行热点", "露营初体验", "酒店民宿", "美食探店", "亲子", "小众", "自驾", "网红", "逛展"];

  late TabController _controller;

  @override
  void initState() {
    print("TravelPage initState...");
    super.initState();
    _controller = TabController(length: tabs.length, vsync: this);
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
        children: [
          Container(
            color: Colors.white,
            padding: EdgeInsets.only(top: 30),
            child: TabBar(
                controller: _controller,
                isScrollable: true,
                labelColor: Colors.black,
                labelPadding: EdgeInsets.fromLTRB(20, 0, 20, 5),
                indicator: UnderlineTabIndicator(
                  borderSide: BorderSide(color: Color(0xff1fcfbb), width: 3),
                  insets: EdgeInsets.only(bottom: 10),
                ),
                tabs: tabs.map<Tab>((String e) {
                  return Tab(text: e);
                }).toList()),
          ),
          Flexible(
              child: TabBarView(
            controller: _controller,
            children: tabs.map<Container>((String e) {
              return Container(
                child: Center(
                  child: Text(e, textScaleFactor: 5),
                ),
              );
            }).toList(),
          ))
        ],
      ),
    );
  }

  @override
  void dispose() {
    _controller.dispose();
    super.dispose();
  }
}

我自己的代码

import 'package:flutter/material.dart';
import 'AudioPlayer.dart';
import 'DynamicRecommendNav.dart';

// /*
// *音乐播放器顶部的导航界面
// */
class PlayerNavigation extends StatefulWidget {
  const PlayerNavigation({key}) : super(key: key);

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

class PlayerState extends State<PlayerNavigation>
    with SingleTickerProviderStateMixin {
  List<String> tabs = ["歌曲", "歌詞"];

  TabController _controller;

  @override
  void initState() {
    super.initState();
    _controller = TabController(length: tabs.length, vsync: this);
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
        children: [
          Container(
            //顶部导航栏的背景颜色
            decoration: BoxDecoration(color: Color(0xFF1F1F1F)),
            //以行的方式排放
            child:Row(
              //居中
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                Container(
                  // margin: const EdgeInsets.only(right: 70),
                  padding: EdgeInsets.only(top: 30),
                  width: 50,
                  child: Image.asset(
                    'assets/base_widgets/icon_player_rounded.png',
                    fit: BoxFit.fitWidth,
                  ),
                ),
                  Container(
                    color: Color(0xFF1F1F1F),
                    padding: EdgeInsets.only(top: 30),
                    child: TabBar(
                        controller: _controller,
                        isScrollable: true,
                        labelColor: Colors.white,
                        labelPadding: EdgeInsets.fromLTRB(20, 0, 20, 5),
                        indicator: UnderlineTabIndicator(
                          // borderSide: BorderSide(color: Color(0xff1fcfbb), width: 3),
                          insets: EdgeInsets.only(bottom: 10),
                        ),
                        tabs: tabs.map<Tab>((String e) {
                          return Tab(text: e);
                        }).toList()),
                  ),
                Container(
                  margin: const EdgeInsets.only(),
                  padding: EdgeInsets.only(top: 30),
                  width: 50,
                  child: Image.asset(
                    'assets/base_widgets/icon_player_share.png',
                    fit: BoxFit.fitWidth,
                  ),
                ),
              ],
            ),
          ),

          Flexible(
              child: TabBarView(
            controller: _controller,
            children: const <Widget>[
              AudioPlay(),
              AudioPlay(),
            ],
          ))
        ],
      ),
    );
  }

  @override
  void dispose() {
    _controller.dispose();
    super.dispose();
  }
}

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/994560.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-21
下一篇 2022-05-21

发表评论

登录后才能评论

评论列表(0条)

保存