时间戳

首页 > 解决方案 > 在标签栏中向右溢出 88 像素颤振标签栏

flutter - 在标签栏中向右溢出 88 像素颤振标签栏

问题描述

我正在使用颤振开发移动应用程序，我制作了一个图标和文本标签栏，但结果正好溢出了 88 像素 这是结果的屏幕截图

在此处输入图像描述

这是代码

        bottom: new TabBar(controller: controller,
          tabs: <Widget>[
            new Tab(
              child: new Row(
                  children: <Widget>[
                    new Icon(Icons.local_hospital,color: Colors.white),
                    new Text ( "كلام",
                        style:TextStyle(color: Colors.white,
                        )),
                  ]),
            ),
            new Tab(
              child: new Row(
                  children: <Widget>[
                    new Icon(Icons.school,color: Colors.white),
                    new Text ( "كلام",style:TextStyle(
                        color: Colors.white
                    )),
                  ]),
            ),
            new Tab(
              child: new Row(
                  children: <Widget>[
                    new Icon(Icons.account_balance,color: Colors.white),
                    new Text ( "كلام" ,style:TextStyle(
                        color: Colors.white
                    )),
                  ]),
            ),
            new Tab(
              child: new Row(
                  children: <Widget>[
                    new Icon(Icons.account_balance,color: Colors.white),
                    new Text ( "كلام" ,style:TextStyle(
                        color: Colors.white
                    )),
                  ]),
            ),
            new Tab(
              child: new Row(
                  children: <Widget>[
                    new Icon(Icons.account_balance,color: Colors.white),
                    new Text ( "كلام" ,style:TextStyle(
                        color: Colors.white
                    )),
                  ]),
            ),
            new Tab(
              child: new Row(
                  children: <Widget>[
                    new Icon(Icons.account_balance,color: Colors.white),
                    new Text ( "كلام" ,style:TextStyle(
                        color: Colors.white
                    )),
                  ]),
            ),
          ],),
      ),

我该如何处理？我试图做一个水平滚动，但我失败了！谁能帮我 ？

标签： flutterflutter-layout

解决方案

您可以尝试在小部件上使用isScrollable: true吗？TabBar如下

            TabBar(
              indicatorSize: TabBarIndicatorSize.tab,
              isScrollable: true,
              tabs: [
                Tab(
                  child: Row(children: <Widget>[
                    Icon(Icons.local_hospital, color: Colors.white),
                    Text("كلام",
                        style: TextStyle(
                          color: Colors.white,
                        )),
                  ]),
                ),
                Tab(
                    child: Row(children: <Widget>[
                  Icon(Icons.account_balance, color: Colors.white),
                  Text("كلام", style: TextStyle(color: Colors.white)),
                ])),
                Tab(
                  child: Row(children: <Widget>[
                    Icon(Icons.account_balance, color: Colors.white),
                    Text("كلام", style: TextStyle(color: Colors.white)),
                  ]),
                ),
                Tab(
                  child: Row(children: <Widget>[
                    Icon(Icons.mail, color: Colors.white),
                    Text("كلام", style: TextStyle(color: Colors.white)),
                  ]),
                ),
                Tab(
                  child: Row(children: <Widget>[
                    Icon(Icons.access_alarm, color: Colors.white),
                    Text("كلام", style: TextStyle(color: Colors.white)),
                  ]),
                ),
                Tab(
                  child: Row(children: <Widget>[
                    Icon(Icons.add_to_photos, color: Colors.white),
                    Text("كلام", style: TextStyle(color: Colors.white)),
                  ]),
                ),
              ],
            )

希望这有帮助。

推荐阅读