tobiforster / materialskin

Theming .NET WinForms, C# or VB.Net, to Google's Material Design Principles.

MaterialSkin for .NET WinForms

This project is ACTIVE

Theming .NET WinForms, C# or VB.Net, to Google's Material Design Principles.

A video of the old version is still available here:

High quality images can be found at the bottom of this page.

Current version:

---

Current state of the MaterialSkin components

Component	Supported	Disabled mode	Animated
Buttons	Yes	Yes	Yes
Backdrop	No	-	-
Cards	Yes	N/A	N/A
Check Box	Yes	Yes	Yes
Check Box List	Yes	Yes	Yes
Combobox	Yes	Yes	Yes
Context Menu	Yes	Yes	Yes
Dialog	No	-	-
Divider	Yes	N/A	N/A
Drawer	Yes	N/A	Yes
Flexible Dialog (big)	Yes	Yes	N/A
FAB - Floating Action Button	Yes	No	Yes
Label	Yes	Yes	N/A
ListView	Yes	No	N/A
Progress Bar	Partial	No	No
Radio Button	Yes	Yes	Yes
Text field	Yes	No	Yes
Sliders	No	-	-
Switch	Yes	Yes	Yes
Tabs	Yes	N/A	Yes

All supported components have a dark theme

TODO List

• Progress bar - Animation and variants, maybe round loading thingy
• Sliders
• Dialog (!= message box)
• Backdrop (maybe)
• Better FAB
• Better Listview
• Disabled textfield
• Some Color code improvements and refactoring

---

Contributting

If you have any issues please open an issue; have an improvement? open a pull request.

This project was heavily updated by @leocb leocb/MaterialSkin

forked from donaldsteele/MaterialSkin

and he forked it from the original IgnaceMaes/MaterialSkin

---

Implementing MaterialSkin in your application

1. Add the library to your project

This will be available as a updated nuget package, but I'm still working on this part

A way of doing this step is by cloning the project from GitHub, compiling the library yourself and adding it as a reference.

Precompiled DLL is available at the releases section

2. Add the MaterialSkin components to your ToolBox

Simply drag the MaterialSkin.dll file into your IDE's ToolBox and all the controls should be added there.

3. Inherit from MaterialForm

Open the code behind your Form you wish to skin. Make it inherit from MaterialForm rather than Form. Don't forget to put the library in your imports, so it can find the MaterialForm class!

C# (Form1.cs)

public partial class Form1 : MaterialForm

VB.NET (Form1.Designer.vb)

Partial Class Form1
  Inherits MaterialSkin.Controls.MaterialForm

4. Initialize your colorscheme

Set your preferred colors & theme. Also add the form to the manager so it keeps updated if the color scheme or theme changes later on.

C# (Form1.cs)

public Form1()
{
    InitializeComponent();

    var materialSkinManager = MaterialSkinManager.Instance;
    materialSkinManager.AddFormToManage(this);
    materialSkinManager.Theme = MaterialSkinManager.Themes.LIGHT;
    materialSkinManager.ColorScheme = new ColorScheme(Primary.BlueGrey800, Primary.BlueGrey900, Primary.BlueGrey500, Accent.LightBlue200, TextShade.WHITE);
}

VB.NET (Form1.vb)

Imports MaterialSkin

Public Class Form1

    Private Sub Form1_Load(sender As Object, e As EventArgs) Handles MyBase.Load
        Dim SkinManager As MaterialSkinManager = MaterialSkinManager.Instance
        SkinManager.AddFormToManage(Me)
        SkinManager.Theme = MaterialSkinManager.Themes.LIGHT
        SkinManager.ColorScheme = New ColorScheme(Primary.BlueGrey800, Primary.BlueGrey900, Primary.BlueGrey500, Accent.LightBlue200, TextShade.WHITE)
    End Sub
End Class

---

Material Design in WPF

If you love .NET and Material Design, you should definitely check out Material Design Xaml Toolkit by ButchersBoy. It's a similar project but for WPF instead of WinForms.

---

Images

A simple demo interface with MaterialSkin components.

The MaterialSkin Drawer (menu).

Every MaterialSkin button variant - this is 1 control, 3 properties

The MaterialSkin checkboxes, radio and Switch.

Material skin textfield and labels

Table control

Progress bar

Cards

MaterialSkin using a custom color scheme.

FlexibleMaterial Messagebox