Stepper styling question

[eiredrake]

Forgive me for my ignorance, WPF is still largely voodoo to me but I am getting better. I've been googling around all day and digging through XAML and source code for this project and I don't seem any closer to the answer I seek.

All I want to do is set the color of the UI elements indicated by the arrows. Since I am using the dark theme the StepTitleHeaderControl's first and second level titles are hard to read as shown in the attached picture.

How do I set the fore color on these elements to an accent color so they are more visible?

The current thing I am trying is this, but it has no effect:

<Window.Resources> <ResourceDictionary> <ResourceDictionary.MergedDictionaries> <ResourceDictionary Source="pack://application:,,,/MaterialDesignExtensions;component/Themes/StepperTemplates.xaml" /> <ResourceDictionary> <Style x:Key="FooBar" TargetType="{x:Type controls:StepTitleHeaderControl}"> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type controls:StepTitleHeaderControl}"> <StackPanel HorizontalAlignment="Stretch" Orientation="Vertical" VerticalAlignment="Top"> <TextBlock FontSize="40" Foreground="Pink" FontWeight="Medium" Text="{Binding Path=Step.Header.FirstLevelTitle}" /> <TextBlock FontSize="12" Text="{Binding Path=Step.Header.SecondLevelTitle}" Visibility="{Binding Path=Step.Header.SecondLevelTitle, Converter={StaticResource NullableToVisibilityConverter}}" /> </StackPanel> </ControlTemplate> </Setter.Value> </Setter> </Style> </ResourceDictionary> </ResourceDictionary.MergedDictionaries> </ResourceDictionary> </Window.Resources>

<mde:Stepper x:Name="stepper_control" IsLinear="True" Layout="Horizontal" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Steps="{Binding ElementName=_this, Path=StepperViewModel.Steps, Mode=OneTime}" Style="{StaticResource FooBar}">

But I get an error on the stepper style that says StepTitleHeaderControl doesn't match target type Stepper. Which makes sense as they're not the same type... but I can't figure out how to apply the style to the actual controls.

Can anyone punt me in the right direction?

thanks,

[spiegelp]

@eiredrake The trick is to use the Resource property of WPF controls. It's a direct way to define additional resources (styles, data templates, ...) for that control.

Try to move the style for StepTitleHeaderControl into the Stepper resources. Remove the x:Key of the style, so it will be applied automatically to all instances of its TargetType inside your Stepper.

<mde:Stepper>
    <mde:Stepper.Resources>
        <Style TargetType="{x:Type controls:StepTitleHeaderControl}">
            ... your style definition
        </Style>
    </mde:Stepper.Resources>
</mde:Stepper>

Disclaimer: That's my first thought for solving your issue. I didn't try it in code yet.

[jaywha]

I'm also having this issue. The only text without an easily accessible Foreground property has been the StepTitleHeader controls, at least following the tutorial with the MVVM setup.

I've tried the following:

• Stepper.Resource style (without key)
• Window.Resource style (with and without key)
• Application.Resource in App.xaml targeting SystemColors.ControlTextBrushKey

Wound up just changing over to a lighter theme for now.

[spiegelp]

I analyzed the Stepper templates and found out that a trigger for setting the TextBlock.Foreground to active or inactive overrides all other definitions.

Do you see any messages saying that the MaterialDesignStepperInactiveStep or MaterialDesignStepperActiveStep resource cannot be found in the output window in Visual Studio while debugging? I guess that you might have an issue with your color resources. Maybe you forgot to add the resource file with the colors. Could you try the setup of the demo's App.xaml please (line 12 or 13 do the magic).

Furthermore, I managed to override the two color resources for a Stepper like this. You could use this code as fast fix.

<mde:Stepper>
    <mde:Stepper.Resources>
        <SolidColorBrush x:Key="MaterialDesignStepperInactiveStep" Color="Red" />
        <SolidColorBrush x:Key="MaterialDesignStepperActiveStep" Color="Green" />
    </mde:Stepper.Resources>
</mde:Stepper>

If you still have any issues, please provide some code so I can reproduce your situation. It's very tricky to debug issues without seeing any of the code ;-)