Search code examples
wpfgraphcolorslivecharts

Creating shiny colors in WPF

I was wondering how i could create a color gradient that looks like light is shining on it. Similar to this:

Shiny colors

By just using 1 color from the array it looks like this, which is awefull:

1 color

I'm using it with Livecharts.WPF. OR is there a fundamental design necessary like an image from Photoshop to create dashboards like this in WPF?

I was thinking about multiple gradients inside of eachother but i cant get the desired effect.

Solution

  • You're faced with two issues to achieve the effects you're looking for. First, the shiny style, second is the reflection effect.

    The reflection effect can be achieved with this control/code. WPF visual reflection

    Your controls can get the shiny effect by using styles that have already been created. Since it's been over a decade, you're going to have to do some digging and perhaps even get download links from archive.org.

    EDIT: Found themes. Download here. Ensure to right click then select UnBlock after downloading. There are several shiny drop-in themes available, do a search for WPFThemes specifying dates from 2009 on. Your best bet will be in the range of 2009-2015ish.

    A good series on creating your own shiny themes can be found here.

    Some themes such as these have been ported from Silverlight, don't be afraid to use them, some modifications may be needed. The link to get these themes are in blog linked below. You will have to use archive.org to access the codeplex links found in this blog post. Silverlight themes ported to WPF

    I have these themes somewhere but was only able to find this one ShinyRed.xaml, I will look further for you. Add ShinyRed.xaml to your project then define it in your App.xaml with this code.

    <Application x:Class="YoutubeTransfer.App"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         StartupUri="MainWindow.xaml"  >
<Application.Resources>
    <ResourceDictionary Source="/Theme/ShinyRed.xaml">
        <ResourceDictionary.MergedDictionaries>
            <ResourceDictionary Source="ShinyRed.xaml"/>
        </ResourceDictionary.MergedDictionaries>
    </ResourceDictionary>
</Application.Resources>

    Ultimately shiny themes are available for free and can be found online. You can either use those as they are or use them as a template to create your own theme. It will be much work to create your own. The second step will be adding the reflection to get the desired effect.

    Additionally, syncfusion.com has a free tier and have tools to create themes but none are shiny. Perhaps you can use that tool and customize your theme with shiny features. Syncfusion WPF Theme Studio