Язык программирования C#9 и платформа .NET5

Давайте обновим приложение WPF для рисования RenderingShapes, чтобы использовать в нем более интересные кисти. В трех фигурах, которые были задействованы до сих пор при визуализации данных в панели инструментов, применяются обычные сплошные цвета, так что их значения можно зафиксировать с помощью простых строковых литералов. Чтобы сделать задачу чуть более интересной, теперь вы будете использовать интегрированный редактор кистей. Удостоверьтесь в том, что в IDE-среде открыт редактор XAML для начального окна и выберите элемент Ellipse. В окне Properties отыщите категорию Brush (Кисть) и щелкните на свойстве Fill (рис. 26.5).

В верхней части редактора кистей находится набор свойств, которые являются "совместимыми с кистью" для выбранного элемента (т.е. Fill, Stroke и OpacityMask). Под ними расположен набор вкладок, которые позволяют конфигурировать разные типы кистей, включая текущую кисть со сплошным цветом. Для управления цветом текущей кисти можно применять инструмент выбора цвета, а также ползунки ARGB (alpha, red, green, blue — прозрачность, красный, зеленый, синий). С помощью этих ползунков и связанной с ними области выбора цвета можно создавать сплошной цвет любого вида. Используйте указанные инструменты для изменения цвета в свойстве Fill элемента Ellipse и просмотрите результирующую разметку XAML. Как видите, цвет сохраняется в виде шестнадцатеричного значения:

Что более интересно, тот же самый редактор позволяет конфигурировать и градиентные кисти, которые применяются для определения последовательностей цветов и точек перехода цветов. Вспомните, что редактор кистей предлагает набор вкладок, первая из которых позволяет установить пустую кисть для отсутствующего визуализированного вывода. Остальные четыре дают возможность установить кисть сплошного цвета (как только что было показано), градиентную кисть, мозаичную кисть и кисть с изображением.

Щелкните на вкладке градиентной кисти; редактор отобразит несколько новых настроек (рис. 26.6).

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

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

В результате IDE-среда обновит разметку XAML, добавив набор специальных кистей и присвоив их совместимым с кистями свойствам (свойство Fill элемента Ellipse в рассматриваемом примере) с применением синтаксиса "свойство-элемент":

 

   

     

     

     

   

  

Конфигурирование кистей в коде

Теперь, когда вы построили специальную кисть для определения XAML элемента Ellipse, соответствующий код C# устарел в том плане, что он по-прежнему будет визуализировать круг со сплошным зеленым цветом. Для восстановления синхронизации модифицируйте нужный оператор case, чтобы использовать только что созданную кисть. Ниже показано необходимое обновление, которое выглядит более сложным, чем можно было ожидать, т.к. шестнадцатеричное значение преобразуется в подходящий объект Color посредством класса System.Windows.Media.ColorConverter (результат изменения представлен на рис. 26.7):

case SelectedShape.Circle:

  shapeToRender = new Ellipse() { Height = 35, Width = 35 };

  // Создать кисть RadialGradientBrush в коде.

  RadialGradientBrush brush = new RadialGradientBrush();

  brush.GradientStops.Add(new GradientStop(

    (Color)ColorConverter.ConvertFromString("#FF77F177"), 0));

  brush.GradientStops.Add(new GradientStop(

    (Color)ColorConverter.ConvertFromString("#FF11E611"), 1));

  brush.GradientStops.Add(new GradientStop(

    (Color)ColorConverter.ConvertFromString("#FF5A8E5A"), 0.545));

  shapeToRender.Fill = brush;

  break;

Кстати, объекты GradientStop можно строить, указывая простой цвет в качестве первого параметра конструктора с применением перечисления Colors, которое дает сконфигурированный объект Color: