# 2020 mp 讀書會 Android APP 程式開發開發剖析第二版
<style>
.card {
box-sizing:border-box;
display:grid;
grid-template-columns: repeat(auto-fit, calc(100%/3 - 14px));
grid-gap:20px;
margin-bottom:20px;
}
.grid-item {
/* border:1px solid red; */
padding:12px
}
</style>

<div class="card">
<a href="#20200520" class="grid-item">0520 <br/>第一章 認識 Android</a>
<a href="#20200610" class="grid-item">0610 <br/>第三章 第一個 Android 應用程式</a>
</div>

## [1st] 20200520 認識 Android 歷史


作者 張益裕
出版日期 201603
github: https://github.com/macdidi5/AndroidTutorial


---
<!-- [TOC] -->

## 01 認識 Android

### 1-1 Hello Android

#### History 歷史沿革

2003年 美國加州成立一間叫做 Android 的公司，由 Andy Rubin 與其他同仁共同研發一種 "聰明的移動設備"

2005年 Google 收購了 Android 公司，但大家都猜不到 Google 為什麼要收購。

2007年 Google 送出多項移動設備領域的專利申請。那一年的一月，也出現了 iphone 的行動裝置。

2007年11月 Google 領導下開放手持設備聯盟，成員有 Broadcom、HTC、Intel、ARM、Sony，Android 確定以 Linux 為核心基礎。同時 Google 成立 [Android Open Source Project](https://source.android.com/)。這個網站有很多 Android 基本觀念與應用

#### Android 版本與代號


2008年 Android 1.0 ALPHA
2009年開始用甜點命名

| years | Version | Release Name |
|:----- |:----------- |:------------------------------- |
| 2009 | Android 1.5 | CupCake 杯子蛋糕 |
| 2009 | Android 1.6 | Donut 甜甜圈 |
| 2009 | Android 2.0 | Eclair 閃電泡芙 |
| 2010 | Android 2.2 | Froyo 優格冰淇淋 |
| 2010 | Android 2.3 | Gingerbread 薑餅人 |
| 2011 | Android 3.0 | Honeycomb 蜂窩 |
| 2011 | Android 4.0 | Ice Cream Sandwich 冰淇淋三明治 |
| 2012 | Android 4.1 | Jelly Bean 豆豆軟糖 |
| 2013 | Android 4.4 | KitKat 巧克力糖 |
| 2014 | Android 5 | Lollipop 棒棒糖 |
| 2015 | Android 6 | Marshmallow 棉花糖 |
| 2016 | Android 7 | Nougat |
| 2017 | Android 8 | Oreo |
| 2018 | Android 9 | Pie |
| 2019 | Android 10 | Q QQ~想不到名字 |
| 2020 | Android 11 | R RRR~命名崩潰 |

看完之後，想想 Android 幾年後會結束 ??

2020年06 [android 11 R](https://developer.android.com/android11)
Android 11開發者預覽1帶來的新功能包括對可摺疊智慧型手機、5G、Project Mainline（通過Google Play商店為系統組件提供更新）和HEIF的支援。

2021 S
..
2028 Z

沒有錯，大膽預測 2029年 Android 就沒了 :+1:

### 1-2 Android 平台介紹

Android 作業系統採用 Linux 核心，他負責處理跟硬體的相關工作。
Android 應用程式的開發使用 Java 程式語言，你只要使用 Android 提供的 API 就可以控制裝置的硬體設備。
Android 作業系統的 Dalvik 虛擬機器運作，他和一般 Java 的 Java 虛擬機器是不一樣的技術。


圖為 Android 作業系統的基本架構。 ps 由下往上看
- Linux 核心: Android 使用開放的作業系統 Linux 核心，就跟一般個人電腦的作業系統一樣，他負責管理裝置的各種硬體設備、行程、記憶體、網路、電源控制。
- Libraries: 使用 C++ 開發的程式庫，直接在 Linux 核心中執行，用來執行繪圖和多媒體錄製與播放、資料庫存取和其他應用。
- Dalvik VM: 使用 Java 技術開發。包含基本的程式庫，經過調整，非常適合行動裝置環境中運作的虛擬機器。
- Application Framework: Android 基本架構與規則。
- Applications: Android 內建和開發人員設計的應用程式。

### 1-3 Android 開發環境介紹

- [Android APIs](https://developer.android.com/samples)
- Android 模擬裝置 (Android Virtual Device) 簡稱 AVD
- 開發工具
Android 發表後，開發人員採用 Eclipse 做為開發工具，搭配 Eclipse 設計的 Android Development Tools (ADT)，日新月異後，Eclipse 改為 IntelliJ IDEA 整合所有套件，在 2014年12月 發表 Android Studio v1.0

老師說要有圖才不會無聊~ 順便學英文 eclipse 中文意思是日蝕


### 1-4 Android 測試環境介紹
測試很重要~ !!!

Android 提供模擬裝置管理員，你可以建立不同版本的模擬裝置，他們和實際裝置非常類似。
Android 模擬裝置可以滿足大部分應用程式測試的需求，例如透過 Android Device Monitor 工具，可以傳送模擬的 GPS 座標給模擬裝置，用來測試與地點、位置相關的應用程式。不過模擬裝置還是有限制:

-- **無法撥打或實際接收電話**
-- **不支援 USB 功能**
-- **不支援耳機連接**
-- **無法確認網路連線狀態**
-- **不支援電池充電的情況**
-- **無法確認記憶卡的插入與拔除**
-- **不支援藍芽**

Android Debug Bridge [adb](https://developer.android.com/studio/command-line/adb) is a versatile command-line tool

- Connect to a device over Wi-Fi

cd Users\Richard.Liao\AppData\Local\Android\Sdk\platform-tools
adb tcpip 5555
adb devices
adb connect device_ip_address
adb kill-server

2. Set the target device to listen for a TCP/IP connection on port 5555.

You can use adb to install an APK on an emulator

adb install path_to_apk

### 1-5 Android 應用程式介紹

Google Plays 商店

作者提供的監控系統開源程式碼
https://github.com/macdidi5/PiCommander

:::warning
20200520 到這裡結束
:::


## 02 建立 Android 開發環境
### 2-1 建立開發環境 Windows
### 2-2 建立開發環境 MacOS
### 2-3 Android Studio 基本設定
### 2-4 安裝其他套件與 Intel HAXM

---

## [2nd] 20200610 建立一個 Hello World 應用程式

## 03 Android 平台與模擬裝置

### 3-1 第一個 Android 應用程式

### 3-1-1 建立環境




#### Name(Application Name)
應用程式名稱
#### Package name 自動生成
Google Play 上面不允許有相同的 Package Name
應用程式主要套件名稱 (根據 Application Name + Company Domain)
Company Domain(前後顛倒) + Application Name(小寫)

舉例:
Application Name = Hello World
Company Domain = example.net
Package name = net.example.helloworld

#### Language
可以選擇 Kotlin、Java

### 進入專案

### 3-1-2 模擬器執行程式 AVD

建立 AVD: Tools > AVD


執行程式 RUN


AVD 設定檔路徑
C:\Users\Richard.Liao\.android\avd\Nexus_6_API_22.avd\config.ini

### 3-1-2 實體裝置執行程式
<span style="color:red">需要開啟 USB 偵錯模式</span>


連線後，選擇自己的手機，在按播放 ICON 執行

### 3-2 Android Project Structure 專案結構

Android 專案結構說明
https://developer.android.com/studio/projects?hl=zh-cn

Android 實體裝置統計資料
https://developer.android.com/about/dashboards/index.html


**File > Project Structure**


**minSdk 修改為 API Level 的版本即可**


**或是設定 Gradle Scripts > build.gradle (Module APP)**

#### 設定完成後，需要跑 Sync Project

File > Sync Project with Gradle Files

#### RN 內設定 minSdk

android/app/build.gradle

android {
    defaultConfig {
        minSdkVersion rootProject.ext.minSdkVersion
    }
}

### 3-3 Android 模擬裝置設定
Tools > AVD Manager

運行效能佳: Nexus 6P + Lollipop


Create Virtual Device 選擇 Nexus 6P


選擇 Lollipop



底下我們使用原子描述(細微解釋帶來巨大理解)

AVD Name 模擬器名稱
AVD ID 模擬器 ID
使用的裝置
使用的 Android 版本
Startup orientation 裝置的方向

Camera 相機設定
None 不支援
Emulated 模擬相機畫面
Webcam0 使用電腦安裝的 Webcam

NetWord 網路設定
Speed 網路連線速度
Latency 經由網路傳送資料的延遲類型

AVD 設定檔路徑
C:\Users\Richard.Liao\.android\avd\Nexus_6_API_22.avd\config.ini

AVD 設定檔路徑 [MAC]
~/.android/avd/name.avd/

AvdId=Nexus_6_API_22
PlayStore.enabled=true
abi.type=x86
avd.ini.displayname=Nexus 6 API 22
avd.ini.encoding=UTF-8
disk.dataPartition.size=5000M
fastboot.chosenSnapshotFile=
fastboot.forceChosenSnapshotBoot=no
fastboot.forceColdBoot=no
fastboot.forceFastBoot=yes
hw.accelerometer=yes
hw.arc=false
hw.audioInput=yes
hw.battery=yes
hw.camera.back=virtualscene
hw.camera.front=emulated
hw.cpu.arch=x86
hw.cpu.ncore=2
hw.dPad=no
hw.device.hash2=MD5:55acbc835978f326788ed66a5cd4c9a7
hw.device.manufacturer=Google
hw.device.name=pixel_2
hw.gps=yes
hw.gpu.enabled=yes
hw.gpu.mode=host
hw.initialOrientation=Portrait
hw.keyboard=yes
hw.lcd.density=420
hw.lcd.height=1920
hw.lcd.width=1080
hw.mainKeys=no
hw.ramSize=1536
hw.sdCard=yes
hw.sensors.orientation=yes
hw.sensors.proximity=yes
hw.trackBall=no
image.sysdir.1=system-images/android-22/google_apis/x86/
runtime.network.latency=none
runtime.network.speed=full
sdcard.path=/Users/liaopochang/.android/avd/Nexus_6_API_22.avd/sdcard.img
sdcard.size=512 MB
showDeviceFrame=yes
skin.dynamic=yes
skin.name=pixel_2
skin.path=/Users/liaopochang/Library/Android/sdk/skins/pixel_2
tag.display=Google APIs
tag.id=google_apis
vm.heapSize=256

沒寫

設定記憶體

裝置的外表，可以改變模擬器的 apperance

### 3-4 管理 Android 開發工具與平台製作
Tools > SDK Manager

---

## [3rd] 20200730 排版、元件

## 04 設計 Android 應用程式
### 4-1 Android 應用程式與基本元件 MainActivity.java

[Activity 生命週期](https://www.runoob.com/android/android-acitivities.html)

// android/app/src/main/MainActivity.java

// 宣告這MainActivity的package套件名稱為「package com.youbiketaiwan」
package com.youbiketaiwan; 

// 匯入需要的 android api
import com.facebook.react.ReactActivity;
import com.facebook.react.ReactActivityDelegate;
import com.facebook.react.ReactRootView;
import com.swmansion.gesturehandler.react.RNGestureHandlerEnabledRootView;


// 繼承 activity ReactActivity
public class MainActivity extends ReactActivity {

  /**
   * Returns the name of the main component registered from JavaScript. This is used to schedule
   * rendering of the component.
   */
   
   // 依照 Android 架構的規則，覆蓋父類別的方法
  @Override
  protected String getMainComponentName() {
    return "YouBikeTaiwan";
  }
  @Override
  protected ReactActivityDelegate createReactActivityDelegate() {
    return new ReactActivityDelegate(this, getMainComponentName()) {
      @Override
      protected ReactRootView createRootView() {
        return new RNGestureHandlerEnabledRootView(MainActivity.this);
      }
    };
  }
}

### 4-2 Android 的應用程式與架構
https://developer.android.com/studio/projects

**Java 原始程式碼與XML檔案，必須放在規定的位置才能執行應用程式。**

#### 4-2-1 main 資料夾


+ main > java: 原始程式碼的目錄，包含應用程式的套件
○ MainActivity.java 元件
○ MainApplication.java 應用程式
+ main > res: 資源目錄
○ drawable: 圖片設定檔
○ layout: layout
○ menu: 選單目錄
○ mipmap: 應用程式圖示資源目錄(預設 ic_launcher.png)、不同尺寸的螢幕需要提供不同的圖片mipmap > hdpi、mdpi、xhdpi、xxhdpi [線上製作](https://makeappicon.com/)
+ values: 其他資源目錄
○ dimens.xml: 尺寸資源。設定文字、按鈕大小
○ strings.xml: 文字資源檔。提供應用程式需要的文字
○ styles.xml: 樣式資源檔。設定顏色

#### 4-2-1 AndroidManifest.xml 應用程式設定檔


所有設定必須放在

<manifest xmlns=".." package="套件名稱">
<!--應用程式需要的操做設備 -->
    <users-configuration />
<!--應用程式需要的螢幕設備 -->
    <supports-screens />
    <application>
        ...
    </application>

</manifest>

### 4-3 撰寫程式碼與設定檔


1. 新增檔案 res > layout > activity_main.xml (Native Android)
這我們我使用 react native 建立，所以用 launch_screen.xml 來示範 splash 畫面

使用套件 - [react-native-splash-screen](https://github.com/crazycodeboy/react-native-splash-screen)

launch_screen.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent">
    <ImageView android:layout_width="match_parent" android:layout_height="match_parent" android:src="@drawable/launch_screen" android:scaleType="centerCrop" />
</RelativeLayout>

<Button
    android:layout_width="wrap_content" //
    android:layout_height="wrap_content"
    android:text="按鈕"

/>

## 04~06 排版與元件設計

https://stackoverflow.com/questions/16780294/how-to-print-to-the-console-in-android-studio

### Code Format


### 排版

***LinearLayout [官網](https://developer.android.com/guide/topics/ui/layout/linear)***

`layout_weight` 比例 需要將 `layout_width="0dp"` or `layout_height="0dp"`
`layout_width` 寬
`layout_height` 高

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:paddingLeft="16dp"
    android:paddingRight="16dp">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:gravity="center">

        <ImageView
            android:id="@+id/img1"
            android:layout_width="80dp"
            android:layout_height="80dp"
            android:layout_centerHorizontal="true"
            android:layout_centerVertical="true"
            android:layout_marginBottom="1dp"
            android:src="@drawable/apple" />

    </LinearLayout>

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_marginBottom="20dp"
        android:text="\@ copyright 2020" />
    
</LinearLayout>

***RelativeLayout [官網](https://developer.android.com/guide/topics/ui/layout/relative)***
`layout_alignParentTop`
`layout_alignParentLeft`
`layout_alignParentRight`
`layout_alignParentBottom`
`layout_centerInParent`
`layout_centerVertical`

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#fff"
    android:paddingLeft="16dp"
    android:paddingRight="16dp">

    <ImageView
        android:id="@+id/img1"
        android:src="@drawable/apple"
        android:layout_width="80dp"
        android:layout_height="80dp"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:layout_marginBottom="1dp"
        />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_below="@+id/img1"
        android:text="apple" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_alignParentBottom="true"
        android:layout_marginBottom="20dp"
        android:text="\@ copyright 2020" />


</RelativeLayout>

### 樣式設定

***設定寬度、高度***

`layout_width: wrap_content | match_content`
`layout_height: wrap_content | match_content`

- wrap_content: 內容寬度
- match_content: 螢幕寬度

***單位***

px: 螢幕畫素
dp: 每英吋畫面，160dp 為一英吋
sp: 和 dp 一樣，不過會根據裝置設定的字型大小自動調整 <=() 建議使用
in: 英吋
mm: 公厘

***顏色***
不能使用 rgba(0,0,0,.2)
#RGB #333
#RRGGBB #7CEECE
#ARGB #0333 第一碼設定透明度，(0-9 A-F) 0最透、F最深

***內距、外距***

android:padding="20dp"
android:paddingTop="20dp"
android:paddingBottom="20dp"
android:paddingLeft="20dp"
android:paddingRight="20dp"

android:layout_margin="20dp"
android:layout_marginTop="20dp"
android:layout_marginBottom="20dp"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"

***對齊***

android:gravity="bottom" 對齊下面
android:gravity="bottom|right" 右下角 可以傳兩個參數

- top、bottom、left、right 上下左右
- center_vertical、center_horizontal 水平、垂直居中
- center: 水平垂直置中
- fill: 內容填滿空間
- fill_vertical、fill_horizontal 內容填滿空間

***文字***

<TextView
    android:id="@+id/textView"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Welcome"
    android:textAppearance="?android:attr/textAppearanceLarge"
    />

android:text 文字
android:textSize 文字大小
android:textColor 顏色
android:background 背景顏色
android:textAppearance: 使用預設文字大小 textAppearanceLarge | textAppearanceMedium | textAppearanceSmall

### 元件

`TextView` 文字元件
`EditText` 輸入元件
`Button` 按鈕元件
`CheckBox` 多選元件
`RadioGroup、RadioButton` 單選元件
`ImageView` 圖片

文字元件 TextView

<TextView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center_vertical"
    android:autoLink="all"
    android:padding="20sp"
    android:text="
    Home page: https://google.com.tw \n\n
    Email: [e-mail] \n\n
    Phone: [phone] \n\n
    Adress: 1600 Ampitheatre Parkway, Mountain View, CA 94043"
    />   

autoLink="all" 文字自動加入連結功能

none: 不執行任何動作
web: 網址加底線，開啟網頁
email: 開啟內建郵件
phone: 開啟內建的電話
map: 開啟內建地圖
all: 自動處理

文字元件 EditView

<EditText
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:inputType="textEmailAddress"
    />

ImageView

<ImageView
    android:id="@+id/imageView1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:maxWidth="100dp"
    android:maxHeight="100dp"
    android:src="@drawable/skype" />