エンジニアtype - エンジニアのシゴト人生を考えるWebマガジン
  • TOP
  • キーパーソン
  • 旬ネタ
  • コラボ
  • ノウハウ
  • 女子部
  • キャリア

開発環境の構築ステップを完全図解~Android StudioからはじめるAnroidアプリ開発:その1【初心者向けアプリ開発3分tips】

2015/03/07公開

 
スクール講師がアドバイス!初心者のためのアプリ開発3分tips

アプリ開発スクール『RainbowApps

日本で初めて、プログラミング受講料の無料提供を始めたアプリ開発スクール。iPhone、Android、Unityコースを展開しており、受講用のMac完備、初心者・未経験者から受講OK。無料体験コースも行っている。特徴は、大手IT企業からベンチャーまで、受講後の就職・転職もサポートしている点だ。全国で教室を開いているほか、オンライン講座も展開中。詳しい情報はコチラ

こんにちは、日本最大のアプリスクール『RainbowApps』で、横浜校を運営している高橋良輔(たかはしりょうすけ)と申します。本連載では、iOS、Android、Unityなどのアプリ開発について、初心者向けの内容を『RainbowApps』講師陣が分かりやすく解説していきます。

今回から、「Android StudioからはじめるAndroidアプリ開発」というタイトルで連載を行います。Androidアプリの新しい開発環境、Android Studioについて、アプリ開発初心者向けに解説を行っていく予定です。

第一回目の今回は、開発環境の構築について解説を行います。少々長くなりますが、ぜひお付き合いください。

Android Stdioをインストール

まず、Android Studioのダウンロードおよびインストールから始めます。 ブラウザで下記のURLにアクセスし、「Download the SDK」ボタンをクリックしてください。

http://developer.android.com/sdk/index.html

次のページで「 I have read and agree with the above terms and conditions」のチェックボックスにチェックをし、Downloadボタンをクリックしてください。

ra-android-tips05_1ra-android-tips05_2

ダウンロードが完了したら、下にあるダウンロードしたzipファイルをクリックして解凍し、下記の画面が立ち上がるので「Android Studio」を「アプリケーション」フォルダーにドラック&ドロップしてください。移動が完了したらこの画面は消してください。

ra-android-tips05_3

また、Android Studioを起動する前にMacの「システム環境設定」→「セキュリティとプライバシー」の設定を変更しておきます。

「セキュリティとプライバシー」の画面の左下のアイコンをクリックして管理者権限のパスワードを入力して変更可の状態にし、「ダウンロードしたアプリケーションの実行許可」を「すべてのアプリケーションを許可」に変更します。

ra-android-tips05_4

Java not foundのエラーが出た場合
下記のJava not foundのエラー画面が表示された場合にはお使いのPC(Mac)にJava実行環境がインストールされていません。

ra-android-tips05_5

下記のリンクをクリックしてJava実行環境をインストールしてください。

Java SE Development Kit 7 Downloads

Javaのダウンロードページにアクセスしたら下記の手順でJDKをダウロードしてください。

ra-android-tips05_6

Android Studioの起動
次に下記のような画面が表示されますので、そのまま「Next」をクリックしてください。

ra-android-tips05_7

次の画面も「Next」をクリックしてください。

ra-android-tips05_8

Android SDKをインストールするための同意を求められますので、【1】~【5】の手順でFinishボタンをクリックしてください。

ra-android-tips05_9

Android SDKのダウンロード・インストールが開始します。完了するまで少々時間がかかります。

ra-android-tips05_10ra-android-tips05_11

上記の画面が表示されたらAndroid SDKのインストールは完了です。

エミュレーターの構築

PC(Mac)上でAndroidアプリを動作確認するためにエミュレーターを構築します。「Welcome to Android Studio」の画面の「Start a new Android Studio project」をクリックします。

ra-android-tips05_12

次に下記の画面が表示されアプリ名などを設定できますが、今回はそのまま「Next」ボタンを押してください。

ra-android-tips05_13

次に下記のような画面が表れますが、ここも何も変更せずに「Next」ボタンを押してください。

