目次

1.iOSBuildの実行手順
2.AndroidBuildの実行手順
3.WebBuildの実行手順

はじめに

VisaulzierでのアプリBuild方法について紹介します。
V9でのビルド方法は以下の記事を参考にしてください。

▶︎Visualizerでのアプリビルド方法【V9】

1.iOSBuildの実行手順

これからの手順はXcodeがインストールされていることが前提となります。
インストール出来ていない方は2.開発環境の設定を参照しながらXcodeのインストールをしましょう。

サンプルプロジェクトを以下からダウンロードしてみましょう。
https://github.com/kony/HelloWorld

__Hello world.zip__をクリックしてファイルをダウンロード。
Kony Visualizerを開き画面上部
__File__メニューから__Import__→__LocalProject__→__Open as New Project__を選択

__Select archive~__にチェックを入れて__Browse__ボタンをクリック
先ほどダウンロードしたファイルを選択。
※Zipファイルの場合は、Archiveにチェックを入れ、それ以外の場合は、Select project~を選択
ファイルを選択したら、Finish__をクリックしてインポート完了

画像のように表示されていればインポート成功しています！

次に作成したアプリをエミュレータで起動するための設定を行います。
Kony Visualiverメニュータブ__Product__を選択し、Emulators & Devices Configuration__をクリック。

Preferenceが表示されるのでKony Visualizer→Emulatorを開き、
Mobileの場合→__Mobile
タブレットの場合→__Tablet
開いた後はiOSを選択
次にConfigure Emulatorで、iPhoneまたはiPadを選択。
Nameでエミュレータの名前を設定(ex.iPhoneX,iPad)
名前を設定したらFetch Xcode DetalisをクリックしてXcodeと連携します。
成功したら、iOS Build Optionsに正常に構成されたXcodeとエミュレータバージョンの情報が表示されます。
Saveをクリックし変更内容を保存します。

成功すると以下画像が表示されるのでOKをクリック。設定終了です。

仮想マシンでのBuild実行手順
Kony Visualizerメニュータブから__Product__を選択
Run as →__名付けたエミュレーター名__→__Native__をクリック

Buildが完了すると、Buildタブで緑色のチェックマークが表示され、仮想マシンが自動的に起動します。

※エラーが発生する場合
緑色のチェックマークが表示されず、エラーとなっている場合、以下を実行してみてください
1.XcodeのBuildファイルを新規作成する
前回のキャッシュが残っておりうまくBuildできない場合があり、ファイルごと作り直すと正常に動くようになります。
Finder→自分のPC名→KonyiOSWorkspace→自分のPC名→
iOS-(Konyのバージョン)→VMAppWithKonylib(→KonyのBuild時に作成されるファイル)
このファイルを削除または、名前を変更(名前を変更するだけでも新規にBuildファイルが生成されます)
Konyに戻り、再度Buildしてみる

2.その他
NFIやFFI等を使うアプリの場合、
173のエラーが発生することがありますが、エミュレーターで実行することができない機能のため、
エミュレーターではなくXcodeを通して本番マシン（実機）で実行を行うようにしてください。

本番マシンでの実行手順
これまでの手順に従って仮想マシンでMobile/Tabletを実行する
Xcodeを開く→File→Open→(あなたのパソコンの名前)→KonyiOSWorkspace
→(あなたの作成したファイル）→Kony
→Build時のKonyのバージョンファイル（例：iOS-8.4.28....07192038）
→VMAppWithKonylibを選択。
モバイル端末をコンピューターに接続する
左上のメニューをクリックし__KRelease__→__（あなたのiPhone名）__を選択する
実行[▶︎]をクリック

2.AndroidBuildの実行手順

AndroidStudioをダウンロード
AndroidStudioのインストールについては、こちらの参照をお願いします。
https://www.atmarkit.co.jp/ait/articles/1709/04/news015.html

AndroidStudioでの設定
__Create virtual device__を選択する
エミュレータで実行したいデバイスを選択する
例:Phone→Noxus6P→Next

AndroidのOSバージョンを選択する
例:Lolipopなど
Downloadをクリック
ダウンロードが完了したら、
next→finishをクリック

これで、emulatorで起動させるための仮想デバイスが用意できました。

次に、KonyでBuildしたアプリをemulatorで起動させる場合の設定です。

KonyVisualizer上での設定
1.Kony Visualizer→2.Emulators→3.Mobile→4.Androidを選択
5.Nameと6.Locationを入力する
例：/Users/~~/Library/Android/sdk/emulator/emulator
7.AVD名を選択した後→Save→OK

これでKonyからエミュレータを実行するための設定ができました。

次にエミュレーターを起動するための手順です。
 iOSと同じく、メニューからKony Visualizerのメニューから__Product__を選択し、
 __Run as__→__名付けたエミュレーター名__→__Native__をクリック
Buildが完了すると、Buildタブで緑色のチェックマークが表示され、仮想マシンが自動的に起動します。

本番マシンでの実行手順(こちらよく使います)
Clean and buildで__Android__にチェックを入れる
Buildが完了すると、Console上に以下のようなパスが表示されるので、クリックしFinderを開く。
/Users/（PC名）/（ワークスペース名）/temp/プロジェクト名/build/luaandroid/dist/プロジェクト名前

1.スマホをコンピューターに接続

2.ターミナルで以下コマンドを実行
abd install
/Users/(PC名)/(ワークスペース名)/temp/プロジェクト名/build/luaandroid/dist/プロジェクト名前
abd install のコマンドをインストールする方法は、こちらを参照
https://qiita.com/furusin_oriver/items/f956848788c7a63922bd

成功した場合、接続したAndroidで実行される

3.WebBuildの実行手順

Kony Visualizerのメニューから__Product__を選択し、__Build__をクリック

__Responsive Web__にチェック
__Build__をクリック

※注意
Build後にエラーが発生する場合、 下記チェックを行いエラーを解消してください。

・Project Settings→Kony Fabricで
CloudAccountとKonyFabricEnvironmentを確認しFinishをクリック
(CloudAccountとKonyFabricEnvironmentを予めご用意下さい。)
・Kony FabricのAppsと正常に接続されているか確認。
・接続されているにもかかわらず、エラーが出る場合、一度Unlinkした後、再接続を行う。
・Clean and Buildの実行
・Web画面（Chrome等）のキャッシュ削除
・Web画面（Chrome等）のLocalStorageのデータ削除