scenee / FloatingPanel

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

Cannot use autolayout and safe area with FloatingPanelIntrinsicLayoutAnchor properly #470

Open chilimovpasha opened 3 years ago

chilimovpasha commented 3 years ago

Description

I want to show simple panel which height will depend on content height and want to use autolayout and save safe area insets.

Expected behavior

The panel is showing with height based on content layouted by constrained, panel's moves by gestures do not shift the content, and all insets ara used.

Actual behavior

When I setup constraint to safe area the panel behavior becomes strange - content inside shifting and floating by itself. Or I cant save safe area properly.

Steps to reproduce

Code example that reproduces the issue

This is the func from my service which embed a view controller to floating panel.

    func makeFloatingPanel(
        _ contentViewController: UIViewController,
        configuration: FloatingPanelConfiguration = .default) -> UIViewController
    {
        let floatingPanelController = FloatingPanelController()

        floatingPanelController.isRemovalInteractionEnabled = configuration.dismissOnBackgroundTap
        floatingPanelController.backdropView.dismissalTapGestureRecognizer.isEnabled = configuration.dismissOnBackgroundTap

        let bottomPadding = UIApplication.shared.keyWindow?.safeAreaInsets.bottom ?? 0
        floatingPanelController.surfaceView.contentPadding = .init(
            top: configuration.additionalContentPadding.top,
            left: configuration.additionalContentPadding.left,
            bottom: bottomPadding + configuration.additionalContentPadding.bottom,
            right: configuration.additionalContentPadding.right
        )

        floatingPanelController.set(contentViewController: contentViewController)
        floatingPanelController.layout = CustomFloatingPanelLayout()

        let appearance = SurfaceAppearance()
        appearance.cornerRadius = configuration.cornerRadius
        floatingPanelController.surfaceView.appearance = appearance

        return floatingPanelController
    }

The CustomFloatingPanelLayout

final class CustomFloatingPanelLayout: FloatingPanelLayout {

    // MARK: - FloatingPanelLayout
    let position: FloatingPanelPosition
    let initialState: FloatingPanelState

    var anchors: [FloatingPanelState: FloatingPanelLayoutAnchoring] {
        [.full: FloatingPanelIntrinsicLayoutAnchor(absoluteOffset: 0)]
    }

    // MARK: - Init
    init(position: FloatingPanelPosition = .bottom, initialState: FloatingPanelState = .full) {
        self.position = position
        self.initialState = initialState
    }

}

How do you display panel(s)?

How many panels do you displays?

Environment

Library version

2.3.1

Installation method

iOS version(s)

14.5.1

Xcode version

12.5

armanarutiunov commented 3 years ago

Have the same problem. I see from readme that this FloatingPanelIntrinsicLayoutAnchor is deprecated. Is there an alternative way of providing the same behaviour?

warpling commented 3 years ago

Have you tried with FloatingPanelAdaptiveLayoutAnchor?

armanarutiunov commented 3 years ago

Yeah I actually did and it worked out in the end for me

DolganovAnton13 commented 2 months ago

Tell me, please, how can this problem be solved?

warpling commented 2 months ago

@DolganovAnton13 try looking at the samples that use FloatingPanelAdaptiveLayoutAnchor

DolganovAnton13 commented 2 months ago

Description

Bug in samples when using FloatingPanelAdaptiveLayoutAnchor

Expected behavior

If you set
fpc.surfaceView.contentPadding = .init(top: 20, left: 0, bottom: 0, right: 0) 
then I expect that the size of the sheet will be calculated according to the principle of content + paddings

Actual behavior

In fact, the size remains the same and does not take into account safearea

Steps to reproduce

  1. Open samples and go to TableViewControllerForAdaptiveLayout.

  2. Change anchors to

    var anchors: [FloatingPanelState : FloatingPanelLayoutAnchoring] {
        return [
                .full: FloatingPanelAdaptiveLayoutAnchor(
                    absoluteOffset: 0.0,
                    contentLayout: targetGuide,
                    referenceGuide: .safeArea,
                    contentBoundingGuide: .safeArea
                )
        ]
    }

  3. Change numberOfRowsInSection to

func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
     5
}


4. Paint the table background red to visually see the size 
 tableView.backgroundColor = .red


As a result, we will get the following

Simulator Screenshot - iPhone 15 - 2024-09-16 at 22 39 06


if we add a padding at the top, then we get the following


fpc.surfaceView.contentPadding = .init(top: 20, left: 0, bottom: 0, right: 0)

Simulator Screenshot - iPhone 15 - 2024-09-16 at 22 39 26

How do you display panel(s)?

Present modally

How many panels do you displays?

Environment

Library version

Installation method

iOS version(s)

Xcode version