Biz/Browser SmartDevice
Android 開発用
スタートアップガイド

株式会社オープンストリーム
Copyright(c) Open Stream, Inc. All Rights Reserved

1目次
1.

事前準備 ............................................................................................ 3

2.

Biz/Browser SmartDevice のインストール .............................................. 4

3.

プロジェクトの作成

4.

Biz/Designer Mobile でリモートデバッグ設定をする ................................ 14

5.

Biz/Browser SmartDevice の設定 ........................................................ 16

6.

リモートデバッグ .............................................................................. 18

7.

リモートデバッグがうまく行えない場合 ................................................. 228.

リモートデバッグで使用するポート番号の変更......................................... 24–Hello World- ....................................................... 5

Copyright(c) Open Stream, Inc. All Rights Reserved

2

1. 事前準備
本スタートアップガイドは既に Biz/Designer Mobile をインストール済みの状態を前提に説明しております。
まだ、Biz/Designer Mobile をインストールされていない場合は、弊社 HP よりダウンロードし、インストールを行って下さい。
ご用意頂くもの① Android 端末(OS のバージョンは、Biz/Browser SmartDevice に対応しているバージョンをご用意下さい)② Biz/Designer Mobile Ver.4.6.3.0 以降がインストールされた Windows PC③ 無線 LAN 環境(インターネットに接続が出来ること)

Copyright(c) Open Stream, Inc. All Rights Reserved32. Biz/Browser SmartDevice のインストール
インストール方法は、「BizBrowser SmartDevice (Android) インストールガイド」
をご覧ください。
インストール後、Biz/Browser アイコンをタップし、Biz/Browser を起動して下さい。

「デモアプリ一覧をダウンロードする」を押すと、デモの一覧がダウンロードされます。
※ダウンロードが完了すると「デモアプリ一覧を更新する」に変更されます

Copyright(c) Open Stream, Inc. All Rights Reserved

43. プロジェクトの作成–Hello World-① Biz/Designer Mobile の起動スタート メニュ ー（ Windows 8 の場 合は「全 てのア プリ 」画面 ）から「Biz/Designer Mobile」を起動します。
② 新規プロジェクトの作成「新規プロジェクト(N)」を選択し「空のプロジェクト」を作成して下さい。

プロジェクト名を「startup」（任意）と入力し、プロジェクトを作成して下さい。

Copyright(c) Open Stream, Inc. All Rights Reserved5

③ プロジェクトの設定
プロジェクトを選択して、メニューバーの「プロジェクト(P)」から「設定(S)」を選択して下さい。

Copyright(c) Open Stream, Inc. All Rights Reserved

6

「基本設定」タブの「対象 Biz/Browser バージョン(E)」で Android 端末にインストールした Biz/Browser SmartDevice と同じ API Version を選択し、「OK」を押して下さい。
Ver4.6.12.0 以前

Copyright(c) Open Stream, Inc. All Rights Reserved

7

Ver4.6.13.0 以降

Copyright(c) Open Stream, Inc. All Rights Reserved

8API Version について
Biz/Browser SmartDevice のバージョンによって API Version も異なります。
ご利用になる Biz/Browser SmartDevice の API Version に合わせて設定を行ってください。
API Version は、Biz/Browser SmartDevice のバージョン情報から確認できます。

④ 新規 Form の作成
次に Form を作成します。

新規 Form の作成後、ファイルを「Form1.crs」のまま保存して下さい。

Copyright(c) Open Stream, Inc. All Rights Reserved

9

⑤ ボタンの配置
右部のクラスセレクタから「Button」をクリックし、Form 画面でドラッグ＆ドロップすることにより、ボタンを作成できます。

Copyright(c) Open Stream, Inc. All Rights Reserved10作成したボタンを右クリックし、「直接編集(E)」を押して、タイトルに「Hello World」と入力してください。

直接編集の方法についてショートカットキーが割り振られております。
ボタンを選択後、F2 で同様の操作が行えます。

Copyright(c) Open Stream, Inc. All Rights Reserved

11

