MaterialSkin.2 控件包是在 MaterialSkin 及基礎(chǔ)上二次開發(fā)而來的，在原控件基礎(chǔ)上修復(fù)了一些Bug，豐富了主題以及動畫效果，效果非常好。

• MaterialSkin.2 現(xiàn)在處于不活躍狀態(tài)
• 文中用 MaterialSkin 代替 MaterialSkin.2

Preview

先貼幾張演示Demo中的效果圖：

......

Install

在 NuGet 中搜索 MaterialSkin 就能找到控件包，直接安裝就行：

注意版本框架

工具箱可能不會顯示 MaterialSkin 的控件，需要我們手動添加下：

工具箱 -> 右擊：添加選項卡 -> 把 NuGet 安裝包里的 DLL 文件拖到選項卡里

簡單嘗鮮

• 切換使用MaterialForm：
  添加引用：using MaterialSkin.Controls;
  窗體繼承換成：public partial class Form1 : MaterialForm
  這個時候切換到設(shè)計器就可以看到Material效果的窗體了：
  

切換主題以及配色方案

在后臺代碼中添加一個只讀的MaterialSkinManager變量，通過這個變量來控制主題和配色，把ReadMe.md給出的例程調(diào)整一下方便后續(xù)調(diào)整：

public partial class Form1 : MaterialForm
{
  private readonly MaterialSkinManager materialSkinManager;   
  public Form1()
  {
    InitializeComponent();

    materialSkinManager = MaterialSkinManager.Instance;	// 初始化 MaterialSkinManager 實例
    materialSkinManager.AddFormToManage(this);	// 將要應(yīng)用 Material Design 的窗體添加到管理列表中
    materialSkinManager.Theme = MaterialSkinManager.Themes.LIGHT;	// Theme 屬性用來設(shè)置整體的主題
    materialSkinManager.ColorScheme = new ColorScheme(Primary.BlueGrey800, Primary.BlueGrey900, Primary.BlueGrey500, Accent.LightBlue200, TextShade.WHITE);	// ColorScheme 屬性來設(shè)置配色方案
  }
}

上面代碼寫完運行程序就會是我們配置的配色及主題：

MaterialSkinManager主要是通過Themes以及ColorScheme來控制頁面的顯示效果，前者控制主題，后者控制配色：

• Themes主要是用來切換深色和淺色主題的，對應(yīng)LIGHT和DARK

• ColorScheme主要是用來調(diào)整頁面的配色方案的，它的構(gòu)造函數(shù)提供了兩種不同的重載形式，用于創(chuàng)建顏色方案：

  • public ColorScheme(Primary primary, Primary darkPrimary, Primary lightPrimary, Accent accent, TextShade textShade)
    

    這個構(gòu)造函數(shù)接受 Primary 和 Accent 枚舉類型作為參數(shù)，用于指定主顏色和強調(diào)色。Primary 枚舉包含一系列預(yù)定義的主顏色，而 Accent 枚舉包含一系列預(yù)定義的強調(diào)色。此構(gòu)造函數(shù)還接受 TextShade 枚舉類型的參數(shù)，用于指定文本的明暗色調(diào)。通過使用這個構(gòu)造函數(shù)，你可以輕松地選擇 顏色方案的不同變體。[例程中使用的就是這個重載]

  • public ColorScheme(Color primary, Color darkPrimary, Color lightPrimary, Color accent, TextShade textShade)
    

    這個構(gòu)造函數(shù)接受 Color 類型的參數(shù)，用于直接指定自定義的顏色。你可以傳入具體的顏色對象作為參數(shù)，以定義主顏色、深色主顏色、淺色主顏色、強調(diào)色以及文本明暗色調(diào)。

  先看主題，創(chuàng)建一個改變主題的MaterialButton實現(xiàn)深色和淺色主題的切換了:

private void btn_ChangeTheme_Click(object sender, EventArgs e)
{
    materialSkinManager.Theme = materialSkinManager.Theme == MaterialSkinManager.Themes.DARK ? MaterialSkinManager.Themes.LIGHT : MaterialSkinManager.Themes.DARK;
}

再看配色方案，在此之前我們先在頁面上隨便加一些控件便于顯示配色效果：

更改配色方案：

private int colorSchemeIndex;   // 通過更換次數(shù)，方便循環(huán)更換顏色

private void btn_SwitchColor_Click(object sender, EventArgs e)
{
    colorSchemeIndex++;
    if (colorSchemeIndex == 6)
    {
        colorSchemeIndex = 0;
    }
    SwitchColor(colorSchemeIndex);
}

private void SwitchColor(int colorSchemeIndex)
{
    switch (colorSchemeIndex)
    {
        case 0:
            materialSkinManager.ColorScheme = new ColorScheme(
                materialSkinManager.Theme == MaterialSkinManager.Themes.DARK ? Primary.Teal500 : Primary.Indigo500,
                materialSkinManager.Theme == MaterialSkinManager.Themes.DARK ? Primary.Teal700 : Primary.Indigo700,
                materialSkinManager.Theme == MaterialSkinManager.Themes.DARK ? Primary.Teal200 : Primary.Indigo100,
                Accent.Pink200,
                TextShade.WHITE);
            break;
        case 1:
            materialSkinManager.ColorScheme = new ColorScheme(
                Primary.Green600,
                Primary.Green700,
                Primary.Green200,
                Accent.Red100,
                TextShade.WHITE);
            break;
        case 2:
            materialSkinManager.ColorScheme = new ColorScheme(
                Primary.BlueGrey800,
                Primary.BlueGrey900,
                Primary.BlueGrey500,
                Accent.LightBlue200,
                TextShade.WHITE);
            break;
        case 3:
            materialSkinManager.ColorScheme = new ColorScheme(
                Primary.Red800,
                Primary.Red900,
                Primary.Red500,
                Accent.Green200,
                TextShade.WHITE);
            break;
        case 4:
            materialSkinManager.ColorScheme = new ColorScheme(
                Primary.Yellow800,
                Primary.Yellow900,
                Primary.Yellow500,
                Accent.DeepOrange200,
                TextShade.WHITE);
            break;
        case 5:
            materialSkinManager.ColorScheme = new ColorScheme(
                Primary.DeepOrange800,
                Primary.DeepOrange900,
                Primary.DeepOrange500,
                Accent.Yellow200,
                TextShade.WHITE);
            break;
        case 6:
            materialSkinManager.ColorScheme = new ColorScheme(
                Primary.Lime800,
                Primary.Lime900,
                Primary.Lime500,
                Accent.Green200,
                TextShade.WHITE);
            break;
    }
    Invalidate(); // 重繪控件
}

配色是Github上Example以及用戶issue里的配色方案，大家如果要用的話，可以參考：Material Skin 指南 中文翻譯文檔

看看效果：

MaterialSkin實現(xiàn)了很豐富的動畫效果，But...

默認(rèn)的藍粉配色就已經(jīng)很好看了，大家如果有什么酷炫帥氣的配色方案，歡迎在評論區(qū)留言交流！??這套控件庫好玩的東西還有很多，大家可以自己上手試試，Github倉庫中也提供了一個比較全的演示Demo，可以去看看，強烈推薦?。?！文章來源地址http://www.zghlxwxcb.cn/news/detail-513832.html

到了這里，關(guān)于Winform 好看控件庫推薦：MaterialSkin.2的文章就介紹完了。如果您還想了解更多內(nèi)容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！