しめ鯖日記

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

トップ > iOS > PathMenuという良い感じのメニューを実現するSwiftライブラリを使ってみる

PathMenuという良い感じのメニューを実現するSwiftライブラリを使ってみる

iOS

PathMenuというライブラリを使ってみました。

github.com

PathMenu概要

PathMenuとは有名アプリであるPathに似たメニューを実現するものです。
似たライブラリでAwesomeMenuというものがあります。

f:id:llcc:20160208234149g:plain

画像は公式サイトより引用。

インストール

インストールはいつものようにCocoaPodsを使います。

pod 'PathMenu'

使い方

下のようにバックグラウンド画像・メニュー画像・リロード画像の3種類の画像を用意します。

f:id:llcc:20160208234449p:plain

使い方は下の通りです。
中心のメニューと外側のメニューを作成してviewにaddSubviewします。

class ViewController: UIViewController {
    override func viewDidLoad() {
        let menuItemImage = UIImage(named: "menu-background")!
        let menuItemHighlitedImage = UIImage(named: "menu-background")!
        
        let starImage = UIImage(named: "reload")!
        
        let starMenuItem1 = PathMenuItem(image: menuItemImage, highlightedImage: menuItemHighlitedImage, contentImage: starImage)
        
        let starMenuItem2 = PathMenuItem(image: menuItemImage, highlightedImage: menuItemHighlitedImage, contentImage: starImage)
        
        let starMenuItem3 = PathMenuItem(image: menuItemImage, highlightedImage: menuItemHighlitedImage, contentImage: starImage)
        
        let items = [starMenuItem1, starMenuItem2, starMenuItem3]
        
        let startItem = PathMenuItem(image: menuItemImage,
            highlightedImage: menuItemImage,
            contentImage: UIImage(named: "menu-menu"),
            highlightedContentImage: UIImage(named: "menu-menu"))
        
        let menu = PathMenu(frame: view.bounds, startItem: startItem, items: items)
        addSubview(menu)
    }
}

f:id:llcc:20160208234754g:plain

delegateも用意されています。

public protocol PathMenuDelegate: class {
    func pathMenu(menu: PathMenu, didSelectIndex idx: Int)
    func pathMenuDidFinishAnimationClose(menu: PathMenu)
    func pathMenuDidFinishAnimationOpen(menu: PathMenu)
    func pathMenuWillAnimateOpen(menu: PathMenu)
    func pathMenuWillAnimateClose(menu: PathMenu)
}

他にもメニューの角度変更・アニメーション速度変更など色々なプロパティーが用意されていました。

menu.animationDuration = 0.3 // アニメーション速度を0.3秒に
menu.menuWholeAngle = CGFloat(M_PI / 2) // メニューの角度を90度に

f:id:llcc:20160209000230g:plain