Androidアプリ開発 - プロジェクト構成のメモ

# 概要
数年前の新卒時代に書いていた下書き記事があったので供養です。
ここしばらくAndroid触っていなかったので、思い出すにはちょうどいいかも。

# Androidアプリの開発
Androidアプリ開発の備忘録を書いていく．

# 環境
Android Studio 3.5（2019 年 8 月）
OS : Windows10

# Android アプリ開発の概要
処理をJAVAクラスに，画面構成をXMLに記述する．
JAVAクラスをアクティビティ（Activity），xmlファイルをレイアウトファイルと呼ぶ．


# プロジェクトの準備
空のアクティビティーで作成する．
![イメージ872.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/245300/cecdc1ae-6059-0917-af70-1c056dbe29bc.jpeg)

# プロジェクトの構成
プロジェクトを作成して，Run Buildが完了したら，以下のような構成になる．
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/245300/0d09d330-8b6f-cc11-08a6-166431970d63.png)

中身はこんな感じ．赤く丸をつけているところが今回触るところ．
![Qiita用-Android Studio 触るファイル.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/245300/3f70781a-b931-544f-4455-0d424b649cb6.png)


## 各ファイル構成
### manifestsフォルダ
**AndroidManifest.xml** ファイルが格納されている．
アプリの実行に必要な設定を記載する．
詳しくは[アプリ マニフェストの概要](https://developer.android.com/guide/topics/manifest/manifest-intro?hl=ja#perms)を参照．

#### 例えばどんなときに使う？
例）WebViewを使うときに，ネットワークへアクセス許可を出すときとか．
[ネットワークに接続する](https://developer.android.com/training/basics/network-ops/connecting)

```AndroidManifest.xml
<uses-permission android:name="android.permission.INTERNET" />
```


### javaフォルダ
処理を行うためのファイルが格納される．
最初は**MainActivity**が格納されている．
このファイルにボタンクリック時などの処理を書いていく．

### resフォルダ
画面構成を記述するためのファイルが格納される．

- res/layout
    - **activity_main.xml**は，画面構成のためのxmlファイル．

- res/values
    - strings.xmlは，アプリ画面の文字列を格納しておくファイル．
    ここに書いておけば，多言語に対応させたい場合に自動的に言語を切り替えてくれるらしい．
    - activity_main.xmlに文字列を直書きしているとAndroid studio先生に怒られるので，できる限りこっちに書くようにする．

# 画面レイアウト作成
res/layout/activity_main.xmlを選択する．
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/245300/e63a77cb-66e2-dd23-ce7a-acf048ef0f3d.png)

左下に「デザイン」「テキスト」とあり，現在はデザインを選択している状態．
画面レイアウトを確認すると，画面中央に"Hello World"と書かれている．
今はいらないのでdeleteで消しておく．
 
## ボタン追加
画面遷移用のボタンを設置する．
パレットからButtonを画面レイアウトにドラッグすると，ボタンを追加できる．
しかし，コンポーネント・ツリーを見ると，!マークで警告が出ている．
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/245300/f771b2a0-e45a-d8a1-42a2-8af1a27586f6.png)

### とりあえず動かしてみる
これだけでもアプリは起動できるので，とりあえずどんな感じなのか動かして確認してみる．
ボタンを中央に配置したつもりが，画面左上に配置されている．．．
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/245300/4879f054-0dd4-fd14-1e4d-f28548b97475.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/245300/e77a7b69-64b6-46bb-0044-e462644bc642.png)

制約の警告メッセージを見てみる．
```This view is not constrained. It only has designtime positions, so it will jump to (0,0) at runtime unless you add the constraints  The layout editor allows you to place widgets anywhere on the canvas, and it records the current position with designtime attributes (such as layout_editor_absoluteX). These attributes are not applied at runtime, so if you push your layout on a device, the widgets may appear in a different location than shown in the editor. To fix this, make sure a widget has both horizontal and vertical constraints by dragging from the edge connections.  Issue id: MissingConstraints```

Google翻訳
```このビューには制約がありません。 設計時の位置しかないため、制約を追加しない限り、実行時に（0,0）にジャンプします 。 これらの属性は実行時に適用されないため、デバイスにレイアウトをプッシュすると、ウィジェットはエディターに表示される場所とは異なる場所に表示される場合があります。 これを修正するには、エッジ接続からドラッグして、ウィジェットに水平および垂直の両方の制約があることを確認します。```

制約を追加しないと強制的に(0,0)に飛ばされるみたい．
解像度が違っても同じようにレイアウトを配置するための制約なのだろうか？
公式ドキュメント：[ConstraintLayout](https://developer.android.com/reference/android/support/constraint/ConstraintLayout)

### 結局どうする
```
Not horizontally constrained.
Not vertically constrained.
```


「水平方向に制約されていません。垂直方向に制約されていません。」
警告文に従い，水平方向と垂直方向の制約を追加してみる．

1. 属性をいじる方法
![Android開発-ボタン制約.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/245300/da819c2d-38fe-4cdd-edcf-4160e29cdd99.gif)

2. レイアウトをポチポチする方法
![Android開発-ボタン制約2.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/245300/82fa0b3e-070b-546b-f6c1-892edffe5eec.gif)

ちゃんと画面中央にボタンが配置された．
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/245300/7f831c2a-58f5-188f-8018-06549b9ed5f3.png)


### `@string resource`
まだ警告メッセージがあったので確認．
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/245300/c57f2bf3-3f74-b863-af8d-62e5129cb34d.png)

xmlに直接文字列を書き込んでいるのが問題っぽい．
`android:text="Button"`って書いてるところが問題．

```activity_main.xmlのテキスト
    <Button
        android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />
```

### strings.xmlに文字列を格納してそれを呼び出す

1. values/string.xmlを開く
2. エディターで開くを押下，その後"＋"ボタンを押下し，keyと値（文字列）を入力する．
3. activity_main.xmlのButtonのテキストに，2.で追加したkeyと値があるので，選択する．
4. 警告メッセージが消える


![Android開発-stringXml.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/245300/050f4e5a-ee7b-8f7f-7a8c-e6933e9fdea3.gif)

```activity_main.xmlはどうなった
android:text="Button"　←これが
android:text="@string/next"　←こうなった
```

# 終わりに
- .gifで動画残しておくと操作分かりやすくて良いと思いました。過去の自分頑張ってた。
- 最新のAndroid Studio環境でJetpackComposeやりたい。