scenee / FloatingPanel

A clean and easy-to-use floating panel UI component for iOS
MIT License
5.6k stars 508 forks source link

Backdrop view isn't masked #42

Closed futuretap closed 5 years ago

futuretap commented 5 years ago

When using a UIVisualEffectView as the background of the content view, the background is displayed in a blurred style. Now when the panel is moved to the .full position, the backdropView is faded in, e.g. with 30% black. Since the backdropView doesn't mask the surfaceView, the blurred background gets slightly darker.

Would be great to fully replicate the Maps.app behavior where only the backdrop view is faded in but the panel background color is unchanged.

The issue can best be observed in the Maps sample app.

futuretap commented 5 years ago

Maybe this technique could be used to achieve a backdrop view that doesn't affect the UIVisualEffectView.

scenee commented 5 years ago

I confirmed this issue was fixed by you on PR #51. Thanks again.

futuretap commented 5 years ago

No, these are actually two separate things. The backdropView is placed in a sibling view of the surfaceView and the UIVisualEffectView still captures the dark background. You can reproduce this in the Maps sample app by replacing:

    public func backdropAlphaFor(position: FloatingPanelPosition) -> CGFloat {
        switch position {
        case .full: return 0.5
        default: return 0.0
        }
    }

As you can see, the blurred part is significantly darker in the .full position:

backdrop-issue
futuretap commented 5 years ago

Can you please reopen this? It's not yet solved.

scenee commented 5 years ago

It's not possible on the library side.

Because a content VC of FloatingPanelController is variable. Not only the corner radius value, the whole shape can be changed by a user.

So it's not possible that FloatingPanelController take care of a special condition of a content VC like the above. If it takes care of it, FloatingPanelController could produce layout bugs.

However, you can handle FloatingPanelController.backdropView with FloatingPanelControllerDelegate or FloatingPanelController.panGestureRecognizer.

It means it's possible to customize the backdrop view as you like. For example, always hide backdrop always , change the color, etc.

As a result, you will achieve what you expected by yourself.