O conhecido botão de cor de barra de ferramentas: um ícone com uma barra da cor escolhida embaixo, que abre o seletor de cor ao clicar.
Por que ajuda
- Mostra a cor atual
- Bom para barras de ferramentas
- Abre o seletor de cor
Onde se encaixa
- Cor de texto e de preenchimento em editores
- Ferramentas de desenho
- Rótulos
Exemplo
<ColorButton Icon="IconName.TextColor" Label="Text color" @bind-Value="_text" />
<ColorButton Icon="IconName.FillColor" Label="Fill color" @bind-Value="_fill" FallbackColor="#ffff00" />
<ColorButton Icon="IconName.Highlight" Label="Highlight (disabled)" Value="_fill" Disabled="true" />
<p>Text: @(_text ?? "default"), fill: @(_fill ?? "none")</p>
@code {
private string? _text = "#cc0000";
private string? _fill;
}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.