Mostre uma equipe inteira em pouco espaço. Avatares sobrepostos se recolhem em um selo +n quando mais do que o seu limite são mostrados.
Por que ajuda
- Avatares sobrepostos
- +n para o resto
- Dicas com nomes
Onde se encaixa
- Projetos
- Equipes
- Itens compartilhados
Exemplo
<Stack Direction="StackDirection.Column" Align="flex-start">
<AvatarGroup Items="_people" Label="Project members" />
<AvatarGroup Items="_people" Max="2" Size="Size.Small" Label="Project members (short)" />
<AvatarGroup Items="_people.Take(3)" Size="Size.Large" Label="Three members" />
</Stack>
@code {
private readonly AvatarItem[] _people =
[
new("Ada Lovelace"), new("Grace Hopper"), new("Linus Torvalds"), new("Margaret Hamilton"), new("Alan Turing"), new("Barbara Liskov")
];
}Um pequeno trecho. Adicione @using RayCraft.Blazor.Components à sua página e use um modo de renderização interativo.
Incluído no RayCraft Free. Há exemplos funcionais no repositório do GitHub (MIT); ele contém código de exemplo e demonstração, não o código da biblioteca.