csscodenameonebox-shadow

Codename One CSS Box-Shadow not Rendering

I have an Android application that uses CSS style-sheet.

I am styling a button according to the manual here, but I can't seem to get it working properly.

This is my code from the theme.css file: 

Button {
    background-color: #73258d;
    margin: 25pt;
    text-align: center;
    border-radius: 4pt; 
    cn1-box-shadow-color: green;
    cn1-box-shadow-spread: 4mm;
    padding: 10pt;
}

The spread is showing correctly, but the green shadow color is not rendering at all. I don't have any shadow color whatsoever.

Theses are the screenshots from mt res file .....

What am I missing?

enter image description here

enter image description here

enter image description here

Solution

  • Sorry for the runaround but this is a bit of bad news...

    I completely forgot that we don't support shadow color in the resource file. It's a part of the developer API for the round rectangle class but it never propagated into the resource file. So it isn't supported by the designer tool or the CSS code.

    You have two workarounds you can take:

    1. Edit the component and change the borders RoundRectBorder instance to include the shadow color. This will mean doing it for every component instance of that type...

    2. Use standard CSS shadow tags. This would mean the CSS will generate images instead of a border entry. It will enlarge your resource file and slow down CSS compilation. It might look worse for some cases.

    You can also try to submit a PR with the changes to the resource file and additional CSS support. Although that would require a bit of effort.