C#/.Net Dark Theme

Working on HMI in C#/.NET is fun, but it is a large task to get dark themes right. Below is a list of components that I want to complete:

clEditCtrl Simple text edit control.
clHScrollBar Horizontal Scroll Bar.
clObjectEditor Advanced grid alike editor to edit an “object” with a tree of items.
clPopUpMenu Classic pop-up menu.
clShapeLabel Label with titled corner options.
clSmallButton Small, flat button with image symbols.
clTabBottonCtrl Advanced button with sub-buttons.
clTabStrip A list of buttons located on an edge.
clVScrollBar Vertical Scroll Bar.
clMenu Classic Horizontal Menu
clCaption Dialog title caption
clToolBar Horizontal bar for various sub tools

Other components will be added as needed, but I want to complete the list above so I can move on with other things for now. I decided to not do a drop in replacement of all components, many of the components above also add advanced functionality to be able to quickly create an advanced HMI.

I have tried various schemes, but I ended up sub-classing from UserControl and re-create things from scratch on most components. Luckily I could use the edit control with a few tricks, because that alone is a lot of work. To make this work I had to add color properties as follows on all components.

BackColor Most components have this
ForeColor Most have this as well.
BorderStyle Need to override BorderStyle
BorderColor Very few components could control border color from the application.
BackColorHover Background color if mouse hover over the component.
BackColorShape Used only on shape controls where I need to “normal” background colors.
BackColorSelected Used on controls like push-buttons to signal state.

I started doing this on Qt as well earlier, but I concluded that C# was so much easier to work with and as performance issues I had earlier are gone I moved back to C#/.NET. I might go back and re-visit Qt at some point.

Categories: HMI

Leave a Reply