Flutter 中的圓角和邊框不精確

Question

我希望有如下視圖：

我的代碼是：

class SampleRoundedWidget extends StatelessWidget {
  final imageUrl = 'test.png';
  final domain = 'twitter.com';
  final description = 'Sample description';

  @override
  Widget build(BuildContext context) {
    return Container(
      decoration: BoxDecoration(
        border: Border.all(color: context.activeTheme.bg6),
        borderRadius: BorderRadius.circular(_borderRadius),
      ),
      margin: const EdgeInsets.all(12.0),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          _image(),
          _divider(),
          _domain(),
          _description(),
        ],
      ),
    );
  }

  Widget _image() {
    return ClipRRect(
      borderRadius: BorderRadius.only(topLeft: RadiusCircular(_borderRadius), topRight: RadiusCircular(_borderRadius)),
      child: CachedNetworkImage(imageUrl: imageUrl),
    );
  }

  Widget _divider() {
    return Divider(height: 2);
  }

  Widget _domain() {
    return Padding(
      padding: const EdgeInsets.only(
        right: 8.0,
        left: 8.0,
        top: 8.0,
        bottom: 1.0,
      ),
      child: Text(domain),
    );
  }

  Widget _description() {
    return Padding(
      padding: const EdgeInsets.only(
        right: 8.0,
        left: 8.0,
        top: 1.0,
        bottom: 8.0,
      ),
      child: Text(description),
    );
  }

  final _borderRadius = 8.0;
}

但是，我注意到角落不精確：

此外，分隔線有奇怪的空間：

繪圖時是否進行了某種 Flutter 優化？ 我怎樣才能讓它更詳細？

Answer 1

分隔符離開空間，檢查height屬性。 更多細節在這里