ra-android-tips05_15

次に出てくる下記のような画面でも、何も変更せずに「Next」ボタンを押してください。

ra-android-tips05_14

次に下記の画面でも、何も変更せずに「Finish」ボタンを押してください。

ra-android-tips05_16

次に下記のような画面が出てくるので少々お待ちください。

ra-android-tips05_17

そうすると、下記のような画面が出てくるはずです。「Close」ボタンを押してください。

ra-android-tips05_18

これでようやくプロジェクト画面が立ち上がりました。

ra-android-tips05_19

次にAndroid Studioのメニューバーの「Tools」を選択し、バー内にある「Android」を選択し、その奥にある「SDK Manager」をクリックします。

ra-android-tips05_20

下記のような画面が表示されるので、下記の画面のようにチェックボックスにチェックを入れ、「Install ~packages…」をクリックしてください。

ra-android-tips05_21

すると次のような画面が表示されるのでこのテキストに従ってクリックしてください。

ra-android-tips05_22

インストールが完了しましたら下記のような画面に戻るので画面を閉じてください。

ra-android-tips05_23

次にエミュレーターの設定を行います。 下記の画面に従って移動してください。

ra-android-tips05_24

次に下記の画面が表示されるので「Create…」ボタンをクリックしてください。

ra-android-tips05_25

下記の画面が表示されたら、画面に従って入力して「OK」ボタンをクリックしてください。

ra-android-tips05_26

その後、下記のような画面が表示されるので「OK」ボタンをクリックしてください。

ra-android-tips05_27

すると、画面が戻りますので「Nexus5」をクリックし、「Start…」ボタンをクリックしてください。

ra-android-tips05_28

次に下記のような画面が表示されるので「Launch」ボタンをクリックしてください。

ra-android-tips05_29

少し待っているとエミュレーターが起動するので、確認したら画面を閉じてください。

ra-android-tips05_30

これでエミュレーターの環境構築は完了です。

Genymotion(シミュレーター)の構築

次にシミュレーターである「Genymotion」をインストールします。

まず、ブラウザで下記のURLにアクセスし、「x86/amc64」ボタンをクリックしてください。

VirtualBoxをインストール

ra-android-tips05_31

インストールが完了しましたら下記のようにクリックし、zipファイルを解凍してください。

ra-android-tips05_32

解凍したら下記のような画面が表示されるので「VirtualBox.pkg」をクリックしてください。

ra-android-tips05_33

次に下記のような画面が表示されるので「続ける」ボタンをクリックしてください。

ra-android-tips05_34

次に下記のような画面が表示されるので「インストール」ボタンをクリックしてください。

ra-android-tips05_35

ここで下記の画面のようにパスワードを要求されるので、入力して「ソフトウェアをインストール」ボタンをクリックしてください。

ra-android-tips05_36

インストールが完了したら次のような画面が表示されるので「閉じる」ボタンをクリックしてください。

ra-android-tips05_37

次に、「Genymotion」をインストールします。 ブラウザで下記のURLにアクセスし、「Get Genymotion」ボタンをクリックしてください。

Genymotionをインストール

ra-android-tips05_38

次に下記のような画面が表示されるので「Download」ボタンをクリックしてください。

ra-android-tips05_43

次に下記のような画面が表示されるので「Get Gemnymotion」ボタンをクリックしてください。

ra-android-tips05_39

下記の画面が表示されますので「Create account」をクリックしてください。

ra-android-tips05_40

次に下記のような画面が表示されるので下記に従って入力していき「Sign Up」ボタンをクリックしてください。

ra-android-tips05_41

次に下記のような画面が表示されるので「Get Genymotion」ボタンをクリックします。

ra-android-tips05_42

するともう一度下記の画面が表示されるので、同じように「Download」ボタンをクリックしてください。

ra-android-tips05_43

次に下記のような画面が表示されるので、「MacOS X 64bit」ボタンをクリックしてください。

ra-android-tips05_44

するとインストールが始まります。完了したらzipファイルをクリックして解凍してください。

ra-android-tips05_45

