Android 颤振-文本在带有FittedBox的FlatButton内不可见

Android 颤振-文本在带有FittedBox的FlatButton内不可见,android,ios,flutter,flutter-layout,Android,Ios,Flutter,Flutter Layout,我正在学习颤振,并试图设计一个由带有扁平按钮的单元格组成的表格,用于执行某些操作。当我尝试使用FlatButton创建TableCell时,FlatButton文本将垂直渲染,当我使用FittedBox将其水平对齐时,FlatButton文本将消失,这里可能会出现什么问题?是否有解决方法?请在下面找到代码片段 Widget build(BuildContext context) { final deviceSize = MediaQuery.of(context).size; r

我正在学习颤振,并试图设计一个由带有扁平按钮的单元格组成的表格,用于执行某些操作。当我尝试使用FlatButton创建TableCell时,FlatButton文本将垂直渲染,当我使用FittedBox将其水平对齐时,FlatButton文本将消失,这里可能会出现什么问题?是否有解决方法?请在下面找到代码片段

Widget build(BuildContext context) {
    final deviceSize = MediaQuery.of(context).size;
    return Stack(
      children: [
        Container(
          height: deviceSize.height,
          width: deviceSize.width,
          decoration: const BoxDecoration(
            gradient: LinearGradient(colors: [
              Color(0xffee0979),
              Color(0xffff6a00),
              //Color(0xff29ffc6),
            ], begin: Alignment.bottomRight),
          ),
        ),
        Container(
          margin: EdgeInsets.only(bottom: 200),
          child: Center(
            child: Card(
              margin: EdgeInsets.all(12),
              shape: RoundedRectangleBorder(
                borderRadius: BorderRadius.circular(15.0),
              ),
              elevation: 15,
              child: Container(
                alignment: Alignment.topRight,
                height: deviceSize.height * 0.70,
                width: double.infinity,
                padding: EdgeInsets.all(12.0),
                child: Table(
                  border: TableBorder.all(width: 1.2),
                  children: [
                    for (var i = 0; i < 15; i++)
                      TableRow(
                        children: [
                          for (var j = 0; j < 15; j++)
                            TableCell(
                                verticalAlignment:
                                    TableCellVerticalAlignment.middle,
                                child: FlatButton(
                                  onPressed: () {},
                                  child: FittedBox(child: Text('Test')),
                                )),
                        ],
                      ),
                  ],
                ),
              ),
            ),
          ),
        ),
        Container(
          alignment: Alignment.bottomCenter,
          margin: EdgeInsets.only(bottom: 60),
          child: RaisedButton(
            onPressed: () {},
            elevation: 10,
            textColor: Colors.white,
            shape:
                RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
            color: Theme.of(context).primaryColor,
            child: Container(
              width: 100,
              child: Row(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  Icon(Icons.assignment),
                  SizedBox(
                    width: 10,
                  ),
                  Text('Instructions')
                ],
              ),
            ),
          ),
        ),
      ],
    );
  }
}
小部件构建(构建上下文){
final deviceSize=MediaQuery.of(context).size;
返回堆栈(
儿童:[
容器(
高度:deviceSize.height,
宽度:deviceSize.width,
装饰:康斯特盒子装饰(
渐变:线性渐变(颜色:[
颜色(0xffee0979),
颜色(0xffff6a00),
//颜色(0xff29ffc6),
],开始:对齐。右下角),
),
),
容器(
页边距:仅限边缘集(底部:200),
儿童:中心(
孩子:卡片(
保证金:所有(12),
形状:圆形矩形边框(
边界半径:边界半径。圆形(15.0),
),
标高:15,
子:容器(
对齐:alignment.topRight,
高度:deviceSize.height*0.70,
宽度:double.infinity,
填充:所有边缘设置(12.0),
孩子:桌子(
边框:表格边框。全部(宽度:1.2),
儿童:[
对于(变量i=0;i<15;i++)
桌椅(
儿童:[
对于(var j=0;j<15;j++)
表细胞(
垂直排列:
TableCell垂直对齐。中间,
孩子:扁平按钮(
按下:(){},
子项:FittedBox(子项:文本('Test')),
)),
],
),
],
),
),
),
),
),
容器(
对齐:对齐.bottomCenter,
页边距:仅限边缘组(底部:60),
孩子:升起按钮(
按下:(){},
标高:10,
textColor:Colors.white,
形状:
RoundedRectangleBorder(borderRadius:borderRadius.circular(12)),
颜色:主题。背景。原色,
子:容器(
宽度:100,
孩子:排(
mainAxisAlignment:mainAxisAlignment.center,
儿童:[
图标(图标分配),
大小盒子(
宽度:10,
),
文本(“说明”)
],
),
),
),
),
],
);
}
}