⑥ Touch イベントの作成
作成したボタンを選択し、右部の「プロパティビュー」の「イベントタブ」を選択して下さい。
イベント名「Touch」をダブルクリックし、スクリプトビューへ移動します。

Copyright(c) Open Stream, Inc. All Rights Reserved

12

イベント関数が自動的に生成されていることをご確認下さい。
「OnTouch イベントハンドラ内」に print 関数を作成します。
引数に文字列 Hello World と入れ、Biz/Designer Mobile の下部の実行結果ビ
ューに Hello World と出力するサンプルが作成出来ました。
サンプルコード：
Function OnTouch( e ) {/* OnTouch イベントハンドラ *//* ここにイベント処理を記述してください */print("Hello World.\n");}Copyright(c) Open Stream, Inc. All Rights Reserved

13

4. Biz/Designer Mobile でリモートデバッグ設定をする
リモートデバッグを行うために準備を行います。
メニューバーの「ツール」より、「オプション(O)」を選択して下さい。

Copyright(c) Open Stream, Inc. All Rights Reserved

14

下部の「リモートデバッグを使用する(R)」にチェックを入れ、「OK」を押して下さい。

Copyright(c) Open Stream, Inc. All Rights Reserved

15

5. Biz/Browser SmartDevice の設定
リモートデバッグを行うため、「開発者用画面へ切り替え」をタップして、開発者用ホーム画面に変更してください。

Copyright(c) Open Stream, Inc. All Rights Reserved

16ホーム画面の種類は 2 種類ございます。
標準：
Biz/Browser SmartDevice のデモをダウンロードしてご体験できます。
デベロッパ：
開発者用のリモートデバッグに 特化したメニューが実行されます。

Copyright(c) Open Stream, Inc. All Rights Reserved17

6. リモートデバッグ
実際にリモートデバッグを行うために、PC の IP アドレスを取得する必要がございます。
コマンドプロンプトを利用して IP アドレスを取得して下さい。

IP アドレスの取得の仕方
Windows キーと R キーを同時に押して、ファイル名を指定して実行を出し、「cmd」と入力して下さい。
または、スタートメニューより、「プログラムとファイルの検索」から、「cmd」と入力して下さい。
黒い画面が表示後、「ipconfig」と入力すると、ネットワークの状態が取得できます。
「IPv4 Address」の値が IP アドレスとなります。

取得した IP アドレスを仮に「10.0.0.1」として説明いたします。
IP アドレス取得後、Android 端末から Biz/Browser を起動して下さい。
起動時のホーム画面が標準モードだった場合は、アプリケーションを再起動して下さい。

Copyright(c) Open Stream, Inc. All Rights Reserved18Android 端末でのアプリケーションの強制終了の仕方
起動中のアプリケーション一覧を表示して、Biz/Browser のアイコンを下から上にフリックすることにより、アプリケーションが強制終了されます。

Copyright(c) Open Stream, Inc. All Rights Reserved

19Biz/Browser を起動し、「デバッグモードを開始」ボタンを「長押し」すると、デバッグモード設定ダイアログが表示されます。
先ほど取得した IP アドレスを「ホスト」へ入力し、「開始」ボタンを押して下さい。

ポートについてAndroid 端末と PC との接続時のポート番号は、標準が 44080 となっております。
既にこのポート番号をお使いの場合は、Biz/Designer Mobile の設定より変更出来ます。
ポート番号の変更は、８章をご参考下さい。

接続先ホストの変更について接続先ホストは最後に接続された IP アドレスが記憶され、タップすると即座にデバッグ接続を行います。
接続先ホストを変更した場合は、「デバッグモードを開始する」ボタンを長押し、「デバッグモード設定」ダイアログを表示して、ホストの変更を行って下さい。

Copyright(c) Open Stream, Inc. All Rights Reserved

20

「開始」ボタンを押すと、Biz/Designer Mobile 側で接続が確立したメッセージが出力されます。

「OK」を押すと、テスト実行が行えるようになります。
先ほど作成した「Form1.crs」を開き、赤い三角の「編集中のファイルからテスト実行」を行って下さい。
Android 端末上で、Button が配置された Form が表示されます。

ボタンを押す度に、Biz/Designer Mobile の実行結果ビューに「Hello World」を文字が表示されます。

