VerticalDivider 未出现在行中

Question

我尝试在一行中添加垂直分隔线。分隔线的宽度已设置，但分隔线未出现。我还尝试使用 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,
        ),
                ],
              ),
            ],
          ),
      ],
    );
  }
}

这是输出：

Answer 1

用 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",
                  ),
                ],
              ),
            ],
          ),
        ),

VerticalDivider 未出现在行中

VerticalDivider not appearing in Row

flutter

flutter-dependencies

flutter-layout

flutter-animation