酒と泪とRubyとRailsと

Ruby on Rails と Objective-C は酒の肴です!

Mobylette iPhone/iPad/Android/iOSを判定、Viewを切り替えるGem[Rails]

Where?Webアプリを作っていてPCとモバイル系(iPhone/iPad/Android/iOS)を判定してViewや処理を切り分けたい場面はあると思います。mobyletteはそういった場面で役立つシンプルなGemです。

tscolari/mobylette · GitHub


Gemのインストール

いつもどおりGemfileに以下を追加して、bundle installを実行してください。

1
gem 'mobylette'

コントローラへの設定

Gemのインストール以外にApplicationController.rbか個別のインストーラに以下の設定を追加します。

1
include Mobylette::RespondToMobileRequests

モバイルとPCでViewを切り替える。

モバイル(iPhone/Android/iPad)とそれ以外(PC)を判定してViewを切り替える場合は、Controllerのメソッドで以下のように記述します。 (respond_to(with)を使わない場合は、自動で振り分けてくれます)

1
2
3
4
5
6
7
8
def index
    何らかの処理

    respond_to do |format|
        format.html   { ... } # PCなど
        format.mobile { ... } # モバイル側
    end
end

すると、以下のように表示が切り分けられます。

PCなど: index.html.erb
モバイル: index.mobile.erb

ちなみにデフォルトではモバイルにはiPhone/Android/iPadが設定されていますが、変更は簡単です。例えば、iPadはPCと同じ画面を表示したい場合は、Controllerに次のように書きます。

1
2
3
mobylette_config do |config|
  config[:skip_user_agents] = [:ipad] # iPadをスキップ
end

すると、以下のように表示が切り分けられます。

PC/iPadなど: index.html.erb
モバイル(iPhone/Android): index.mobile.erb

更に細かくViewを振り返ることも設定を変更すれば可能なようです。 詳しくは以下の公式ページを御覧ください。

tscolari/mobylette · GitHub

処理を振り分けるメソッド

モバイルか、それ以外かで処理を切り替えるのに便利なメソッドを紹介します。

1
2
3
4
5
6
7
8
9
10
11
is_mobile_request?
# モバイルの場合はtrue、それ以外の場合はfalse

is_mobile_view?
# 現在のフォーマットがmobileか、否か

request_device?
# ディバイスが一致した場合のみ true
# 例
# request_device?(:iphone) #=> iPhoneの場合のみtrue
# request_device?(:android) #=> Androidの場合のみtrue

その他テストのやり方なども書かれています。良かったら試してみて下さい!

tscolari/mobylette · GitHub

押さえておきたい書籍

いかがだったでしょうか?
もし説明がわかりにくかったり、間違っている場所があればぜひ一言!

Comments