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

 

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

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

github.com

현재 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... 두 줄의 위치를 바꾸어주니 내가 원하던데로 첫 화면부터 원하는 높이로 띄울 수 있게 되었다. 

앱 제작 도중 만난 에러다.

여기에 막혀서 며칠이나 해맸다.. 늘 그렇듯 정말 사소한 실수였고, 모르면 그만큼 고생하게 된다는 걸 느꼈다. 

 

func mapView(_ mapView: MKMapView, didSelect view: MKAnnotationView){
        if let eventAnnotation = view.annotation as? EventAnnotation{
            print("\(eventAnnotation.title)핀이 눌렸습니다.")
            if let contentVC = storyboard?.instantiateViewController(identifier: "SearchVC") as? SearchVC{
                contentVC.updateView(eventAnnotation.title!, "", "")
            }
        }
    }

메인 컨트롤러에 있는 맵뷰의 핀을 누르면 이벤트 처리를 통해 FloatingPanel(SearchVC를 할당하였다.)에 띄워져 있는 뷰에 접근하려하였다.

func updateView(_ text1:String, _ text2:String, _ text3:String) {
        self.APGroupName.text = text1
        self.addressDong.text = text2
        self.addressDetail.text = text3
    }

이벤트 발생 시 SearchVC 클래스의 IBOutlet label의 텍스트를 수정하려는 부분에서 해당 에러가 발생했다.

에러의 원인은 검색을 통해서 금방 찾을 수 있었는데 원인은 바로 할당되지 않은 변수(nil)에 값을 넣으려니 에러가 발생한 것.. 

여기서 눈치를 챘어야했는데 바보같이 updateView()부분만 계속해서 수정했었다.

 

열심히 삽질을 하다가 문득 FloatingPanel쪽을 들여다 보게되었고, 여기서 해법을 찾았다.

나는 FloatingPanel에 띄워져 있는 뷰 컨트롤러에 접근을 해야했는데, 스토리보드의 instantiateViewController()를 통해 접근하려 했으니, 존재하지 않는 뷰에 접근하려 해서 에러가 발생했던 것이다. 

+ Recent posts