iOSアプリのUIを爆速で激ヤバにする2つのライブラリ：生産性ガチアゲなオープンソースiOSライブラリ（2）（1/4 ページ）

ゼロからiOS SDK開発を始める新規開発者でも超高速・高品質な開発を可能にするオープンソースのライブラリを目的別に紹介していく連載です。実際にライブラリを組み込みながら技術的な側面も併せて詳細に説明していきます。今回は、Clearのような折り畳みやFlipboardのような本めくりエフェクト、Twitterのようなプルリフレッシュを実現する方法を紹介します。

[川崎順平, 平川裕多，ソニックス]

「あのアプリのあの機能」を実現するEGOTableViewPullRefreshとMPFoldTransitionを使ってみた

　「良いアプリの条件」というと何が思い浮かぶでしょうか。例えば、誰も実現してない機能を実装していたり、パフォーマンスが良かったり、動作が安定していたり…… とさまざまな意見があると思いますが、「UI／UX（ユーザーインターフェイス／ユーザー体験）が優れている」ということは良いアプリの必須条件だと思います。

　iOSでは標準機能として優れたUIによる快適な操作をユーザーに提供できますが、UI／UXを発展させ、いわゆる「リッチなUI」を持ったアプリがたくさん出ており、それらは新しいユーザー体験を実現することで他のアプリと差別化を図り、人気となっています。

　「リッチなUI」の一例を上げると、「Twitter」ではタイムライン上でリストを下に引っ張ると新しいデータ取得ができるようになっています。「Clear」というToDoアプリはリストをピンチアウトすることで新しいToDoの追加ができ、ニュースアプリの「Flipboard」では画面遷移の際にパネルがめくれるようなアニメーションをして、見た目も操作感も他のアプリにはないものをユーザーに提供しています。

左から、TwitterのTL更新。Clearのタスク追加。Flipboardの画面遷移

　リッチUIを実現するアプリをスクラッチで実装すると非常に時間がかかりますが、ライブラリを使えば簡単に実装できます。

　前回の「iOS SDK開発でOSSライブラリを使う際の基礎知識」では、OSSライブラリ活用の基本とUI系を中心にライブラリを16個紹介しましたが、今回は前述したUIが簡単に実現できる2つのUIライブラリをサンプルプログラムによる簡単な実装方法も含めて紹介します。

プルリフレッシュを実現する「EGOTableViewPullRefresh」を使ってみる

　まずは、「EGOTableViewPullRefresh」を使ってみましょう。

　「EGOTableViewPullRefresh」はテーブルビューのプルダウン時にテーブルヘッダを画面に表示する機能を持っています。TwitterやFacebookなど、さまざまなアプリで採用されているUIです。Twitterのように画面を下に引っ張って表示内容を更新する、という使い方が多いですが、イベント後の処理次第でさまざまな使い方ができると思います。ライセンスはMITライセンスなので、商用利用、改編再利用が可能です。

　では、サンプルプログラムで実際にライブラリを組み込んだアプリを作ってみましょう。

【1】GitHubからライブラリをダウンロード

　GitHubは、GitHub社によって運営されている、バージョン管理システム「Git」をベースにしたリポジトリホスティングサービスです。近年ではOSS（オープンソースソフトウェア）やライブラリを管理するのに最もポピュラーなサービスです。アカウントは誰でも無料で作成でき、無償でソースコードのアップロードや、ダウンロードができるようになっています。

　OSSで公開されているもののダウンロードはアカウントがなくてもできますので、まずは以下からライブラリをダウンロードしてください。

• https://github.com/enormego/EGOTableViewPullRefresh

　下記がEGOTableViewPullRefreshの詳細画面です。

　ダウンロードは画面上にある「clone」ボタンでもcloneコマンドでも実行できます。

　普段、SVN（Subversion）を使っていてGitを使ったことがない方は「clone」という言葉自体聞き慣れないかと思いますが、「CheakOut」に似たようなものだと思ってください。Gitではcloneを使って履歴も含めたサーバ上のほぼ全てのデータを手元に持ってくることができます。

【2】プロジェクトの追加

　今回のサンプルは下記環境で作成しています。

• Xcode バージョン 4.6.1
• （Mac）OS X バージョン 10.8.2

　まずは、Xcodeを起動し、起動画面の左にある［Create a new Xcode project］を選択します。次に、［Application］を選択し、右カラムの中の「Empty Application」を選択します。

　プロジェクト名などの各名称はお好みで任意の名前を設定してください。

　「EGOTableViewPullRefresh」配下のソースをプロジェクトに追加します。

　「Objective-C class」を追加します。

　次のウィザードでは、チェックボックスに何もチェックを入れません。

　最後に、ARC（Automatic Reference Counting）設定の変更です。EGOTableViewPullRefreshはARCに対応していないので、少し設定を変える必要があります。

　ARCとは、iOS5から追加された自動リファレンスカウンタでリファレンスカウンタ方式のメモリ管理を自動で（正確にはコンパイラが）行ってくれるというものです。ARCの詳細は「[iOS5] ARC (Automatic Reference Counting) : Overview - iOS 開発ブログ Natsu’s note」を参考にしてください。

　EGORefreshTableHeaderView.mだけARCを外します、特定のソースのみARCを外す場合はCompiller Flagsに「-fno-objc-arc」を追加し、QuartzCore.frameworkが必要ですので追加します。

　ここまででサンプルプロジェクトが出来上がり、EGORefreshTableHeaderViewライブラリも設定されました。ただし、このまま実行しても何も起こりません。次ページからは、データが表示されるようにソースコードを変更していきます。