FloatingPanel 레이아웃 관련

https://github.com/scenee/FloatingPanel#change-the-backdrop-alpha

GitHub - scenee/FloatingPanel: A clean and easy-to-use floating panel UI component for iOS

현재 FloatingPanel을 이용하여 개발 중 만났던 삽질에 대해 글을 써본다. 

우선 FlotingPanel에 대해 간략하게 설명하자면 애플지도, 애플주식 앱을 켜면 나오는 하단의 bottomSheet이다.

이러한 기본 뷰 위에 또 다른 뷰를 띄우는데 쉽게 제작할 수 있게 라이브러리로 깃허브에 올라와있다. 관심있다면 해당링크로 들어가보자. 

FloatingPanel 라이브러리를 사용중 레이아웃을 수정하여 초기에 뜨는 뷰의 높이를 수정하려는데 아무리 수정해도 반영이 되질 않았다. 

class ViewController: UIViewController, CLLocationManagerDelegate, MKMapViewDelegate, FloatingPanelControllerDelegate{

    @IBOutlet var mapView: MKMapView!
    
    var fpc: FloatingPanelController!
    
    override func viewDidLoad() {
        super.viewDidLoad()
        urlrequest(count: 1)
        
        mapView.delegate = self
        
        fpc = FloatingPanelController(delegate: self)
        
        let contentVC = UIStoryboard(name: "Main", bundle: nil).instantiateViewController(identifier: "ContentVC")
        fpc.set(contentViewController: contentVC)
        
        fpc.addPanel(toParent: self)

        floatingPaneldesign()
        
        fpc.show()
        fpc.layout = CustomFloatingPanelLayout()
    }

class CustomFloatingPanelLayout: FloatingPanelLayout{
    var position: FloatingPanelPosition = .bottom
    var initialState: FloatingPanelState = .tip
    
    var anchors: [FloatingPanelState: FloatingPanelLayoutAnchoring] {
            return [
                .full: FloatingPanelLayoutAnchor(fractionalInset: 0.5, edge: .bottom, referenceGuide: .superview),
                .half: FloatingPanelLayoutAnchor(absoluteInset: 270.0, edge: .bottom, referenceGuide: .superview),
                .tip: FloatingPanelLayoutAnchor(absoluteInset: 110.0, edge: .bottom, referenceGuide: .superview)
            ]
        }
}

문제의 코드. CustomFloatingPanelLayout에서 initialState 변수가 첫 화면이 나올때의 높이를 조절하는 부분인데 아무리 바꾸어도 적용이 되지 않았다. 며칠동안 initialState변수만 들여다 보고있었는데 결론은 메인 뷰 컨트롤러에 있는 fpc.show()부분이었다. quick help를 읽어보니 다음과 같이 적혀있었다. 

Summary
Shows the surface view at the initial position defined by the current layout

"현재 레이아웃으로 정의된 포지션에 뷰를 띄운다." 나는 여태 라이브러리 기본값의 위치로 뷰를 띄우고 나서 레이아웃을 바꾸었으니 첫 화면이 뜰때는 무조건 기본좌표로만 띄워졌던 것이다. 문제를 인지하고나서 fpc.show()와 fpc.layout = Custom... 두 줄의 위치를 바꾸어주니 내가 원하던데로 첫 화면부터 원하는 높이로 띄울 수 있게 되었다.