Uikit- 5

김정현·2023년 6월 14일
0

UIKit

목록 보기
9/14

OnBoardingView

이런식으로 화면위에 뜨는 형식이다.
우선 새로운 cocoatouch파일을 만들어서 페이지를 따로 제작해주고, 메인 뷰 컨트롤러에서

 override func viewDidAppear(_ animated: Bool) {
        super.viewDidAppear(animated)
        
        
       let itemVC =  OnBoardingitenViewController.init(nibName: "OnBoardingitenViewController", bundle: nil)
        
        self.present(itemVC, animated: true, completion: nil)
    }
}

이런식으로 인스턴스화 시킨후, present를 통해 불러오는 형식이다.
주의할 점은 반드시 viewDidAppear를 입력하고 거기 내부에 입력하여야한다.

(viewDidLoad부분은 아직 화면이 활성화 되지 않은 상태기 때문에 이상태에서 온보딩뷰를 활성화하려고하면 오류가 발생한다.)

(viewWillappear은 화면이 나타나기 직전)

그러나 여러 페이지를 만들것이기때문에 pageviewcontroller을 따로 코코아터치로 생성 후, pages에 온보딩페이지들을 추가한다.

var pages = [UIViewController]()

override func viewDidLoad() {
        super.viewDidLoad()

        let itemVC1 = OnBoardingitenViewController.init(nibName: "OnBoardingitenViewController", bundle: nil)
        //itemVC1.mainTitileLabel.text = "첫 번째"   //크래쉬가 발생  -> 다른방법으로 텍스트를 구현할 필요 있음.
        let itemVC2 = OnBoardingitenViewController.init(nibName: "OnBoardingitenViewController", bundle: nil)
        let itemVC3 = OnBoardingitenViewController.init(nibName: "OnBoardingitenViewController", bundle: nil)
        
        pages.append(itemVC1)
        pages.append(itemVC2)
        pages.append(itemVC3)
        
        setViewControllers([itemVC1], direction: .forward, animated: true) //시작페이지 설정
        
        self.dataSource = self
    }

viewDidLoad 파트에 OnboardingviewController를 인스턴스화를 페이지 수만큼 시킨후, pages에 추가한다.

그리고 초기페이지를 설정해준다.

extension OnBoardingPageViewController: UIPageViewControllerDataSource {
    func pageViewController(_ pageViewController: UIPageViewController, viewControllerBefore viewController: UIViewController) -> UIViewController? {   //이전페이지
        guard let currentIndex = pages.firstIndex(of: viewController) else{ //옵셔널값이기때문에 guard
            return nil
        }
        if currentIndex == 0 {
            return pages.last
        }else{
            return pages[currentIndex - 1]
        }
    }
    
    
    func pageViewController(_ pageViewController: UIPageViewController, viewControllerAfter viewController: UIViewController) -> UIViewController? {    //다음페이지
        guard let currentIndex = pages.firstIndex(of: viewController) else{ //옵셔널값이기때문에 guard
            return nil
        }
        if currentIndex == pages.count - 1 {
            return pages.first
        } else{
            return pages[currentIndex + 1]
        }
    }
    
}

나머지 익스텐션에는 이전페이지, 다음페이지를 설정한다.

메인 뷰컨트롤러에서 인스턴스 과정에서 페이지뷰 넘김 방식을 설정 할 수 있다.

 let pageVC =  OnBoardingPageViewController(transitionStyle: .scroll, navigationOrientation: .horizontal, options: .none) // xib파일 없으면 바로 인스턴스화 가능

화면 크기도 지정할 수 있다.

pageVC.modalPresentationStyle = .fullScreen

창에 각각 글자와 사진을 입력받기 위해선
온보딩뷰 컨트롤러에

var mainText = ""
    var subText = ""
    var topImage:UIImage? = UIImage()

이런식을 변수로 생성하고

let itemVC1 = OnBoardingitenViewController.init(nibName: "OnBoardingitenViewController", bundle: nil)
        //itemVC1.mainTitileLabel.text = "첫 번째"   //크래쉬가 발생
        itemVC1.mainText = "첫 번째"
        itemVC1.topImage = UIImage(systemName: "iphone.slash.circle")
        itemVC1.subText = "abc"

        let itemVC2 = OnBoardingitenViewController.init(nibName: "OnBoardingitenViewController", bundle: nil)
        itemVC2.mainText = "두 번째"
        itemVC2.topImage = UIImage(systemName: "iphone.slash")
        itemVC2.subText = "dsad"
        
        let itemVC3 = OnBoardingitenViewController.init(nibName: "OnBoardingitenViewController", bundle: nil)
        itemVC3.mainText = "세 번째"
        itemVC3.topImage = UIImage(systemName: "iphone.radiowaves.left.and.right.circle")
        itemVC3.subText = "sdfdssdf"

페이지뷰 컨트롤러에 이런식으로 온보딩뷰에 변수를 변경해주는 형식으로 해야한다.
(변수를 생성하고 변경해주는 이유는 viewDidLoad는 화면이 뜨기전이라 값을 미리 받아서 변경해줄 수가 없다.)

폰트 바꾸기

@IBOutlet private weak var mainTitileLabel: UILabel!{
        didSet{
            mainTitileLabel.font = UIFont.systemFont(ofSize: 20, weight:  .medium)
        }
    }

온보딩뷰 컨트롤러에서 didset을 활용해 바꿔줄 수 있다.

0개의 댓글