颤振除法器小部件未出现 [英] Flutter divider widget not appearing

问题描述

我目前正在学习如何使用Flutter SDK和Android Studio构建应用程序.我的问题是我需要在管理"文本和卡的其余部分之间添加一个Divider小部件，但是正如您在下面的屏幕快照中看到的那样，该divider没有显示.我尝试更改大小(在这种情况下，两个文本之间的间距会增加)，并且尝试设置颜色以查看手机上的默认颜色是否为透明.什么都行不通！

I'm currently learning how to build apps using the Flutter SDK and Android Studio. My problem is that I need to add a Divider widget between the 'Administrative' text and the rest of the Card but as you can see in the screenshot below, the divider isn't showing up. I've tried changing the size (In which case the space between the two texts just increases) and I've tried setting the color to see if it was defaulting to transparent on my phone. Nothing works!

这是我的Card Widget State的代码:

Here's my code for the Card Widget State:

class BBSCardState extends State<BBSCard>{
  @override
  Widget build(BuildContext context) {
    return new Padding(
      padding: const EdgeInsets.only(top: 16.0, bottom: 16.0, left: 12.0, right: 12.0),
      child: new Card(
        child: new Row(
          children: <Widget>[
            new Column(
              mainAxisSize: MainAxisSize.min,
              children: <Widget>[
                new Padding(
                  padding: const EdgeInsets.only(top: 22.0, bottom: 8.0),
                  child: new Text("Administrative", style: new TextStyle(color: new Color.fromARGB(255, 117, 117, 117), fontSize: 32.0, fontWeight: FontWeight.bold)),
                ),
                new Divider(),
                new Text("text")
              ],
            ),
          ],
          mainAxisSize: MainAxisSize.max,
          mainAxisAlignment: MainAxisAlignment.center,
        )
      )
    );
  }
}

这是这张卡的屏幕截图:

And here's the screenshot of what the card looks like:

也: 有什么办法可以从分频器中增加实际行的大小吗? (不仅仅是间距)

Also: Is there any way to increase the size of the actual line from the Divider? (Not just the spacing)

谢谢！

推荐答案

您可以删除Row，然后Column将占用所有可用空间，而Divider将具有宽度.

You could remove Row, then Column would take all available space and Divider would have width.

@override
Widget build(BuildContext context) {
  return new Padding(
    padding: const EdgeInsets.only(
        top: 16.0, bottom: 16.0, left: 12.0, right: 12.0),
    child: new Card(
      child: new Column(
        mainAxisSize: MainAxisSize.min,
        children: <Widget>[
          new Padding(
            padding: const EdgeInsets.only(top: 22.0, bottom: 8.0),
            child: new Text("Administrative",
                style: new TextStyle(
                    color: new Color.fromARGB(255, 117, 117, 117),
                    fontSize: 32.0,
                    fontWeight: FontWeight.bold)),
          ),
          new Divider(
            color: Colors.red,
          ),
          new Text("text")
        ],
      ),
    ),
  );
}

要制作自定义分隔线，您可以检查Divider的实现并进行调整.例如.将Divider替换为

To make custom divider you could check implementation of Divider and adjust it. E.g. replace Divider with

new SizedBox(
  height: 10.0,
  child: new Center(
    child: new Container(
      margin: new EdgeInsetsDirectional.only(start: 1.0, end: 1.0),
      height: 5.0,
      color: Colors.red,
    ),
  ),
)

这篇关于颤振除法器小部件未出现的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！