时间戳

首页 > 解决方案 > Flutter：如何制作自定义头像

flutter - Flutter：如何制作自定义头像

问题描述

我想制作一个包裹在平滑+定制形状中的头像，看起来类似于小米当前的徽标（它不是带有某种 Radius.elliptical(x,y) 的矩形，而是稍微复杂一点的函数）。有没有办法有效地做到这一点？

在此处输入图像描述

标签： flutteruser-interfaceavatar

解决方案

您可以尝试使用@pkskink提到的 ContinousRectangularBorder

  1. 使用连续矩形边框
Container(
  decoration: ShapeDecoration(
    shape: ContinuousRectangleBorder(
    borderRadius: BorderRadius.circular(95.0),
  ),
  color: Colors.orange[800]),
  height: 100,
  width: 100,
  alignment: Alignment.center,
  child: Text('Mi',
           style: TextStyle(color: Colors.white, fontSize: 40),
         ),
),
  1. 使用正常的borderRadius（用于比较）
Container(
  decoration: BoxDecoration(
    borderRadius: BorderRadius.circular(40.0),
    color: Colors.orange[800]),
  height: 100,
  width: 100,
  alignment: Alignment.center,
  child: Text(
  'Mi',
   style: TextStyle(color: Colors.white, fontSize: 40),
 ),
),

如果您对此不满意，我建议您使用自定义 Paint，它允许您绘制任何类型的形状

推荐阅读