提前感谢您宝贵的时间

在FittedBox中添加一个容器来保存子文本可能会起到作用。

问题不在于对齐或在单元格中调整文本。这是因为您在一行中输入的列的数量要在屏幕上正常显示很多

您可以做的是减少列数:

TableRow(
                    children: [
                      for (var j = 0; j < 5; j++)
                        TableCell(
                            verticalAlignment:
                                TableCellVerticalAlignment.middle,
                            child: FlatButton(
                              onPressed: () {},
                              child: Text('Test'),
                            )),
                    ],
                  ),
TableRow(
儿童:[
对于(var j=0;j<5;j++)
表细胞(
垂直排列:
TableCell垂直对齐。中间,
孩子:扁平按钮(
按下:(){},
子项:文本('Test'),
)),
],
),
如果要在一行中容纳15列而不使用scrollview。使用一个大小合适的框:

TableRow(
                      children: [
                        for (var j = 0; j < 5; j++)
                          SizedBox(
                            width: 50,
                            child: TableCell(
                              verticalAlignment:
                                  TableCellVerticalAlignment.middle,
                              child: FittedBox(
                                  child: FlatButton(
                                onPressed: null,
                                child: Text('Test'),
                              )),
                            ),
                          ),
                      ],
                    ),
TableRow(
儿童:[
对于(var j=0;j<5;j++)
大小盒子(
宽度:50,
儿童:表细胞(
垂直排列:
TableCell垂直对齐。中间,
孩子:FittedBox(
孩子:扁平按钮(
onPressed:null,
子项:文本('Test'),
)),
),
),
],
),
或者将表格放在SingleChildScrollView中,滚动方向为水平,如下所示:

SingleChildScrollView(
              scrollDirection: Axis.horizontal,
              child: Table(
                columnWidths: {
                  0: IntrinsicColumnWidth(),
                  1: IntrinsicColumnWidth(),
                  2: IntrinsicColumnWidth(),
                  3: IntrinsicColumnWidth(),
                  4: IntrinsicColumnWidth(),
                },
                border: TableBorder.all(width: 1.2),
                children: [
                  for (var i = 0; i < 15; i++)
                    TableRow(
                      children: [
                        for (var j = 0; j < 5; j++)
                          TableCell(
                              verticalAlignment:
                                  TableCellVerticalAlignment.middle,
                              child: FlatButton(
                                onPressed: null,
                                child: Text('Test'),
                              )),
                      ],
                    ),
                ],
              ),
            ),
SingleChildScrollView(
滚动方向:轴水平,
孩子:桌子(
列宽:{
0:IntrinsicColumnWidth(),
1:IntrinsicColumnWidth(),
2:IntrinsicColumnWidth(),
3:IntrinsicColumnWidth(),
4:IntrinsicColumnWidth(),
},
边框:表格边框。全部(宽度:1.2),
儿童:[
对于(变量i=0;i<15;i++)
桌椅(
儿童:[
对于(var j=0;j<5;j++)
表细胞(
垂直排列:
TableCell垂直对齐。中间,
孩子:扁平按钮(
onPressed:null,
子项:文本('Test'),
)),
],
),
],
),
),

希望这有帮助

谢谢!减少行数和列数