SFSafariViewController의 표시 애니메이션 변경

SFSafariViewController란?



SFSafariViewController는 iOS9에서 추가된 웹을 표시하는 ViewController입니다.
Safari와의 쿠키 공유를 할 수 있고, 콘텐츠 블록을 할 수 있고 URL이 표시되고 있으면 편리합니다만, 커스터마이즈성은 거의 거의 전무합니다.

Google이 OAuth 인증시 UIWebview/WKWebview를 차단하기로 결정했기 때문에 네이티브 측에서 SDK를 사용하지 않는 경우에는 사용하지 않을 것입니다.

사용법



SFSafariViewController는 단순한 ViewController이므로 생성하여 presentViewController를 제공하면 사용할 수 있습니다.

이번에 처음으로 Swift 써 보았습니다만, presentViewController가 없어져서 present가 되거나 CGRectMake가 없거나라고 당황해 버렸습니다.

ViewController.swift



import UIKit
import SafariServices

class ViewController: UIViewController {
    private var launchButton: UIButton?

    override func viewDidLoad() {
        super.viewDidLoad()

        launchButton = UIButton()
        launchButton?.frame =  CGRect(x: 0, y: 0, width: 100, height: 20)
        launchButton?.layer.masksToBounds = true
        launchButton?.setTitle("Launch", for: UIControlState.normal)
        launchButton?.backgroundColor = UIColor.black;

        launchButton?.layer.position = CGPoint(x: self.view.frame.width / 2, y: 200)

        launchButton?.addTarget(self, action: #selector(self.onClickLaunchButton(_:)), for: UIControlEvents.touchUpInside)
        self.view.addSubview((launchButton)!);


    }

    internal func onClickLaunchButton(_ sender: AnyObject) {
        let sfvc = SFSafariViewController(url: NSURL(string: "https://google.com")! as URL)
        present(sfvc, animated: true, completion: nil);
    }

}




위의 onClickLaunchButton에서 SFSafariViewController를 생성하여 present로 표시하고 있습니다.

이것을 기동해 보면 아래와 같이 됩니다.

아래의 사항을 알기 쉽게 iOS Simulator를 slow animation 설정하고 있습니다.



이렇게 쉽게 웹 페이지를 표시 할 수있었습니다.

애니메이션이 변경되지 않음



여기부터가 본제입니다.

SFSafariViewController는 단순한 ViewController이므로, present 인수의 animated를 true로 하고, SFSafariViewController 자신의 modelTransitionStyle에 값을 설정하는 것으로 표시시의 애니메이션을 변경할 수 있습니다.

내장에 있는 애니메이션의 종류는 아래의 4가지입니다.UIModalTransitionStyle.CoverVerticalUIModalTransitionStyle.CrossDissolveUIModalTransitionStyle.FlipHorizontalUIModalTransitionStyle.PartialCurl
이전 코드에sfvc.modalTransitionStyle = UIModalTransitionStyle.crossDissolve 로 표시 애니메이션을 변경할 수 있습니다.

하지만 SFSafariViewController에 대해서만 이러한 값을 설정해도 변경되지 않습니다.
방금 표시된 것처럼, 옆에서 표시가 되어 버리는 것입니다.

해결책



modalPresentationStyle에 UIModalPresentationStyle.overFullScreen을 설정합니다.
이것뿐입니다.
위의 설정을 하면서, 임의의 UIModalTransitionStyle을 modelTransitionStyle로 설정하는 것으로 애니메이션을 변경할 수 있습니다.

    internal func onClickLaunchButton(_ sender: AnyObject) {
        let sfvc = SFSafariViewController(url: NSURL(string: "https://google.com")! as URL)
        sfvc.modalPresentationStyle = UIModalPresentationStyle.overFullScreen
        sfvc.modalTransitionStyle = UIModalTransitionStyle.crossDissolve
        present(sfvc, animated: true, completion: nil);
    }





flipHorizontal 을 설정하면, 크루와 회전하여 표시도 할 수 있습니다.

    internal func onClickLaunchButton(_ sender: AnyObject) {
        let sfvc = SFSafariViewController(url: NSURL(string: "https://google.com")! as URL)
        sfvc.modalPresentationStyle = UIModalPresentationStyle.overFullScreen
        sfvc.modalTransitionStyle = UIModalTransitionStyle.flipHorizontal
        present(sfvc, animated: true, completion: nil);
    }



좋은 웹페이지 즐겨찾기