Flutter：如何在 Flutter 中添加浮动文本标签？答案

【问题标题】：Flutter: How to add floating text labels in Flutter?Flutter：如何在 Flutter 中添加浮动文本标签？
【发布时间】：2020-02-12 11:12:48
【问题描述】：

我想显示图片的浮动文本标签（顶部、底部、左侧和右侧）以及坐标（图片是地图。

我发现显示地图的最佳小部件是 package:photo_view/photo_view.dart

但是，我是 Flutter 的新手，还没有意识到如何在这些位置“绘制”文本标签，“浮动”在图片上。

我试过没有用：

 return Container(
    child: new Stack(children: <Widget>[
    new PhotoView(
      imageProvider: AssetImage("assets/image.jpg"),
    ),
    new AlignPositioned(
   alignment: Alignment.topLeft,
   Text('Hello World')
    )
    ]
    )

  );

我做错了什么？

【问题讨论】：

标签： flutter flutter-layout

【解决方案1】：

不需要您的容器，因为它没有属性。您正在寻找的可能是这样的：

Stack(
  alignment: Alignment.center,
  fit: StackFit.expand,
  children: <Widget>[
    Positioned.fill(child: Container()),//map

    Positioned(
        top: 0,
        child: Text('top')
    ),
    Positioned(
        left: 0,
        child: Text('left')
    ),
    Positioned(
        right: 0,
        child: Text('right')
    ),
    Positioned(
        bottom: 0,
        child: Text('bottom')
    ),
  ],
);

靠近列表开头的孩子位于最底层，当您向列表末尾移动时，这些项目会相互堆叠。

【讨论】：

如果我想要一个交叉标签，比如“调试”，在右上角？