Kotlin & Firebaseハンズオンセミナー(チャット機能のAndroidアプリを作ってみよう)
- 2017年1月20日
- セミナー
このハンズオンセミナーを1/27(金)に開催します。お気軽にご参加ください。
概要
最近Android開発で注目されているプログラミング言語Kotlinを使ったハンズオンセミナーを開催いたします。またGoogle社にて提供しているmBaas(モバイルバックエンドサービス)であるFirebaseを使って簡単なチャット機能のあるAndroidアプリを作ります。
Androidアプリ開発に必要な環境構築について手順を解説していきます。お使いの環境に合わせMacまたはWindowsのいずれかの環境構築をしてください。
環境構築(Mac)
Macの環境での環境構築の手順を記します。環境構築として下記のソフトウェアをインストールしていきます。
- JDK
- Android Studio
- VirtualBox
- Genymotion
JDKのインストール(Mac)
それではまずJDKのインストールについて手順を紹介します。
今回インストールするJDKのバージョンは1.8をインストールします。
環境によっては既にインストールされている可能性もあるのでバージョンを確認します。
JDKインストール確認(Mac)
JDKのバージョンを確認するにはターミナルを起動してjava -version
コマンドで確認できます。
ターミナルでコマンド実行
java -version
下図のように1.8のバージョンが確認できれば問題ありません。
もしバージョンが1.7以下の場合は下記のJDKダウンロードからインストールを行ってください。
JDKダウンロード(Mac)
下記のリンクをクリックしてJDKダウンロードページにアクセスします。
下の図のとおり、Java SE Development Kit 8 Download
の箇所のAccept License Agreement
のラジオボタンをクリックしてからMac OS Xのリンクをクリックしてdmgファイルをダウンロードします。
JDKインストール(Mac)
ダウンロードされたdmgファイルをダブルクリックします。
下の図が表示されますのでpkgファイルをダブルクリックします。
以降は画面の指示どおりに進めていきインストールを完了させてください。
これでインストールは完了です。インストールが完了したら再度ターミナルに戻ってバージョンを確認しておきましょう。
ターミナルで実行
java -version
下図のように1.8xxxと出てくればOKですので次のAndroid Studioのインストールに進んでください。
Android Studioインストール(Mac)
続いてAndroid Studioをインストールします。
Android Studioとは
Android StudioとはAndroidアプリを開発するために必要な総合開発環境です。Google社より無償で利用できます。
それでは下記の図を参考にインストールしてください。
まず下記のリンクをクリックしてダウンロードページにアクセスします。
同意のチェックをクリックしてダウンロードボタンをクリックすればダウンロードが開始されます。
ダウンロードフォルダの中にdmgファイルだあるはずですので、ダブルクリックします。
下図の画面がでますので、Android Studioのアイコンを選択しドラッグしてApplicationフォルダにドロップしてください。
そしてApplicationフォルダを開き、Android Studioをダブルクリックしてください。
初回起動時には下記の確認画面が表示されます。開く
ボタンをクリックして進めてください。
初めてAndroid Studioをインストールした場合はAndroid SDKというものが入っていませんので下図の画面になります。
Next
ボタンをクリックして次に進みます。
次の画面もNext
ボタンをクリックします。
Finish
ボタンをクリックしてインストールを開始します。
インストールが開始されます。
インストールが完了すると下図の画面になりますのでFinish
ボタンをクリックしてインストールを完了してください。
VirtualBoxのインストール(Mac)
次にVirtualBoxをインストールします。
VirtualBoxとはMacの中に仮想環境を構築し、様々なOSを動かすためのソフトウェアです。Oracle社により無料で提供しています。
それでは下記のリンクよりダウンロードページにアクセスしてください。
下図の矢印の箇所(OS X hosts
の部分)のリンクをクリックしてMac用のVirtualBoxをダウンロードします。
今までと同様dmgファイルがダウンロードフォルダに保存されていますのでダブルクリックします。
pkgファイルをダブルクリックするとインストールが開始されます。
下図のように確認画面が表示された場合は続ける
ボタンをクリックして続けます。
続ける
ボタンをクリックします。
インストール
ボタンをクリックします。
インストールが完了すると下図の画面になりますので閉じる
ボタンをクリックします。
下図の画面が表示されたらゴミ箱を入れる
ボタンをクリックしてダウンロードしたものを削除しておきましょう。
これでVirtualBoxのインストールは完了です。
次のGenymotionのインストールに進んでください。
GenyMotionのインストール(Mac)
Genymotionは、速くて簡単にAndroidアプリを試せるAndroidエミュレーターです。
オープンソースで開発されているため、個人利用なら無料で使用できるので、気軽に使うことができます。
Genymotionページには、以下のような3つの特徴が書かれています。
- 起動が速い
- Android Studioとの連携もスムーズ
それではGenymotionの導入方法を案内します。
Genymotionのダウンロード及びインストールにはユーザ登録が必要ですので登録します。
Genymotionへのユーザー登録(Mac)
ユーザ登録するためにはGenymotionの公式ページにアクセスします。
画面右上のSign in
ボタンをクリックします。
アカウントを新規作成しますのでCreate account
をクリックします。
下図のようにユーザ名やメールアドレス、パスワードを任意に入力します。
下にすくロー氏してI accept..
の箇所をチェックしてCreate an account
をクリックします。
登録したメールアドレス宛にGenymotionからメールが届きます。
そのメール本文の中にあるClick here
をクリックします。
下図の画面が表示されれば無事アカウント登録は完了です。
Genymotionダウンロード(Mac)
アカウント作成されたらGenymotionサイトにログインした状態になっているはずです。
ログインしていたら下図のとおりDownload
リンクがありますのでクリックします。
矢印の箇所をクリックしてインストールファイルをダウンロードします。
Genymotionインストール(Mac)
ダウンロードしたdmgファイルをダブルクリックします。
下図の画面が表示されますのでGenymotion
のアイコンをApplication
フォルダにドラッグ&ドロップします。
Applicationフォルダに移動してGenymotion
をダブルクリックします。
初回起動時は下図の確認画面が表示されますので開く
ボタンをクリックすればGenymotionが起動します。
Genymotionのデバイス追加(Mac)
Genymotionが起動したら下記の画面になります。
Genymotionでデバイスを追加したいと思いますのでAdd
ボタンをクリックします。
Android versionを7.0.0
にしてGoogle Nexus 5X 7.0.0
を選択してNext
をクリックします。
次の画面ではNext
ボタンをクリックして次に進みます。
デバイスの追加が開始されます。
デバイスの追加処理が完了したら下図の画面になりますのでFinish
ボタンをクリックします。
これでデバイスの追加がされました。
プロジェクトの作成・エミュレータ起動確認(Mac)
それでは実際にAndroidアプリのプロジェクトを新規作成してGenymotionのエミュレーターでアプリが起動するか動作確認してみます。
Android Studioを起動してStart a new Android Studio project
をクリックします。
下図の画面が表示されます。今回は何も変更せずにそのままNext
ボタンをクリックします。
Minimun SDK
の箇所をAndroid 7.0にしてNext
ボタンをクリックします。
次の画面でEmpty Activity
を選択してNext
をクリックします。
次の画面は特に変更せずNext
をクリックします。
下図のようにプロジェクトが開きます。
Genymotionプラグインインストール
GenymotionのエミュレーターをAndroid Studioから起動させるためにはプラグインを入れる必要があります。
メニューからAndroid Studio -> Preperences
をクリックします。
Plugins
をクリックしてBrowse repositories
をクリックします。
検索窓にgenymotion
と入力するとGenymotion
のプラグインが候補に出ますので、Install Plugin
ボタンをクリックします。
プラグインのインストールが完了したら一度Android Studioは再起動してください。
再起動した後は下図のとおりGenymoton用のアイコンが表示されますのでクリックします。
初回クリック時はGenymotionのパスを指定する画面が表示されますので下図矢印の箇所をクリックします。
Applicationフォルダの中にGenymotion.app
があるはずですので、それを選択してOK
ボタンをクリックします。
そして再度プロジェクトの画面でGenymotion
のアイコンをクリックするとGenymotionのデバイスが一覧で表示される画面が出ます。
デバイスをクリックしてStart
ボタンをクリックします。
しばらくするとデバイスが起動します。
デバイスが起動した状態で下図のRun
ボタンをクリックします。
下図のとおり起動しているデバイスが表示されているはずですので選択し、OK
ボタンをクリックします。
そうすると下図のようにデバイスの中にアプリがインストールされアプリが起動します。
これでMacの環境構築は以上です。お疲れ様でした!
環境構築(Windows)
Macの環境での環境構築の手順を記します。環境構築として下記のソフトウェアをインストールしていきます。
- JDK
- Android Studio
- Genymotion(VirtualBox)
Windows10のOSをお使いの方は場合によってはGenymotionのデバイスが上手く起動しない場合があります。その場合はAndroid Studio標準のエミュレーターを使うか、実機をPCに接続してアプリの動作確認してください。
JDKのインストール(Windows)
それではまずJDKのインストールについて手順を紹介します。
今回インストールするJDKのバージョンは1.8をインストールします。
環境によっては既にインストールされている可能性もあるのでバージョンを確認します。
JDKインストール確認(Windows)
スタートボタンの箇所の検索欄でcmd
と入力しコマンドプロンプト
のアプリを起動します。
起動したら下記のコマンドを入力してエンターキーを押してください。
コマンドプロンプトにてコマンド実行
java -version
下図のように1.8xxxのバージョンであればOKです。
もしバージョンが1.7以下の場合は下記のJDKダウンロードからインストールを行ってください。
JDKダウンロード(Windows)
下記のリンクをクリックしてJDKダウンロードページにアクセスします。
下の図のとおり、Java SE Development Kit 8 Download
の箇所のAccept License Agreement
のラジオボタンをクリックしてからWindows x64
の箇所のリンクをクリックしてexeファイルをダウンロードします。
JDKインストール(Windows)
ダウンロードしたexeファイルをダブルクリックします。
下記の確認画面が表示される場合があります。その場合ははい(OK)
をクリックして先に進めてください。
画面に従いインストールを完了させてください。
下記の画面が表示されたらインストールは完了です。
インストールされたか確認するため再度コマンドプロンプトで下記のコマンドを実行します。
コマンドプロンプトにてコマンド実行
java -version
下記のとおり1.8xxxのバージョンが確認できたらOKですので次に進みましょう。
Android Studioインストール(Windows)
いてAndroid Studioをインストールします。
Android Studioとは
Android StudioとはAndroidアプリを開発するために必要な総合開発環境です。Google社より無償で利用できます。
それでは下記の図を参考にインストールしてください。
まず下記のリンクをクリックしてダウンロードページにアクセスします。
下図を参考にAndroid Studioのインストールを完了してください。
この画面が表示されればインストールは完了です。
GenyMotion・VirtualBoxのインストール(Windows)
Genymotionは、速くて簡単にAndroidアプリを試せるAndroidエミュレーターです。
オープンソースで開発されているため、個人利用なら無料で使用できるので、気軽に使うことができます。
Genymotionページには、以下のような3つの特徴が書かれています。
- 起動が速い
- Android Studioとの連携もスムーズ
【注意】Windows10のOSをお使いの方は場合によってはGenymotionのデバイスが上手く起動しない場合があります。その場合はAndroid Studio標準のエミュレーターを使うか、実機をPCに接続してアプリの動作確認してください。
それではGenymotionの導入方法を案内します。
Genymotionのダウンロード及びインストールにはユーザ登録が必要ですので登録します。
Genymotionへのユーザー登録(Windows)
ユーザ登録するためにはGenymotionの公式ページにアクセスします。
画面右上のSign in
ボタンをクリックします。
アカウントを新規作成しますのでCreate account
をクリックします。
下図のようにユーザ名やメールアドレス、パスワードを任意に入力します。
下にすくロー氏してI accept..
の箇所をチェックしてCreate an account
をクリックします。
登録したメールアドレス宛にGenymotionからメールが届きます。
そのメール本文の中にあるClick here
をクリックします。
下図の画面が表示されれば無事アカウント登録は完了です。
Genymotion・VirtualBoxダウンロード(Windows)
下図の箇所をクリックしてインストールファイルをダウンロードします。
Genymotion・VirtualBoxインストール(Windows)
ダウロードフォルダにgenymotionのexeファイルがありますのでダブルクリックしてインストールを開始します。
下図を参考にインストールを完了させてください。
Genymotionのインストールが完了したらVirtualBoxのインストールになります。
こちらも下図を参考にインストールを完了さえてください。
これでVirtualBoxのインストール完了しました。
インストールが完了すると下図が表示されるはずです。Accept
ボタンをクリックしてください。
Genymotionのデバイス追加(Windows)
Genymotionが無事起動したらデバイスの追加をしていきます。
下図を参考にデバイス追加を行ってください。
この画面が表示されれば無事デバイスの追加がされた状態です。
プロジェクトの作成・エミュレータ起動確認(Windows)
それでは実際にAndroidアプリのプロジェクトを新規作成してGenymotionのエミュレーターでアプリが起動するか動作確認してみます。
Android Studioを起動してStart a new Android Studio project
をクリックします。
下図の画面が表示されます。今回は何も変更せずにそのままNext
ボタンをクリックします。
Minimun SDK
の箇所をAndroid 7.0にしてNext
ボタンをクリックします。
次の画面でEmpty Activity
を選択してNext
をクリックします。
初回起動時では下図のWinwowsファイアウォールの確認画面が表示される場合があります。その場合はアクセスを許可する
を選んでください。
これでプロジェクトが作成されました。初回起動時はこのようにTipの画面が表示されます。
不要でしたらShow Tips no Startup
のチェックを外してClose
ボタンをクリックします。
Genymotionプラグインのインストール
GenymotionのエミュレーターをAndroid Studioから起動させるためにはプラグインを入れる必要があります。
メニューからFile -> Settings
をクリックします。
Plugins
をクリックしてBrowse repositories
をクリックします。
検索窓にgenymotion
と入力するとGenymotion
のプラグインが候補に出ますので、Install Plugin
ボタンをクリックします。
プラグインのインストールが完了したら一度Android Studioは再起動してください。
再起動した後は下図のとおりGenymoton用のアイコンが表示されますのでクリックします。
初回クリック時はGenymotionのパスを指定する画面が表示されますので下図矢印の箇所をクリックします。
C:¥Program Files
の中にGenymobile -> Genymotion
があるはずですので、それを選択してOK
ボタンをクリックします。
そして再度プロジェクトの画面でGenymotion
のアイコンをクリックするとGenymotionのデバイスが一覧で表示される画面が出ます。
デバイスをクリックしてStart
ボタンをクリックします。
しばらくするとデバイスが起動します。
デバイスが起動した状態で下図のRun
ボタンをクリックします。
下図のとおり起動しているデバイスが表示されているはずですので選択し、OK
ボタンをクリックします。
そうすると下図のようにデバイスの中にアプリがインストールされアプリが起動します。
これでWindowsの環境構築は以上です。お疲れ様でした!
【注意】Windows10のOSをお使いの方は場合によってはGenymotionのデバイスが上手く起動しない場合があります。その場合はAndroid Studio標準のエミュレーターを使うか、実機をPCに接続してアプリの動作確認してください。
すべてのコンテンツをご覧になるにはログインまたは会員登録が必要です。