0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

Webアプリ開発環境作ってみた(5) - React Native(5)

Posted at

前回ようやくAndroid Studioの環境設定ができた。今回は仮想デバイスの作成について記載する。

先に進めない

書籍では、仮想デバイスの作成は以下の手順で行うとなっている。

  1. ToolメニューからAVD Managerを開く
  2. 「Create Virtual Device」を押す

しかし、再びメニューが違っており、AVD Managerはない。Toolメニューを見ると、「Device Manager」というのがある。仮想デバイスだしこれかな、と。そしたらIDE右上にDevice Managerが表示され、「Create Virtual Device」と見えた。

47.png


迷わずクリック。書籍に記載のとおり、Select Hardware(Choose a device definition)ウィンドウが開く。対象デバイスも書籍のとおりにPhone - Pixel 2を選択し「Next」。

48.png


続いてSystem Image(Select a system image)ウィンドウが。書籍ではx86 ImageタブからTargetがAndroid 9.0 (Google APIs)と記載されているものを選択し、「Next」を押すとなっている。しかし。どのタブのどの候補を選択しても、「Next」が使用可能にならない。またなんか赤い!がまたついている。

49.png


メッセージを見ると、「A system image must be selected to continue.」って書いてある。でもそもそも一覧のどれをクリックしても反応していない様子。Select a system imageって表示がある一覧なのに選択できなくて、次に行くにはシステムイメージ選択してねってどういうこと?猛烈に混乱。本をひっくり返してみても、こんな事象は書いてない。どうしたらいい?

システムイメージインストールしてなかった

解決策を見いだせないまま、しばらくあちこちを見てみる。そのうちに少し落ち着いてきたのか、よく見ると一覧のRelease Nameの各名称の横に下向きの矢印が。なんか触れそうな感じ。これをクリックするとなんか変わるのか?とやってみることに。

50.png

そしたらLicense Argeementが表示される。なんかまだダウンロードされるものがあるのか?とりあえず「Accept」を選択しダウンロードしてみることに。

51.png
52.png


インストール対象は Google Play Intel x86_64 Atom System Image となっている。システムイメージ。なんかこの名前を見たことがあるような。。。ようやく思い出した。書籍で必要なツールとして挙げられていたものの一つが以下のものだった。

  • Google APIs Intel x86 Atome_64 System Image

ちょっと誤植があるようだけど、API33, 34が両方インストールされたことで、その違いを確認している間に肝腎なものを忘れてしまっていた。まあシステムイメージそのものがなんだかよくわかっていないせいもあるかもしれないけど。気がついてしまえばなんてことない話だったが、手探りしている間はどこが間違っているのかそれ自体がわからないので、ほんとにむずかしい。

サイズが1.4Gと大きいので、しばらく待ってインストール完了。

53.png


System Imageウィンドウに戻り、対象のシステムイメージを選択すると無事「Next」が使用可能になった。クリック。

54.png


Android Virtual Device(AVD)(Verify Configuration)ウィンドウが表示される。既定の内容のまま「Finish」。

55.png


仮想デバイスの生成が開始され、Device Managerに1件表示された。

56.png
57.png


一覧のActionsに配置されている三角の開始マークをクリックしてみる。
58.png


そしたらRunning Devicesにスマホイメージが出てきた!ちょっと感動。
59.png


でも、しばらくするとエラーメッセージが。
60.png


うーん。うまく動いていないのかな。黒塗り四角の停止マークをクリックしても、表示はそのまま残っていたりして。あとは実際に動かしてみて確認するしかないかなと、仮想デバイスについてはいったんここで終了することに。

ここまでくるともう少しかな。いよいよReact Nativeそのものをセットアップしアプリケーション作成に向かうことに。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?