編集中のファイルからテスト実行についてショートカットキーが割り振られております。
Ctrl+F5 で同様の操作が行えます。

ステップ実行によるデバッグについて
Biz/Designer では、crs プログラム上にブレークポイントを設置し、ステップ実行することが出来ます。イベントが発生した時や、一時停止を行った時に変数の値や、オブジェクトのプロパティを参照することが出来ます。

Copyright(c) Open Stream, Inc. All Rights Reserved21

7. リモートデバッグがうまく行えない場合
リモートデバッグ機能では、通信環境によってうまく接続が出来ない場合があります。出来ない場合の解決方法を以下に示します。
① ファイアーウォールによる障害
ファイアーウォールが設定されている場合、ポートの開放がうまく行えない場合がございます。
まず、Windows のコントロールパネルより、ファイアーウォールを一旦無効にし、接続できるかをご確認下さい。
接続が行えた場合、ファイアーウォールの設定を戻して下さい。
その後、ファイアーウォールの詳細設定を開き、受信の規則に「新しい規則」を設定して下さい。
例）[ポート]→[TCP/特定のローカルポート(44080)]→[接続を許可する]→[必要に応じてチェックを入れる]→[名前(Biz/Designer)]
接続が行えない場合、そのまま②へ進んで下さい。
② セキュリティソフトによる障害
セキュリティソフトの設定により指定のポートが利用できない場合がございます。
①と同様に、一度セキュリティソフトを停止の上、接続確認を行って下さい。
接続が行えた場合、各種セキュリティソフトの設定より、指定ポートの受信を許可して下さい。
③ 「①②」を試したが、接続が行えない場合同じネットワーク内に端末が存在するかをご確認下さい。
Android 端末側の IP アドレスを確認します。
「設定」→「Wi-Fi」→接続中のアクセスポイントを選択して下さい。
IP アドレスの欄(仮に 10.0.0.2 とします)を覚えていただき、PC から接続確認を行います。
コマンドプロンプトを開き、以下のように入力して下さい。
ping 10.0.0.2

Copyright(c) Open Stream, Inc. All Rights Reserved

22結果が「Request timed out.」と表示された場合、同一ネットワーク内に存在してないか、ネットワーク設定が不正です。
ネットワークの設定を再度ご確認下さい。
結果が「Reply from 10.0.0.2: bytes=32 time<1ms TTL=128」と表示された場合、同一ネットワークには存在しておりますので、その他の原因が考えられます。
Proxy や、アクセスポイントの設定をご確認の上、ネットワーク担当者へご相談下さい。

Ping コマンドの使い方
Windows キーと R キーを同時に押して、ファイル名を指定して実行を出し、「cmd」と入力して下さい。
または、スタートメニューより、「プログラムとファイルの検索」から、「cmd」と入力して下さい。
黒い画面が表示後、「ping [IP アドレス]」と入力すると、接続先の端末へパケットの送受信状況を確認することが出来ます。

ネットワーク環境が不安定な場合、リモートデバッグ中に動作が止まってしまうことがあります。その際に、片方の接続ステータスが接続中になり、Biz/Browser、Biz/Designer の操作が行えなくなることがあります。
その場合は、PC と Android 端末共に一度アプリケーションを終了し、再度リモートデバッグを行って下さい。

Copyright(c) Open Stream, Inc. All Rights Reserved238. リモートデバッグで使用するポート番号の変更
リモートデバッグでは、Android 端末から PC に接続する際に特定のポートを開放する必要があります。
標準では 44080 番ポートを使用しますが、メニューバーの「実行」の「ネットワークの設定」から「デバッグポート番号(D)」を変更することが出来ます。

Copyright(c) Open Stream, Inc. All Rights Reserved

24

Biz/Browser SmartDevice Android 開発用
スタートアップガイド
２０１５年０８月０１日

初版発行

２０１６年０２月０８日

第二版発行

２０１７年１２月２５日

第三版発行

２０２１年０７月０２日

第四版発行

株式会社オープンストリーム

Copyright(c) Open Stream, Inc. All Rights Reserved

25