PopupColorEditor

Библиотека контролов Eremex включает в себя контрол PopupColorEditor, который позволяет отображать цвет в поле редактирования и выбирать цвет из связанного всплывающего окна.

popupcoloreditor

Основные функции контрола включают в себя:

Настраиваемая цветовая палитра по умолчанию.
Стандартная цветовая палитра.
Пользовательская цветовая палитра, которая может быть настроена пользователями.
Встроенный диалог позволяет выбирать цвета с помощью диалога Выбора Цвета или путем указания отдельных цветовых компонентов в формате RGB или HSB.

Выбор цвета

Пользователь может выбрать цвет, используя цветовые палитры, отображаемые в всплывающем окне.

В коде вы можете указать цвет или прочитать выбранный в данный момент цвет с помощью свойства PopupColorEditor.Color или PopupColorEditor.EditorValue. Эти свойства синхронизированы. Они различаются типом значения: свойство Color имеет тип Color с возможностью обнуления, в то время как свойство EditorValue имеет тип object, как и во всех редакторах Eremex.

Палитры

PopupColorEditor поддерживает три палитры: по умолчанию, стандартную и пользовательскую. Используйте свойство PopupColorEditor.ColorsShowMode, чтобы настроить видимость отдельных палитр. Свойство ColorsShowMode определено как набор флагов.

Дефолтная цветовая палитра

ColorsShowMode

Стандартная цветовая палитра

Включите флаг StandardColors в значении свойства ColorsShowMode, чтобы отобразить стандартную цветовую палитру.

Пользовательская цветовая палитра

Включите флаг CustomColors в значение свойства ColorsShowMode, чтобы отобразить пользовательскую палитру цветов.

Пользователи могут добавлять и настраивать цвета в пользовательской палитре во время выполнения программы. Нажмите кнопку "+", чтобы добавить цвет. Щелкните правой кнопкой мыши существующий цвет, чтобы получить доступ к командам контекстного меню, используемым для изменения и удаления цвета.

Вы можете заранее заполнить пользовательскую палитру цветов в коде, используя свойство CustomColors.

Пример - Как настроить пользовательскую палитру

Следующий код включает пользовательскую палитру цветов и заполняет ее из свойства CustomColorCollection, определенного в ViewModel.

xmlns:mxe="using:Eremex.AvaloniaUI.Controls.Editors"
xmlns:sys="clr-namespace:System;assembly=mscorlib"
xmlns:local="clr-namespace:ComboBoxTestSample"

<Window.DataContext>
    <local:MainViewModel/>
</Window.DataContext>

<mxe:PopupColorEditor ColorsShowMode="CustomColors" CustomColors="{Binding CustomColorCollection}"/>

using Avalonia.Media;
using CommunityToolkit.Mvvm.ComponentModel;
using System.Collections.ObjectModel;

[ObservableObject]
public partial class MainViewModel 
{
    public MainViewModel()
    {
        CustomColorCollection = new ObservableCollection<Color>()
        {
            Color.FromRgb(0x7d, 0xd7, 0xab), Color.FromRgb(0xc5, 0x94, 0x88), Color.FromRgb(0x47, 0xfe, 0xff), Color.FromRgb(0xe9, 0xbf, 0x3f),
        };
    }

    [ObservableProperty]
    ObservableCollection<Color> customColorCollection;
}

Диалог выбора цвета

Когда пользователь нажимает кнопку "+" или щелкает правой кнопкой мыши на существующем цветовом поле в пользовательской палитре, редактор активирует диалоговое окно "Диалог Выбора Цвета".

popupcoloreditor-colorselectiondialog

Пользовательский интерфейс диалогового окна содержит диалог Выбора Цвета и контролы для указания компонентов цвета в формате RGB или HSB.

Связанный API

ShowAlphaChannel — Позволяет скрыть контролы, используемые для указания альфа-компонента цвета.
ShowConfirmationButtons — Указывает, следует ли отображать кнопки "Применить" и "Отмена" в диалоговом окне выбора цвета. Если свойство включено, пользователю необходимо нажать кнопку Применить, чтобы подтвердить выбор цвета. Нажатие на кнопку "Назад" или "Отмена" отменяет диалоговое окно. Если для свойства ShowConfirmationButtons установлено значение false, нажатие на кнопку "Назад" подтверждает выбранный цвет.

^* Эта страница была создана автоматически с помощью сервиса машинного перевода Яндекс Переводчик.

Table of Contents