This is a migrated thread and some comments may be shown as answers.

Setting a gradient fill pattern for RadMenuItem

5 Answers 148 Views
Menu
This is a migrated thread and some comments may be shown as answers.
Kathy
Top achievements
Rank 1
Veteran
Kathy asked on 22 Jun 2020, 12:14 PM
We are cloning a dialog to be very similar to the Cell Styles dialog in excel and one of the things we need to do is to put a gradient style ( ie. 50% gray, crosshatch, etc ) on a RadMenuItem. Each of our cells is a RadMenuItem. Do you have any samples where something like this was accomplished?

5 Answers, 1 is accepted

Sort by
0
Dinko | Tech Support Engineer
Telerik team
answered on 25 Jun 2020, 08:53 AM

Hi Kathy,

What you can do to achieve this is to use LinearGradientBrush class and specify inside it GradientStop with a different color. For example, the below code snippet shows the LinearGradientBrush of the RadButton control in the default theme (Office_Black). 

<LinearGradientBrush  EndPoint="0.5,1" StartPoint="0.5,0">
    <GradientStop Color="#FFFFFFFF" Offset="0"/>
    <GradientStop Color="#FFDCDCDC" Offset="0.50"/>
    <GradientStop Color="#FFADADAD" Offset="0.50"/>
    <GradientStop Color="#FFD4D4D4" Offset="1"/>
</LinearGradientBrush>

To apply this to all RadMenuItems you can use Implicit Style.

<Style TargetType="telerik:RadMenuItem" BasedOn="{StaticResource RadMenuItemStyle}">
    <Setter Property="Background">
        <Setter.Value>
            <LinearGradientBrush  EndPoint="0.5,1" StartPoint="0.5,0">
                <GradientStop Color="#FFFFFFFF" Offset="0"/>
                <GradientStop Color="#FFDCDCDC" Offset="0.50"/>
                <GradientStop Color="#FFADADAD" Offset="0.50"/>
                <GradientStop Color="#FFD4D4D4" Offset="1"/>
            </LinearGradientBrush>
        </Setter.Value>
    </Setter>
</Style>

As a side note: If you are using NoXAML binaries, the BasedOn property needs to be set to the default style of the control. Otherwise, the implicit style will override the default one and the control will not appear.

Regards,
Dinko
Progress Telerik

Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
Our thoughts here at Progress are with those affected by the outbreak.
0
Kathy
Top achievements
Rank 1
Veteran
answered on 24 Jul 2020, 02:46 PM
I figured out how to do the crosshatching and it looks nice. But now they also want the background color to change. Right now, I use the brush I created for the crosshatching to be the fill for the background. Is it possible to have both the crosshatch and the background color?
0
Vladimir Stoyanov
Telerik team
answered on 29 Jul 2020, 08:50 AM

Hello Kathy,

Can you elaborate on what you mean by "Is it possible to have both the crosshatch and the background color?"? Can you send me some pictures of the expected result? This will hopefully allow me to better understand the requirements and try to think of a suitable suggestion. 

Looking forward to your reply.

Regards,
Vladimir Stoyanov
Progress Telerik

0
Kathy
Top achievements
Rank 1
Veteran
answered on 29 Jul 2020, 12:17 PM
I've attached a few screen shots. If you open up Excel, fill in some cell values and then click cell styles, you will get a dialog with various cell styles. The first screen shot, PatternsNoFill, will show you what I currently have. We have black lines and dots against a white background. Picture YellowPlusDots shows how a user can pick a fill color and a pattern. Picture UltimateGoal shows what I need to do, have the yellow background with the black crosshatch pattern. We're doing this with the RadMenuItems class, each cell that we have in our dialog is a RadMenuItem. I was able to figure out how to do the basic horizontal and vertical lines, but not sure how I can do that plus have a colored background.
0
Vladimir Stoyanov
Telerik team
answered on 03 Aug 2020, 06:40 AM

Hello Kathy,

Thank you for the shared pictures and the provided description. 

Can you check out the following articles, where similar scenarios were discussed? 

- Creating a Hatched / Patterned Brush in WPF 

- Create a hatch pattern in WPF

To recap you can try the approach of using a VisualBrush to achieve the Background and the pattern at the same time. 

I hope you find this helpful.

Regards,
Vladimir Stoyanov
Progress Telerik

Tags
Menu
Asked by
Kathy
Top achievements
Rank 1
Veteran
Answers by
Dinko | Tech Support Engineer
Telerik team
Kathy
Top achievements
Rank 1
Veteran
Vladimir Stoyanov
Telerik team
Share this question
or