Flutter 垂直分隔线未显示在行中

Flutter 垂直分隔线未显示在行中,flutter,flutter-layout,flutter-dependencies,flutter-animation,Flutter,Flutter Layout,Flutter Dependencies,Flutter Animation,我试图在一行中添加一个垂直分隔符。分隔符的宽度已设置,但未显示分隔符。我还尝试了IntrinsicHeight小部件,它现在可以工作了。但建议不要在其他线程中使用该选项。有解决办法吗 代码如下: import 'package:flutter/material.dart'; import 'package:focus7/Configurations/styles.dart'; import 'package:focus7/Widgets/settings.dart'; class Profil

我试图在一行中添加一个垂直分隔符。分隔符的宽度已设置,但未显示分隔符。我还尝试了IntrinsicHeight小部件,它现在可以工作了。但建议不要在其他线程中使用该选项。有解决办法吗

代码如下:

import 'package:flutter/material.dart';
import 'package:focus7/Configurations/styles.dart';
import 'package:focus7/Widgets/settings.dart';

class Profile extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final Shader textGradient =
        Styles.primaryGradient.createShader(Rect.fromLTWH(0.0, 0.0, 50, 50));

    return Column(
      children: <Widget>[
        Padding(
          padding: const EdgeInsets.only(top: 40),
          child: Align(alignment: Alignment.centerRight, child: SettingsIcon()),
        ),
        SizedBox(height: 30),
        Align(
            alignment: Alignment.center,
            child: CircleAvatar(
              radius: 60,
              backgroundColor: Colors.amber,
              backgroundImage: AssetImage("Assets/ninja_image_png.png"),
            )),
        SizedBox(height: 10),
        Text(
          "Bala Ganesh",
          style: Styles.titleWhiteTextStyle,
        ),
        SizedBox(height: 10),
        Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Column(
                children: <Widget>[
        Text(
          "LEVEL",
          style: Styles.normalWhiteTextStyle
              .copyWith(foreground: Paint()..shader = textGradient),
        ),
        SizedBox(height: 10),
        Text(
          "4",
          style: Styles.normalWhiteTextStyle,
        ),
                ],
              ),
              VerticalDivider(color: Styles.primaryWhite,thickness: 10,width: 20,),
              Column(
                children: <Widget>[
        Text(
          "POINTS",
          style: Styles.normalWhiteTextStyle
              .copyWith(foreground: Paint()..shader = textGradient),
        ),
        SizedBox(height: 10),
        Text(
          "250",
          style: Styles.normalWhiteTextStyle,
        ),
                ],
              ),
            ],
          ),
      ],
    );
  }
}
导入“包装:颤振/材料.省道”;
导入“package:focus7/Configurations/styles.dart”;
导入“package:focus7/Widgets/settings.dart”;
类配置文件扩展了无状态小部件{
@凌驾
小部件构建(构建上下文){
最终着色器文本渐变=
Styles.primaryGradient.createShader(Rect.fromLTWH(0.0,0.0,50,50));
返回列(
儿童:[
填充物(
填充:仅限常量边集(顶部:40),
子项:对齐(对齐:alignment.centerRight,子项:SettingsIcon()),
),
尺寸箱(高度:30),
对齐(
对齐:对齐.center,
孩子:圆环星(
半径:60,
背景颜色:Colors.amber,
背景图片:AssetImage(“Assets/ninja_image_png.png”),
)),
尺寸箱(高度:10),
正文(
“巴拉甘尼什”,
style:style.titleWhiteTextStyle,
),
尺寸箱(高度:10),
划船(
mainAxisAlignment:mainAxisAlignment.center,
儿童:[
纵队(
儿童:[
正文(
“级别”,
样式:Styles.normalWhiteTextStyle
.copyWith(前景:Paint()…着色器=文本渐变),
),
尺寸箱(高度:10),
正文(
"4",
样式:Styles.normalWhiteTextStyle,
),
],
),
垂直分隔器(颜色:样式。原色白色,厚度:10,宽度:20,),
纵队(
儿童:[
正文(
“积分”,
样式:Styles.normalWhiteTextStyle
.copyWith(前景:Paint()…着色器=文本渐变),
),
尺寸箱(高度:10),
正文(
"250",
样式:Styles.normalWhiteTextStyle,
),
],
),
],
),
],
);
}
}
以下是输出:


使用IntrinsicHeight来包装行小部件将解决您的问题

 IntrinsicHeight(
          child: Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Column(
                children: <Widget>[
                  Text(
                    "LEVEL",
                  ),
                  SizedBox(height: 10),
                  Text(
                    "4",
                  ),
                ],
              ),
              VerticalDivider(
                color: Colors.black,
                thickness: 10,
                width: 20,
              ),
              Column(
                children: <Widget>[
                  Text(
                    "POINTS",
                  ),
                  SizedBox(height: 10),
                  Text(
                    "250",
                  ),
                ],
              ),
            ],
          ),
        ),
IntrinsicHeight(
孩子:排(
mainAxisAlignment:mainAxisAlignment.center,
儿童:[
纵队(
儿童:[
正文(
“级别”,
),
尺寸箱(高度:10),
正文(
"4",
),
],
),
垂直分隔器(
颜色:颜色,黑色,
厚度:10,
宽度:20,
),
纵队(
儿童:[
正文(
“积分”,
),
尺寸箱(高度:10),
正文(
"250",
),
],
),
],
),
),

我没有任何问题。。请创建可复制的代码谢谢您的回答。内在高度是有效的,但在文档中,有人说“尽可能避免使用它。在最坏的情况下,这个小部件可能导致树的深度为O(N²)。”,我问是否有其他方法可以实现这个没有固有高度的垂直分隔器,我想你可以简单地使用容器,给出宽度、高度和颜色属性,它们也可以像分隔器一样工作。