标签栏视图问题

Question

Tab bar View

问题如果我尝试添加标签栏视图 显示水平视口被赋予无限高度 是否有任何其他替代标签栏视图来解决此问题

GitHub 链接：https://github.com/RakulAgn/MyFlutterApp/blob/master/ui/lib/Pages/LandingPage.dart

Answer 1

您好，我检查了您的代码，您需要用DefaultTabController 包装您的Scaffold，然后继续显示标签和tabview。我附上代码供您参考，请检查。

return DefaultTabController(
  length: 3,
  child: Scaffold(
      body: SafeArea(
    child: SingleChildScrollView(
      child: Container(
        height: MediaQuery.of(context).size.height,
        // child: Center(
        child: Column(children: [
          Expanded(
            flex: 5,
            child: Container(
              child: Column(
                children: [
                  Row(
                    mainAxisAlignment: MainAxisAlignment.start,
                    children: [
                      SizedBox(
                        width: 15,
                      ),
                      Row(
                        children: [
                          SizedBox(height: 80),
                          customIconGoBack(context),
                          Row(
                            children: [
                              SizedBox(
                                width: 230,
                              ),
                              customIconFav(),
                            ],
                          )
                        ],
                      )
                    ],
                  ),
                  SizedBox(
                    height: 280,
                  ),
                  Row(
                    children: [
                      SizedBox(
                        height: 10,
                        width: 20,
                      ),
                      Icon(
                        Icons.location_on_sharp,
                        color: Colors.white,
                        size: 25,
                      ),
                      SizedBox(
                        width: 2,
                      ),
                      Text(
                        "2.4km away",
                        style: TextStyle(
                          fontWeight: FontWeight.normal,
                          fontSize: 12,
                          color: Colors.white,
                        ),
                      ),
                    ],
                  ),
                  SizedBox(
                    height: 5,
                  ),
                  Row(
                    children: [
                      SizedBox(
                        height: 5,
                        width: 20,
                      ),
                      Container(
                        child: Text(
                          'Bondi Beach',
                          style: TextStyle(
                            fontWeight: FontWeight.bold,
                            fontSize: 24,
                            color: Colors.white,
                          ),
                        ),
                      ),
                      SizedBox(
                        width: 110,
                      ),
                      Container(
                        height: 30,
                        margin: EdgeInsets.only(right: 20),
                        padding: EdgeInsets.only(left: 10),
                        width: 70,
                        decoration: BoxDecoration(
                          borderRadius: BorderRadius.circular(5),
                          color: Colors.black45,
                        ),
                        child: Row(
                          children: [
                            Icon(
                              Icons.star_rounded,
                              color: Colors.white,
                              size: 25,
                            ),
                            SizedBox(
                              width: 2,
                            ),
                            Text(
                              "4.9",
                              style: TextStyle(color: Colors.white),
                            )
                          ],
                        ),
                      )
                    ],
                  )
                ],
              ),
              margin:
                  EdgeInsets.only(right: 18, left: 18, top: 15, bottom: 15),
              padding: EdgeInsets.only(bottom: 15, top: 15),
              decoration: BoxDecoration(
                image: DecorationImage(
                  fit: BoxFit.fill,
                  colorFilter: ColorFilter.mode(
                      Colors.black.withOpacity(0.5), BlendMode.dstOver),
                  image: AssetImage('./Assets/Bondi.jpg'),
                ),
                boxShadow: [
                  BoxShadow(
                    color: Colors.black12,
                    offset: Offset(2, 2), //(x,y)
                    blurRadius: 5.0,
                  )
                ],
                borderRadius: BorderRadius.circular(10),
              ),
              height: MediaQuery.of(context).size.height / 1.7,
            ),
          ),
          Container(
            // height: 50,
            child: Theme(
              data: ThemeData(
                  splashColor: Colors.transparent,
                  highlightColor: Colors.transparent),
              child: TabBar(
                labelColor: Colors.black,
                unselectedLabelColor: Colors.grey,
                indicatorPadding: EdgeInsets.only(right: 16),
                labelPadding: EdgeInsets.only(right: 16),
                indicator: BoxDecoration(
                    color: Colors.white,
                    borderRadius: BorderRadius.circular(5)),
                tabs: [
                  Tab(
                    text: "Overview",
                  ),
                  Tab(
                    text: "Reviews",
                  ),
                  Tab(
                    text: "Friends",
                  ),
                ],
              ),
            ),
          ),
          Expanded(
            child: TabBarView(
              children: <Widget>[
                Center(
                  child: Text("It's cloudy here",
                      style: textStyleRoboto(
                        textColor: ColorTheme.blackColor,
                      )),
                ),
                Center(
                  child: Text("It's rainy here"),
                ),
                Center(
                  child: Text("It's sunny here"),
                ),
              ],
            ),
          ),
        ]),
      ),
    ),
  )),
);