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に接続してアプリの動作確認してください。
すべてのコンテンツをご覧になるにはログインまたは会員登録が必要です。