flutter 中的椭圆形装饰，我该怎么做？

问题描述

我有一个想要在 Flutter 中实现的布局，这种装饰在我的布局、文本输入、容器、按钮、卡片等中随处可见。我已经看到您可以使用 Clipoval 将装饰变成椭圆形，但它没有为我工作。如果你注意到这个设计，边缘是圆的，然后轻轻地做成一个椭圆形，它不是一个带有圆角的矩形，在此先感谢。

带圆角的简单矩形，不是预期的设计

class AppCard extends StatelessWidget {
  const AppCard({
    Key key,this.image,this.child,this.opacity = 0.3,}) : super(key: key);

  final String image;
  final Widget child;
  final double opacity;

  @override
  Widget build(BuildContext context) {
    final ThemeData themeData = Theme.of(context);

    return ClipRRect(
      borderRadius: BorderRadius.circular(25.0),child: Container(
        child: child,width: MediaQuery.of(context).size.width,height: 190,decoration: Boxdecoration(
          color: COLOR_GREEN,image: decorationImage(
            fit: BoxFit.fitWidth,colorFilter: new ColorFilter.mode(
                Colors.black.withOpacity(opacity),BlendMode.dstATop),image: Assetimage(image),),);
  }
}

我正在尝试这个结果 oval rectangular design

解决方法

而不是使用圆半径

考虑使用椭圆半径之类的

BorderRadius.all(Radius.elliptical(100,50)),

,

返回带有 borderRadius 的 Material：BorderRadius.circular(25.0)，子元素作为 Inkwell，然后是您拥有的容器。