Skip to content

Latest commit

 

History

History
103 lines (78 loc) · 2.95 KB

README_zh.md

File metadata and controls

103 lines (78 loc) · 2.95 KB

Github

flutter_boring_avatars

Pub Version (including pre-releases)

English | 中文

功能

Boring avatars 可以根据用户名和调色板生成独特的头像。

这个项目是 Boring Avatars 的 Flutter 实现。

它与原始项目在实现方式上有一些不同,使用了 Canvas 实现并添加了过渡动画。

查看 Web 示例 以体验效果。

截图

preview1.png

安装

pubspec.yaml 文件中添加依赖:

dependencies:
  flutter_boring_avatars: any # or the latest version on Pub

使用

获取一个简单的头像

BoringAvatar(name:"Maria Mitchell", type: BoringAvatarType.marble);

获取一个带有动画的头像,当名字发生变化时,头像会有一个漂亮的过度动画

AnimatedBoringAvatar(
  name: "Maria Mitchell",
  type: BoringAvatarType.marble,
  duration: const Duration(milliseconds: 300),
)

获取一个带有自定义调色板的头像

final colorPaletta = BoringAvatarPalette(Color(0xffA3A948), Color(0xffEDB92E), Color(0xffF85931), Color(0xffCE1836), Color(0xff009989));

BoringAvatar(name:"Maria Mitchell", palette: colorPaletta);

设置默认类型和调色板,只适用于 BoringAvatar 和 AnimatedBoringAvatar

build(context) {
  return DefaultBoringAvatarStyle(
    type: BoringAvatarType.marble, 
    paletta: colorPaletta,
    child: Column(
      children: [
        BoringAvatar(name: "Maria Mitchell"),
        BoringAvatar(name: "Alexis Brooks"),
        BoringAvatar(name: "Justin Gray"),
      ]
    ),
  );
}

使用 ShapeBorder 控制头像形状和添加边框

BoringAvatar(
  name:"Maria Mitchell",
  type: BoringAvatarType.marble,
  shape: OvalBorder(), // or RoundedRectangleBorder(borderRadius: BorderRadius.circular(16))
);

将头像用于Decoration, 同样的在AnimatedContainer中使用也支持过渡动画

Container(
  decoration: BoringAvatarDecoration(
    avatarData: BoringAvatarData.generate(name: name),
  ),
);

将头像导出为图片

final avatarData = BoringAvatarData.generate(name: name);
final image = await avatarData.toImage(size: const Size.square(256));
final pngByteData = await image.toByteData(format: ImageByteFormat.png);

感谢

感谢 Boring Avatars 的开发者们。

在示例中使用了来自 Matt DesLauriers精美调色板项目

如果你喜欢这个项目,请给我一个 Star。