解凍したら下記のような画面が出てくるはずです。下記に従って「Genymotion」を「Applications」にドラック&ドロップしてください。

ra-android-tips05_46

Launchpadから「Genymotion」を起動すると、下記のような画面が表示されます。「開く」ボタンをクリックしてください。

※この画面は初回起動時にしか表示されません。
ra-android-tips05_47

次に下記の画面の「Yes」ボタンをクリックしてください。

ra-android-tips05_48

下記のような画面が表示されたら、「Connect」ボタンをクリックしてください。

ra-android-tips05_49

次に下記のような画面が表示されるので「Genymotion」に登録した「Username」と「Password」を入力し、「Connect」ボタンをクリックしてください。

ra-android-tips05_50

次に、このようなデバイスを選ぶ画面が表示されるので、下記のデバイスを選び「Next」ボタンをクリックしてください。

ra-android-tips05_52

続いて出てくる下記のような画面では、何も変更せず「Next」ボタンをクリックしてください。

ra-android-tips05_51

するとデバイスを構築しているので少々お待ちください。

ra-android-tips05_53

デバイスの構築が終わると下記のような画面が表示されるので、「Finish」ボタンをクリックしてください。

ra-android-tips05_54

そうすると、初期画面に戻るので作ったデバイスを選択して「Play」ボタンをクリックしてください。

ra-android-tips05_55

すると「Genymotion」が立ち上がり、下記のように表示されるので動かしてみて正常に作動したら画面を閉じてください。

ra-android-tips05_56

ここまでで「Genymotion」のインストールが完了しました。

次に「Android Studio」に「Genymotion」を取り込みます。

「Andriod Studio」を起動して先ほどのプロジェクトを立ち上げてください。 プロジェクトを立ち上げたら下記の画面に従って「Preferences…」をクリックしてください。

ra-android-tips05_57

次に下記の画面が表示されるので「Plugins」を選択し「Browse ~」ボタンをクリックしてください。

ra-android-tips05_58

次に下記の画面が表示されるので「geny~」と検索し「Genymotion」を選択し「Install plugin」ボタンをクリックしてください。

ra-android-tips05_59

下記の画面が表示されたら「Yes」ボタンをクリックしてください。

ra-android-tips05_60

インストールが完了しましたら一度「Android Studio」を消して再起動してください。

ra-android-tips05_61ra-android-tips05_62

再起動しましたら下記の画面に従ってプロジェクトを立ち上げてください。

ra-android-tips05_63

プロジェクトが立ち上がったら下記の画面にある「Genymotion」のアイコンがあるのでクリックしてください。

ra-android-tips05_64

次に下記の画面が表示されるので下記に従ってテキスト欄に入力して「OK」ボタンをクリックしてください。

ra-android-tips05_65

すると再び下記の画面が表示されるので、「Genymotion」のアイコンをクリックしてください。

ra-android-tips05_66

次に下記のような画面が表示されるのでデバイスを選択して「Start」ボタンをクリックしてください。

ra-android-tips05_67

すると「Genymotion」が立ち上がるので動作を確認して正常に動いたら下記の画面のように消してください。ra-android-tips05_68

「Genymotion」を「Android Studio」に取り込めました。これで環境構築は終了です。

次回からは、Android Studioを使ってはじめてのアプリを作っていきましょう。

>> 初心者向けアプリ開発3分tips:連載一覧

【講師プロフィール】
RainbowApps講師
高橋良輔(たかはしりょうすけ)

2000年からベンチャー企業のWebクリエイターとしてデザインやシステムの仕事で経験を積み、 2006年から独立、大手通信会社のシステム開発などを支援してきた。スマートフォンを利用したビジネスにも積極的に取り組んでいる。

【著者からひと言】 iOS、Android、Unityなどのアプリ開発を本格的に学びたい方は、ぜひRainbowAppsにお越し下さい。プログラミング初心者の方から経験者の方まで、レベルに合わせた対応が可能です。

■ 詳しくは公式HP:『RainbowApps


新着記事

編集部からのお知らせ

エンジニアに人気の求人

エンジニアtype姉妹サイト