Загрузка...

WPF Кастомные окна (Туториал)

Тема в разделе C# создана пользователем DVEON 11 июн 2019. (поднята 7 июн 2019) 592 просмотра

  1. DVEON
    Кому понравилось (1) Скопировать BBCode
    DVEON Автор темы 11 июн 2019 3 7 июн 2019
    Всем привет, сегодня мы будем делать кастомные окна 3 способами.



    1 способ - WindowChrome

    Это самый популярный способ, для его реализации нужно просто написать пару строк на XAML, но имеются значительные (для меня) недостатки.


    Реализация 1:


    1) Добавить окну атрибуты:

    Код

    

    
AllowsTransparency="True"
    

    
WindowStyle="None"

    2) добавить между тегами окна(там, где Grid) конструкцию:

    Код

    

    
<WindowChrome.WindowChrome>
    

    

    
 <WindowChrome CaptionHeight="30" ResizeBorderThickness="5" />
    

    

    
</WindowChrome.WindowChrome>

    CaptionHeight - Высота заголовка,

    ResizeBorderThickness - толщина краёв окна для растягивания.


    Недостатки:


    Когда окно развернуто во весь экран за краями экрана пропадает несколько пикселей (На StackOverFlow написали, что это можно исправить с помощью Margin = 5, но это может по-разному работать на разных версиях Windows. Также это зависит от ширины границы окна, которую можно поменять с помощью AeroTweak.)


    Больше информации о WindowChrome: https://docs.microsoft.com/ru-ru/dotnet/api/system.windows.shell.windowchrome?view=netframework-4.8



    2 способ - MahApps.Metro

    Это самый простой способ, ведь в нем нам предоставляется уже готовое окно.


    1) В консоль NuGet вводим команду:

    Код
    Install-Package MahApps.Metro

    2) Добавляем пространство имён в тег окна:

    Код
    xmlns:Controls="clr-namespace:MahApps.Metro.Controls;assembly=MahApps.Metro"

    3) Заменяем тег Window на <Controls:MetroWindow>.


    4) Изменяем наследование в файле C#:

    Код

    

    
public partial class MainWindow: MetroWindow {
    

    

    
public MainWindow() {
    

    

    
InitializeComponent();
    

    

    
}
    

    

    
}


    5) Выбор цветовой схемы:


    Изменяем тег <Application.Resources> в файле App.xaml на:

    Код

    

    

    
<Application.Resources>
    

    

    
  <ResourceDictionary>
    

    

    
    <ResourceDictionary.MergedDictionaries>
    

    

    
      <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Controls.xaml" />
    

    

    
      <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Fonts.xaml" />
    

    

    
      <!-- Light.Blue.xaml - сама цветовая схема, Light можно заменить на Dark, а Blue на любой другой цвет -->
    

    

    
      <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Themes/Light.Blue.xaml" />
    

    

    
    </ResourceDictionary.MergedDictionaries>
    

    

    
  </ResourceDictionary>
    

    

    
</Application.Resources>

    Из недостатков можно отметить только то, что это окно плохо приспособлено для кастомизации. Оно основано на ControlzEx, который мы рассмотрим далее. Он позволяет включить окну свечение с помощью атрибута GlowBrush="{DynamicResource AccentColorBrush}", где {DynamicResource AccentColorBrush}" можно заменить любым другим цветом.


    Подробнее на mahapps.com



    3 способ - ControlzEx

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


    1) Делаем, всё как в 1 способе и вводим в консоль NuGet команду:

    Код

    

    
Install-Package ControlzEx -Version 3.0.2.4


    2) Добавляем пространства имён в MainWindow.xaml.cs:

    Код

    

    
using ControlzEx.Behaviors;
    

    
using Microsoft.Xaml.Behaviors;

    3) Добавляем исправленное поведение в MainWindow.xaml.cs в метод MainWindow:

    Код

    

    

    
GlowWindowBehavior glow = new GlowWindowBehavior();
    

    

    
glow.GlowBrush = new SolidColorBrush(Colors.Orange); // Тут задаётся цвет
    

    

    
glow.ResizeBorderThickness = new Thickness(5);
    

    

    
Interaction.GetBehaviors(this).Add(glow);

    Это была моя первая статья, просьба не судить строго!
     
    11 июн 2019
Загрузка...
Top