トップページ -> コンピュータ実習 -> JavaScript による Web プログラミング -> RhoStudio で Android の GPS を動かしてみる
[サイトマップへ], [サイト内検索へ],

RhoStudio で Android の GPS を動かしてみる

サイト構成 連絡先,業績など コンピュータ実習 データの扱い コンピュータ設定 教材(公開) サポートページ

この Web ページでは,次のことを行う.


前準備

前準備として,下記のインストールが済んでいること.

  1. JDK (Java Development Kit)のバージョン1.6.0_2以上と、Android SDK のインストールが終わっていること

  2. Android NDK のインストールが終わっていること

  3. RhoMobile Studio または Rhodes のインストールが終わっていること

    rhodes-setup の実行を忘れないこと


RhoMobile アプリケーションのひな形の作成

参考Webページ: http://docs.rhomobile.com/home

Windows での RhoMobile アプリケーションのひな形の作成 (RhoStudioを使用)

  1. RhoStudio を起動する

  2. RhoMobile アプリケーション・プロジェクトの新規作成
    1. 「File」→ 「New」→ 「Project」と操作する

    2. RhoMobile application を選ぶ

    3. プロジェクト名の設定

      ◆ この実行例では「storemanager」と設定している

    4. プロジェクトが作成できたことの確認

Ubuntu での RhoMobile アプリケーションのひな形の作成 (コマンドライン)

◆ 作成手順例

端末で次のように操作

cd /var/tmp
rhogen app hoge http://localhost:9292/hoge


RhoStudio を用いた RhoMobile アプリケーションの作成と起動

ビルド用の設定ファイルは build.yml である

  1. build.ymlAndroid のバージョン, minSDK, Anroid エミュレータ名を設定

    ◆ 設定例(Android エミュレータ名は、実際にあわせて変更すること)

      version: 2.3.3
      minSDK: 10
      emulator: hogeavd
    

    ◆ Ubutnu でのエディタ画面

  2. bulid.yml での GPS の設定

    GPS を使いたいので次のように設定する

    参考 Web ページ: http://docs.rhomobile.com/rhodes/device-caps

    capabilities:
    - gps
    

    ◆ Ubutnu でのエディタ画面

  3. Android SDK マネージャを起動し、「Force https://... sources to be fetched using http://... 」にチェックする

    Android SDK マネージャの起動は,Ubuntu では「/usr/local/android-studio/sdk/tools/android」(Android Studio をインストール済みのとき)

    以下、設定手順と Ubuntu での画面を示す.

    1. 「Tools」をクリックする

    2. 「Options」を選ぶ

    3. Force https://... sources to be fetched using http://... 」にチェックする


モデルとコントローラとビューの作成

◆ モデル

Windows でのモデルの作成 (RhoStudioを使用)

  1. プロジェクトを右クリックし、「New」を選び、「RhoMobile model」を選ぶ

  2. モデルを定義する ◆ この実行例では次のように設定している

  3. モデルが生成されたことを確認する

Ubuntu でのモデルの作成 (コマンドライン)

cd /var/tmp
cd hoge
rhogen model GPS latitude,longitude

◆ コントローラ

app/GPS/g_p_s_controller.rb を書き換え

latidude は緯度, longitude は経度

require 'rho/rhocontroller'
require 'helpers/browser_helper'

class GPSController < Rho::RhoController
  include BrowserHelper

  # GET /GPS
  def index
    @latitude = GeoLocation.latitude
    @longitude = GeoLocation.longitude
    render :back => '/app'
  end

end

◆ ビュー

  1. app/GPS/index.erb を書き換え
    <div data-role="page">
    
    	<div data-role="header" data-position="inline">
        <h1>GP</h1>
        <a href="<%= Rho::RhoConfig.start_path %>" class="ui-btn-left" data-icon="home" data-direction="reverse" <%= "data-ajax='false'" if is_bb6 %>>
          Home
        </a>
    	</div>
    
      <div data-role="content">
          <p>latitude: <%= @latitude %></p>
          <p>longitude: <%= @longitude %></p>   
      </div>
    
    </div>
    

  2. app/index.erb の「Add link here」の部分を書き換え

    次のプログラムを記述する

    <li>
        <a href="GPS">
            <span class="title">GPS</span>
        </a>
    </li>
    


エミュレータでの実行 (Windows で RhoStudioを使用)

  1. プロジェクトを右クリックし、「Run As...」を選び、「Run Configurations...」 を選ぶ

  2. RhoMoblie Application」を右クリックし、「New」を選ぶ

  3. Android SDK のバージョンを指定して、「Apply」をクリック

  4. 引き続き「Run」をクリック

  5. シミュレータの画面が現れる

  6. 「GPS」をクリックしてみる