はじめに
先日PoiというiOSのライブラリを作成しました。
https://github.com/HideakiTouhara/Poi
PoiとはTinderのようなカードスワイプUIを簡単に実装できるライブラリです。
(15スター以上取るのが目標なので、よろしければスター頂けると幸いです)
こんなかんじのUIを手軽に作ることが出来ます。
今大学生でエンジニアアルバイトをしているのですが、アプリを作るだけでなくOSS開発したいなーと思ったのがきっかけで作りました。
工夫した点としては、ユーザーはTableViewを実装するような感じでこのライブラリを使えるようにした点です。
多くのiOS開発者にとって慣れ親しんだ方法で実装することが出来ます。
導入方法
手動
手動で入れるならライブラリをCloneして
git clone git@github.com:HideakiTouhara/Poi.git
以下のように直接追加してあげればOKです。
Carthage, CocoaPods
Carthage, CocoaPodsどちらも対応済みです。
CocoaPodsならpodfileに
pod ‘Poi’
CarthageならCartfileに
github "HideakiTouhara/Poi"
でいけます。
使い方
PoiViewというカスタムViewを何らかの形で生成してください。
StoryBoardからViewを配置してClassをPoiViewにするか、
コード上で
let poiView = PoiView()
self.view.addSubView(poiView)
で作れます(どちらもimport Poiの記述は必要です)
あとはdelegateとdatasourceに準拠します
class ViewController: UIViewController, PoiViewDataSource, PoiViewDelegate {
poiView.dataSource = self
poiView.delegate = self
このあたりはTableViewと同じ感じですね。
使えるメソッドの紹介
PoiViewDataSourceのメソッド
func numberOfCards(_ poi: PoiView) -> Int
設定するカードの枚数を決めます。
func poi(_ poi: PoiView, viewForCardAt index: Int) -> UIView
スワイプするカードの中身を設定します。
返り値はUIViewで返してください。
func poi(_ poi: PoiView, viewForCardOverlayFor direction: SwipeDirection) -> UIImageView? {
switch direction {
case .right:
return UIImageView(image: #imageLiteral(resourceName: "good"))
case .left:
return UIImageView(image: #imageLiteral(resourceName: "bad"))
}
}
カードが左右に振れたときオーバーレイする画像を設定することが出来ます。
directionで左右どちらの場合かで場合分けできます。
PoiViewDelegateのメソッド
func poi(_ poi: PoiView, didSwipeCardAt: Int, in direction: SwipeDirection)
スワイプされたときに呼ばれるメソッドです。
こちらもdirectionで左右どちらにスワイプされたか場合分けできます。
func poi(_ poi: PoiView, runOutOfCardAt: Int, in direction: SwipeDirection)
最後のカードがスワイプされたときに行いたい処理はここに記述してください。
その他のメソッド
func swipeCurrentCard(to direction: SwipeDirection)
強制的に1枚スワイプしたいときはこのメソッドを呼んでください。
アニメーションもついています。
func undo()
一枚前のカードに戻れます。
こちらも戻るアニメーションがついています。
GitHub上にはSampleも置いているのでチェックしてみてください！
作ってみて
ライブラリを作るというと大層なことに聞こえますが、実際は普段作っている機能を独立して切り出すだけという感覚でした。
ただ、実際はどんな人でもどんな使い方をしても動作するようにというところにかなり時間をとられました。いわゆる疎結合というやつです。
とりあえず最低限の機能はできたかなという段階なので、反応があれば今後ユーザーの意見を取り入れてどんどん新機能を追加していきたいです。
最後になりますが、ぜひスターをポチッと押して頂けると幸いです。
https://github.com/HideakiTouhara/Poi