Установка рамки в среде выполнения с помощью C# в WPF

После двух недель работы в офисе и изучения WPF в моем новом проекте я вернулся с новой статьей о том, как применить рамку в среде выполнения, установив тень и линейный градиент рамки с помощью C#. Затем в выходные я пытался дополнительно изучить WPF, что могло бы помочь мне в будущей работе. Итак, выполнив некоторые исследования, я пришел к решению, которым поделюсь с вами. Давайте начнем статью.

Для данной статьи я добавил в окно сетку с 3 строками, чтобы можно было добавить одну рамку в одну строку, и между двумя строками я оставил одну для пространства. Далее приводится полный xaml для окна. Можно видеть, что я использовал сетку для моего макета и затем добавил в эту сетку три строки с одинаковой высотой.

Кроме того, я добавил код XAML для рамки и добавил эту рамку в первую строку. Ниже показан код C#, который можно использовать для установки рамки в среде выполнения.

DropShadowBitmapEffect myTestBorderEffect = new DropShadowBitmapEffect();
myTestBorderEffect.Direction = 315;
myTestBorderEffect.Color = Color.FromRgb(84, 84, 84);
LinearGradientBrush myTestBorderGradient = new LinearGradientBrush();
myTestBorderGradient.EndPoint = new Point(0.5, 1);
myTestBorderGradient.StartPoint = new Point(0.5, 0);
myTestBorderGradient.GradientStops.Add(new GradientStop(Color.FromRgb( 75, 218, 92), 1));
myTestBorderGradient.GradientStops.Add(new GradientStop(Color.FromRgb( 12, 126,4), 0));
Border TestBorder = new Border();
TestBorder.Margin = new Thickness(2, 2, 2, 2);
TestBorder.CornerRadius = new CornerRadius(5, 5, 5, 5);
Grid.SetRow(TestBorder, 2);
TestBorder.BitmapEffect = myTestBorderEffect;
TestBorder.Background = myTestBorderGradient;
myTestGrid.Children.Add(TestBorder);

В этом коде я объявил объект DropShadowBitmapEffect, который будет использоваться для установки тени моей рамки, а затем установил направление тени, под каким углом она падает. Я установил угол 315, чтобы тень отображалась внизу и справа от рамки. Можно установить любой желаемый угол. Затем я установил цветовое свойство моего объекта тени, задав цвет отображаемой тени. Я выбрал серый цвет.

Следом за объявлением объекта LinearGradientBrush для моего объекта рамки я объявляю и устанавливаю свойства объекта LinearGradientBrush. Сначала устанавливается EndPoint (конечная точка) объекта линейного градиента, а затем его начальная точка — это значения 0.5 и 0. Затем я устанавливаю GradientStop объекта LinearGradient. Задается также цвет и смещение остановки первого градиента, в данном случае это 1, и цвет остановки второго градиента и его смещение 0. Итак, мои объекты тени и градиента готовы.

Теперь мне необходимо объявить объект рамки, установить для него объекты тени и градиента, а затем добавить этот объект рамки в строку сетки. Сначала я объявляю объект рамки и устанавливаю его свойства, такие как поля слева, вверху,, справа и внизу. Затем я устанавливаю CornerRadius (радиус закругления) рамки, чтобы угол рамки выглядел закругленным. Я установил радиус закругления 5 для каждой стороны, вы можете увеличить или уменьшить этот радиус по своему выбору.

Теперь я установлю строку сетки, в которой будет размещена эта рамка. Для этого я использую функцию Grid.SetRow. Поскольку в моей сетке есть только строки, я устанавливаю только строку сетки. Если в вашей сетке имеются столбцы, и требуется установить столбец teh рамки, можно с помощью функции Grid.SetColumn также установить столбец рамки. Аналогично, если требуется установить columnSpan, то можно воспользоваться функцией Grid.SetColumnSpan. Можно также использовать функцию Grid.SetRowSpan, чтобы установить интервал строк элемента управления (в данном случае рамки).

В последних трех операторах я устанавливаю в качестве значения свойства BitmapEffect объекта рамки объявленный объект тени, затем устанавливаю в качестве значения свойства фона рамки объект LinearGradientBrush, и в конце добавляю рамку в то место сетки, где она должна отображаться, поскольку я установил строку рамки. Результат этой работы показан ниже.

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