Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Visual issue in round shape #598

Closed
husker-dev opened this issue Dec 10, 2019 · 5 comments
Closed

Visual issue in round shape #598

husker-dev opened this issue Dec 10, 2019 · 5 comments
Assignees

Comments

@husker-dev
Copy link

When I tested rounding I found this issue. It seems like shadow can't be rounded more than 10 (pixels probably). I also tried to set shadow's rounding value manually, but it didn't change

With shadow

image

<style type="button">
    <painter>
        <decorations>
            <decoration>
                <WebShape round="22,0,0,0" />
                <WebShadow type="outer" width="9" />
            </decoration>
        </decorations>
    </painter>
</style>

Without shadow

image

<style type="button">
    <painter>
        <decorations>
            <decoration>
                <WebShape round="22,0,0,0" />
                <WebShadow type="outer" color="0,0,0,0" />
            </decoration>
        </decorations>
    </painter>
</style>
@mgarin mgarin self-assigned this Dec 11, 2019
@mgarin mgarin added this to the v1.2.12 milestone Dec 11, 2019
@mgarin
Copy link
Owner

mgarin commented Dec 11, 2019

This seem to be a problem with shape calculation and not shadow:
image

I might have an idea what causes it, but I'll have to check it. From a glance it does seem that it hits a limit of 50% of bounds height and doesn't go any further for shadow or background, while border actually doesn't care about it.

Also there is another problem you can see on screenshot above - the overkill round size is not taken into account and you can see shape stretching outside a bit. This is probably something I won't be touching as it is up to whoever makes the style to keep it sized reasonably for the given context.

@mgarin
Copy link
Owner

mgarin commented Dec 11, 2019

It seems that there are some major flaws with the shape creation on some edge cases like this one, so I'll be reworking it to fix the problem.

It fails not only when it doesn't have enough space - border/background/shade shapes are also sometimes inconsistent on large components.

@husker-dev husker-dev changed the title Shadow with rounded shape Visual issue in round shape Dec 11, 2019
@mgarin
Copy link
Owner

mgarin commented Dec 11, 2019

I've already made a local fix, but I'll need to heavily test it because this change affects every single component as most of them use WebShape that is getting a major change. So I'll probably release somewhere mid-day tomorrow, although it will only be available on snapshot builds for now.

@mgarin
Copy link
Owner

mgarin commented Dec 12, 2019

I've somewhat finished with the fix, but it will take a bit longer to wrap all changes that I've been working on locally. It shouldn't take more than a few hours though.

Here is the result example:

image

Note that in case you "overshoot" with the round it will still look weird:

image

Although shadow and background will now follow border to death. You can even see that background spreads over different bounds on top three buttons which is correct considering all three shapes basically have different bounds.

I thought about maybe limiting round to height/width, but then there are still cases when two rounded corners meet on a side - what should happen then? So I'll leave it as it as for now and see if I will find any good solution for it later.


There are also some niche cases which might still have problems even after these changes - specifically with shadow - but I was aware of those even before you've pointed out this bug and I'll be ironing them out later. No one discovered those yet anyway and probably won't due to specifics :)

mgarin added a commit that referenced this issue Dec 13, 2019
- All component descriptors have been updated with complete information about component's `Painter`s
- Streamlined all UI implementations to use `PainterSupport` instead of custom code and calls
- UI implementations do not own `Painter` instance anymore, those are stored in `JComponent`'s client properties only
- Removed some unnecessary method bridges from UI implementations, more will be removed in the future commits for v1.2.12
- Streamlined all `SpecificPainter` implementations to implement `ParameterizedPaint` use `PaintParameters` instead of custom setup methods
- AbstractDecorationPainter.java, WebBreadcrumb.java - Replaced old way of retrieving component `Painter`
- StyleManager.java - Simplified descriptor methods due to generics not being used

Shape [ #598 ]
- ShapeUtils.java - Moved to `ui` module since it's used exclusively there and can use some of `ui` module classes
- ShapeUtils.java - Replaced old `createRoundedShape` with new methods moved from `WebShape` and adjusted to work correctly on some edge cases
- WebShape.java - Now uses new `ShapeUtils` methods for creating all kinds of shapes
- ComponentHighlighter.java - Adjusted to use new `ShapeUtils` methods

RootPane
- WebRootPaneUI.java - Removed unnecessary check from `installWindowDecorations ()` method that caused issues with new `Painter` usage
- WebFrame.java, WebDialog.java, WebWindow.java - Changed custom `JRootPane` implementations to use `StyleId.auto` for simplicity

Accordion
- WebAccordionUI.java - Removed redundant control fields

FileChooser
- WebFileChooserUI.java - Removed duplicate property check

OptionPane
- WebOptionPaneUI.java - Simplified and refactored code

ButtonPopup
- WebButtonPopup.java - Removed as deprecated, unfortunately it won't be replaced with any reworked implementation for now

HotkeyLabel
- hotkeylabel.xml - Improved dark skin colors

DemoApplication
- ExamplesFrame.java - Both scroll bars now use extending mode
- DemoApplication.java - Added runtime information to status bar

General
- Refactored all affected classes to make use of `@NotNull` and `@Nullable` annotations
- Fixed multiple possible NPEs across the affected classes
@mgarin
Copy link
Owner

mgarin commented Dec 13, 2019

I've pushed fix for this issue along with other internal changes. WebShape should now work in the same way for borders, backgrounds and shadow (visually).

Snapshot v1.2.12 build will be available soon.

@mgarin mgarin closed this as completed Dec 13, 2019
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants