Как использовать элементы управления дизайном материала с C # в приложении WinForms

Всем нравится Material Design, всеобъемлющий дизайн, используемый в качестве руководства для визуального, динамического и интерактивного дизайна на платформах и устройствах. Несмотря на то, что Material Design специально используется в ОС Android и других продуктах Google, вы все равно можете использовать дизайн как угодно и где угодно.

Чтобы использовать дизайн материалов в своих приложениях WinForms, вы можете использовать библиотеку MaterialSkin для добавления темы в .NET WinForms, C # или VB.Net с принципами конструирования материалов Google. Эта библиотека следует рекомендациям, определенным в спецификации проекта материала, и использует те же компоненты и функциональные возможности.

1. Установите MaterialSkin через NuGet

Предпочтительный способ установки — через NuGet. Установите пакет с помощью Visual Studio, открыв диспетчер пакетов NuGET. Делать щелкните правой кнопкой мыши ваш проект в обозревателе решений в правой верхней части Visual Studio и выберите Управление пакетами NuGet в выпадающем меню:

В появившемся окне перейдите на вкладку Обзор и найдите MaterialSkinвыберите пакет (с последней версией, а именно обновленной MaterialSkin) в списке и установите его в своем проекте:

Заметка

В соответствии с версией .NET Framework, которую вы используете, вам необходимо скачать определенную версию плагина. Например, MaterialSking.Updated Пакет требует как минимум .NET Framework 4.6.2.

После завершения установки пакета вы сможете работать с Material Design в своем проекте. Посетите официальный репозиторий на Github для получения дополнительной информации об этой библиотеке.

2. Добавьте элементы управления материалом в панель инструментов элементов управления.

С MaterialSking вы сможете перетаскивать элементы управления в ваши формы так же, как и с традиционными элементами управления. Чтобы быть организованным, мы рекомендуем вам создать настраиваемую вкладку панели инструментов для хранения внутри эксклюзивных элементов управления этой библиотеки. Сделайте правый клик на пустом месте панели инструментов и в выпадающем меню выберите «Добавить вкладку», это позволит вам создать пустую вкладку и дать собственное имя, в этом случае мы назовем его «Material Controls»:

Затем щелкните правой кнопкой мыши на созданной вами вкладке (элементы управления Metro) и выберите «Выбрать элементы» в меню:

В новом окне перейдите на вкладку «Компоненты .NET Framework» и нажмите «Обзор»:

Когда появится средство просмотра файлов, вам нужно будет перейти в папку вашего проекта WinForms, затем в папке пакетов найдите папку MaterialSking, а затем в lib. Внутри папки lib должен быть файл dll, выберите его нажатием на open:

Затем появится панель загрузки и элементы управления появятся в списке компонентов .NET, наконец, нажмите OK:

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

И вы сможете просто перетаскивать нужные элементы управления в форме так же, как вы используете стандартные компоненты Windows.

3. Установить стиль материала

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

Начните с импорта пространств имен MaterialSkin в верхней части вашего класса:

using MaterialSkin;
using MaterialSkin.Controls;

Тогда вы сможете изменить тип вашей формы. Как правило, декларация вашей формы имеет Form напр., например class Form1 : Form, но если вы хотите это с Material Style, то вам нужно изменить тип Form в MaterialForm:

namespace Sandbox
{
public partial class Form1 : MaterialForm
{
// ... //
// ... //
// ... //

Теперь в функции конструктора вашего класса, в этом случае Form1, под InitializeComponent Чтобы добавить функцию, добавьте код для использования Material Skin вместо значения по умолчанию и измените цветовую палитру формы:

public Form1()
{
InitializeComponent();
// Create a material theme manager and add the form to manage (this)
MaterialSkinManager materialSkinManager = MaterialSkinManager.Instance;
materialSkinManager.AddFormToManage(this);
materialSkinManager.Theme = MaterialSkinManager.Themes.LIGHT;
// Configure color schema
materialSkinManager.ColorScheme = new ColorScheme(
Primary.Blue400, Primary.Blue500,
Primary.Blue500, Accent.LightBlue200,
TextShade.WHITE
);
}

Как видите, реализация пользовательских элементов управления для WinForms довольно проста. Сохраните изменения и запустите форму, чтобы увидеть, что происходит!

4. Пример

В следующем примере показано, как создать форму Material Styled на главной форме в простом проекте WinForms:

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows.Forms;
// Import the Material Skin
using MaterialSkin;
using MaterialSkin.Controls;
namespace Sandbox
{
public partial class Form1 : MaterialForm
{
public Form1()
{
InitializeComponent();
// Create a material theme manager and add the form to manage (this)
MaterialSkinManager materialSkinManager = MaterialSkinManager.Instance;
materialSkinManager.AddFormToManage(this);
materialSkinManager.Theme = MaterialSkinManager.Themes.LIGHT;
// Configure color schema
materialSkinManager.ColorScheme = new ColorScheme(
Primary.Blue400, Primary.Blue500,
Primary.Blue500, Accent.LightBlue200,
TextShade.WHITE
);
}
private void Form1_Load(object sender, EventArgs e)
{
}
}
}

Предыдущий код будет генерировать следующую форму:

Затем вы можете просто перетащить некоторые элементы управления из панели инструментов, созданной на шаге 2, и создать удивительные формы:

Для получения дополнительной информации или для чтения документов библиотеки, мы рекомендуем вам посетить официальный репозиторий на Github здесь. Хотя этот проект больше не находится в стадии активной разработки, он хорошо сделан и содержит много полезных компонентов, и мы все еще приветствуем его. Кроме того, сообщество, скорее всего, все равно поможет, если вы откроете проблему.