Use theme to override window background using gradient?

WPF Studio, Themes, and Shared Library for WPF Forum

Posted 8 years ago by Jeff Pek - Autodesk, Inc.
Version: 11.2.0550
Avatar
Hi -

I've just started looking through the new theming stuff in 11.2. Looks pretty easy.
One question, though, that I don't see answered:

Is it possible to use a theme to set a gradient background (instead of a solid color) for window elements, such as background? I'd want to do this for both native and ActiPro controls.

Thanks!
Jeff

Comments (10)

Posted 8 years ago by Actipro Software Support - Cleveland, OH, USA
Avatar
Hi Jeff,

Yes absolutely. All the assets for colors inherit Brush so they can be any sort of brush, even gradients or image tiles.


Actipro Software Support

Posted 8 years ago by Jeff Pek - Autodesk, Inc.
Avatar
Thanks! That was fast! Now a follow-up question:

I tried using an approach to adjust one of the built-in themes as follows. I don't see any effect (at runtime). How do I know which key, in particular, would need to be customized to adjust the background of a particular window or control? I've created this very simple example to show what I'm trying:

In App.xaml:

    <Application.Resources>
        <LinearGradientBrush x:Key="{x:Static themes:AssetResourceKeys.WindowBackgroundNormalBrushKey}" StartPoint="0,0" EndPoint="0,1">
            <GradientStop Offset="0" Color="#FFA6A6A6" />
            <GradientStop Offset="0.25" Color="#FF242424" />
            <GradientStop Offset="0.26" Color="#FF030303" />
            <GradientStop Offset="0.5" Color="#FF0E0E0E" />
            <GradientStop Offset="1" Color="#FF474747" />
        </LinearGradientBrush>
    </Application.Resources>
The single MainWindow:

<Window x:Class="ActiproThemeTest.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:themes="http://schemas.actiprosoftware.com/winfx/xaml/themes"
        Title="MainWindow" Height="350" Width="525">
    <Grid themes:ThemeManager.DesignModeTheme="CustomDarkRed">
        <Button Content="Button" Height="23" HorizontalAlignment="Left" Margin="236,132,0,0" Name="button1" VerticalAlignment="Top" Width="75" />
    </Grid>
</Window>
I turned on theming for native controls in OnStartup:

ThemeManager.AreNativeThemesEnabled = true;

So, in general, how can I tell which of the theme keys needs to be modified to accomplish a given customization?

Thanks for any additional pointers.

Jeff
Posted 8 years ago by Actipro Software Support - Cleveland, OH, USA
Avatar
Hi Jeff,

In your example, you were altering the Window background brush. We don't style the normal Window control but what you had would flow into RibbonWindow as its background. Or you could just reference that brush as your Window.Background to get it into a normal Window.

Or if you changed it to be ButtonBackgroundNormalBrushKey instead, you'd see it as the background of your Button.

We've taken a lot of time to name the assets so that the first portion of the name describes the control kind in which they are used. Like "Edit*" assets are used for things like TextBox, ComboBox, SyntaxEditor, etc.

The best way to know what is used where is to look at our default styles/templates. If you are a WPF Studio customer, you can download them from your account. The native control themes are all in the Shared Library's XAML themes.


Actipro Software Support

Posted 8 years ago by Jeff Pek - Autodesk, Inc.
Avatar
Thanks, I'll look into those things. Is there any way you could provide a sample that does what I'm trying to do?

For us, we don't want to set the background of our window to any ActiPro brush, since it's used in other contexts that don't use Actipro. We just want to customize its presentation in this particular application context.

Thanks,
Jeff
Posted 8 years ago by Actipro Software Support - Cleveland, OH, USA
Avatar
Hi Jeff,

Sorry but I'm not exactly sure what you're looking for. Could you clarify if the info below doesn't help?

If you want to set the window background on a single instance of a Window (Window is about the only native control we don't style by default with our native themes), you'd just add this attribute:
<Window ...
Background="{DynamicResource {x:Static themes:AssetResourceKeys.WindowBackgroundNormalBrushKey}}">...</Window>
If you want it to apply to all Windows in your app you could do this:
<Application ...>    
    <Application.Resources>
    ...    
    <Style TargetType="Window">
        <Setter Property="Background" Value="{DynamicResource {x:Static themes:AssetResourceKeys.WindowBackgroundNormalBrushKey}}" />
    </Style>
    </Application.Resources>
</Application>


Actipro Software Support

Posted 8 years ago by Jeff Pek - Autodesk, Inc.
Avatar
Thanks. I'll try this. What I really want is to style the background of a control (e.g., StackPanel, Grid, ListView), and/or a DockingPanel.

We have a dock manager, and within it a main "document" view, which uses a gradient background. The same application also uses other dockable panels, some of which (actually their child controls) that are used by other portions of our product (which don't use WPF Studio). When these are used within this app, we want to style their look differently.

Not sure how to post a screenshot here; that might be more helpful as an explanation.

Thanks,
Jeff
Posted 8 years ago by Actipro Software Support - Cleveland, OH, USA
Avatar
Hi Jeff,

Our themes package offers several options for Window* and Workspace* brush assets. You can browse them all using the Theme Browser.

It sounds like you might want to use some form of implicit styles that harness those brushes for your scenario.


Actipro Software Support

Posted 8 years ago by Jeff Pek - Autodesk, Inc.
Avatar
Thanks. I've looked through the browser. What I'm having trouble is knowing *which* of the brushes is used when customizing the appearance of various native controls.

For example, are any of them used for the background of the treeview contro? It doesn't seem like it.

Thanks,
Jeff
Posted 8 years ago by Actipro Software Support - Cleveland, OH, USA
Avatar
Right, as mentioned above the only way to really know is to look at our default styles/templates. If you are a WPF Studio customer you can download them from your account. The Shared library defines all the native control styles.

List* assets are used for TreeViews.


Actipro Software Support

Posted 8 years ago by Jeff Pek - Autodesk, Inc.
Avatar
That last bit was the missing piece.
Thanks for the support!

Jeff
The latest build of this product (v2019.1 build 0681) was released 1 month ago, which was after the last post in this thread.

Add Comment

Please log in to a validated account to post comments.