如何在 Flutter 中设计像 zomato 应用程序一样的搜索字段

发布于09月05日

我正在重新设计一个类似于Zomato应用程序中使用的拐角半径的设计.尽管我尽了最大努力，我还是没能复制出准确的设计.下面，我提供了一些图片以供参考.

Zomato's design个

我正在寻找在我的项目中实现相同的拐角半径效果的指导.我try 了几种方法，但没有一种方法与期望的设计相匹配.

Mine design个

如果任何人在复制这一特定设计元素方面有经验或见解，请分享您的知识.我将非常感谢任何帮助，代码示例，或建议，以帮助我实现这个设计.

提前感谢您的帮助！

推荐答案

经过大量的研究，

我找到了这个figma_squircle套餐，它可以帮助创造出完全相同的设计，看起来像佐玛托的观点.

使用figma_squircle的设计视图

示例代码片段:

            Container(
              margin: EdgeInsets.all(8),
              height: 150,
              width: double.infinity,
              decoration: ShapeDecoration(
                color: Colors.white,
                shape: SmoothRectangleBorder(
                  borderRadius: SmoothBorderRadius(
                    cornerRadius: 15,
                    cornerSmoothing: 1,
                  ),
                ),
              ),
              child: ...
              ),