読者です 読者をやめる 読者になる 読者になる

しめ鯖日記

swift, iPhoneアプリ開発, ruby on rails等のTipsや入門記事書いてます

【iOS】アプリのチュートリアルにぴったりなGeccoを試してみる

会社の同僚の作ったGeccoというライブラリを試してみます。

GitHub - yukiasai/Gecco: Simply highlight items for your tutorial walkthrough, written in Swift

画面の説明を簡単に実装する事ができます。

f:id:llcc:20160426000217p:plain

導入方法

CocoaPodsとCarthageの両方に対応しています。
今回はCocoaPodsを使いました。

pod 'Gecco'

使ってみる

一番ベーシックな使い方です。

override func viewWillAppear(animated: Bool) {
    super.viewWillAppear(animated)

    let spotlightViewController = SpotlightViewController()
    presentViewController(spotlightViewController, animated: true, completion: nil)
    spotlightViewController.spotlightView.appear(Spotlight.Oval(center: CGPointMake(20, 40), diameter: 100))
}

特定の場所にスポットライトをあてる事ができます。

f:id:llcc:20160426000702p:plain

SpotlightViewControllerにはdelegateを渡す事ができます。
呼ばれるメソッドは以下の通りです。

@objc public protocol SpotlightViewControllerDelegate: class {
    optional func spotlightViewControllerWillPresent(viewController: SpotlightViewController, animated: Bool)
    optional func spotlightViewControllerWillDismiss(viewController: SpotlightViewController, animated: Bool)
    optional func spotlightViewControllerTapped(viewController: SpotlightViewController, isInsideSpotlight: Bool)
}

サンプルではSpotlightViewControllerのサブクラスを作り、対応するStoryboardにラベルを付ける事で文字表示を行っています。

f:id:llcc:20160426000217p:plain

spotlightView.appearでなく、spotlightView.moveを使うことで流れるようなアニメーションを実現できます。

f:id:llcc:20160426001239g:plain

spotlightView.move(Spotlight.Oval(center: CGPointMake(screenSize.width / 2, 200), diameter: 220), moveType: .Disappear)