跳到主要内容

圆形头像 CircleAvatar

代表用户的圆形。

通常与用户的个人资料图片一起使用，如果没有图片，则使用用户的首字母作为替代。用户的首字母应与相同的背景颜色配对，以保持一致性。

如果foreground_image_url失败，则使用background_image_url。如果background_image_url也失败，则使用bgcolor。

示例​

在线示例

import flet as ft

def main(page):
    # 一个具有背景图的“普通”头像
    a1 = ft.CircleAvatar(
        foreground_image_url="https://avatars.githubusercontent.com/u/5041459?s=88&v=4",
        content=ft.Text("FF"),
    )
    # 具有失败的前景图像和回退文本的头像
    a2 = ft.CircleAvatar(
        foreground_image_url="https://avatars.githubusercontent.com/u/_5041459?s=88&v=4",
        content=ft.Text("FF"),
    )
    # 具有图标的头像（即图标与反色背景）
    a3 = ft.CircleAvatar(
        content=ft.Icon(ft.icons.ABC),
    )
    # 具有图标和自定义颜色的头像
    a4 = ft.CircleAvatar(
        content=ft.Icon(ft.icons.WARNING_ROUNDED),
        color=ft.colors.YELLOW_200,
        bgcolor=ft.colors.AMBER_700,
    )
    # 具有在线状态的头像
    a5 = ft.Stack(
        [
            ft.CircleAvatar(
                foreground_image_url="https://avatars.githubusercontent.com/u/5041459?s=88&v=4"
            ),
            ft.Container(
                content=ft.CircleAvatar(bgcolor=ft.colors.GREEN, radius=5),
                alignment=ft.alignment.bottom_left,
            ),
        ],
        width=40,
        height=40,
    )
    page.add(a1, a2, a3, a4, a5)


ft.app(target=main)

属性​

background_image_url​

圆形的背景图像。更改背景图像将导致头像动画显示新的图像。通常用作foreground_image_url的替代图像。如果CircleAvatar代表的是用户的首字母，请使用content属性。

bgcolor​

填充圆的颜色。更改背景颜色将导致头像动画显示新的颜色。

color​

圆中文本的默认颜色。如果未指定bgcolor，则默认为主文本主题颜色。

content​

通常是一个Text控件。如果头像使用图像，请使用background_image_url。

foreground_image_url​

圆形的前景图像。通常用作个人资料图片。如果没有图像，则使用background_image_url作为回退图像。

max_radius​

头像的最大尺寸，以半径（直径的一半）表示。如果指定了maxRadius，则不能再指定radius。默认为"无穷大"。

min_radius​

头像的最小尺寸，以半径（直径的一半）表示。如果指定了minRadius，则不能再指定radius。默认为零。

radius​

头像的尺寸，以半径（直径的一半）表示。如果指定了radius，则不能再指定minRadius和maxRadius。

tooltip​

当鼠标悬停在按钮上时显示的文本。