Google+ もご覧ください
ユーザーアイコン

実践!RubyMotion

RubyMotion + Qiitaなアプリを作ろう (2)

Satococoa

RubyMotion + Qiitaなアプリを作ろう (2)

RubyMotion でアプリケーションを作ろう 2

前回に引き続き、RubyMotion で Qiita API から取得したデータを表示するアプリケーションを作っていきます。

カスタム View Controller を作る

このまま app/app_delegate.rb にコードを書いていくこともできますが、あまりに複雑になってしまいますので別のコントローラに分けようと思います。

まずは UITableViewController を継承してカスタム View Controller を作ります。以下のような内容でapp/entries_controller.rbを作成してください(Cocoa Touch フレームワークについてはあまり詳細を述べませんのでソースコード中のコメントを参考にしていただければ幸いです)。

app/entries_controller.rb

class EntriesController < UITableViewController
  # ビューが読み込まれた後で実行されるメソッド
  def viewDidLoad
    super

    @tag = 'RubyMotion'
    self.title = @tag # ナビゲーションバーのタイトルを変更
    @entries = [] # 取得したエントリをこのインスタンス変数に格納

    url = "https://qiita.com/api/v1/tags/#{@tag}/items"
    # 前回に引き続き BubbleWrap を使う
    BW::HTTP.get(url) do |response|
      if response.ok?
        json = BW::JSON.parse(response.body.to_s)
        @entries = json
        self.tableView.reloadData # テーブルをリロード
      else
        p response.error_message
      end
    end
  end

  # テーブルの行数を返すメソッド
  def tableView(tableView, numberOfRowsInSection:section)
    @entries.count
  end

  # テーブルのセルを返すメソッド
  ENTRY_CELL_ID = 'Entry'
  def tableView(tableView, cellForRowAtIndexPath:indexPath)
    cell = tableView.dequeueReusableCellWithIdentifier(ENTRY_CELL_ID)

    if cell.nil?
      cell = UITableViewCell.alloc.initWithStyle(UITableViewCellStyleSubtitle, reuseIdentifier:ENTRY_CELL_ID)
    end

    entry = @entries[indexPath.row]
    # ラベルをセット
    cell.textLabel.text = entry['title']
    cell.detailTextLabel.text = "#{entry['updated_at_in_words']} by #{entry['user']['url_name']}"
    cell
  end
end

次にこの View Controller を呼び出すコードをapp/app_delegate.rbに書きます。前回書いたコードを削除し、以下のように変更してください。

app/app_delegate.rb

class AppDelegate
  def application(application, didFinishLaunchingWithOptions:launchOptions)
    @window = UIWindow.alloc.initWithFrame(UIScreen.mainScreen.bounds)

    # ドリルダウンの遷移を作りたいので EntriesController のインスタンスを作り、UINavigationController の中に入れる
    entries_controller = EntriesController.new
    navigation_controller = UINavigationController.alloc.initWithRootViewController(entries_controller)

    @window.rootViewController = navigation_controller
    @window.makeKeyAndVisible
    true
  end
end

最低限ここまで実装することでテーブルの各行に Qiita から取得したデータを表示することが出来ます。実行してみましょう。

RMQiita スクリーンショット1
RMQiita スクリーンショット1

コードを見ると、一見「なんだ、Objective-C でアプリ作るのとあまり変わらないじゃないか」と思われがちですが、文字列内での変数展開や文字列操作、配列やハッシュの操作など、そのような地味なところでもじわじわと Ruby であるありがたみが感じられます。

Cocoa Touch フレームワークのメソッド名は分かりやすい反面、長くて覚えることは困難です。RubyMotion を使用する場合でも補完機能のあるエディタや IDE1を使うといいでしょう。

エディタについては Setting up your editor to work with RubyMotion (和訳) が参考になります。

また、Cocoa Touch フレームワークのリファレンスを参照するのには Dash という OS X 用のアプリケーションが便利です。ぜひ導入してみてください。

次のページでは投稿の本文表示周りを実装します。

Rubymotion
タグ:

記事をリクエストする

関連記事

コメント