> For the complete documentation index, see [llms.txt](https://johch3n611u.gitbook.io/c50108/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://johch3n611u.gitbook.io/c50108/ju-li-cheng-bei/201904/20190408-an-zhuo-gong-zuo-shi-yuan-jian-bu-ju-ji-ben-end.md).

# 2019/0408/安卓工作室\_元件/布局基本end

## 安卓系統開發-視覺元件介紹

### constraintlayout 相對布局

#### 特色:會多一行xmlns:app函式庫

![](https://1902678905-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LVJQfuBXyvHwCd1Nadk%2F-Ld9jfyXTQwozWIW1S4M%2F-Ld9jh0BC5BBqsCU3gwV%2Fimage.png?alt=media\&token=e5a315e7-e9a9-42b3-9203-7edfeed38245)

![](https://1902678905-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LVJQfuBXyvHwCd1Nadk%2F-Ld9jfyXTQwozWIW1S4M%2F-Ld9kFzmcssLNZWohC5w%2Fimage.png?alt=media\&token=44360e9e-3bd6-4259-b8ed-c9d68ff2a61f)

![](https://1902678905-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LVJQfuBXyvHwCd1Nadk%2F-Ld9jfyXTQwozWIW1S4M%2F-Ld9o3VqPCvsW2JuODDA%2Fimage.png?alt=media\&token=37c97c8b-9213-4307-9ba1-df29cba938da)

![](https://lh5.googleusercontent.com/vd0N79VDWS13IXAd_c9hdbMlgOoUqOlkLz4b0r1Hwbp0pHxc5RdpZC5MFpC-1mG72lwxPIOYru_mJM-7UWK1fzsTAaHz9rKeULmj9hm7-ZVKFQ7-tsl4bvSmq8OZOcvGIHr_7bkm)

有很多種寫法，不管是利用物件相對位置，或是利用外距內距。

![](https://1902678905-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LVJQfuBXyvHwCd1Nadk%2F-Ld9jfyXTQwozWIW1S4M%2F-Ld9kp0tIQhJpgSOwMf2%2Fimage.png?alt=media\&token=51c62280-a4be-4169-b6be-31deaf7f5fda)

![](https://1902678905-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LVJQfuBXyvHwCd1Nadk%2F-Ld9jfyXTQwozWIW1S4M%2F-Ld9lc2SqF12ImoDk_sd%2Fimage.png?alt=media\&token=63b11034-ea61-489b-a819-dced468c411b)

start 左邊

end 右邊

(早期寫法)建議不要續用

物件與物件與容器之間相對位置

後面效果會蓋住先寫的

![](https://1902678905-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LVJQfuBXyvHwCd1Nadk%2F-Ld9jfyXTQwozWIW1S4M%2F-Ld9m0rieYpsPezB94sN%2Fimage.png?alt=media\&token=b34e0f8d-fce1-47a6-8ae5-695fe9d9eabd)

父子相對位置

![](https://1902678905-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LVJQfuBXyvHwCd1Nadk%2F-Ld9jfyXTQwozWIW1S4M%2F-Ld9mCyvEI2VI60l2GGV%2Fimage.png?alt=media\&token=6935fc23-ac36-49e4-9a2f-aee6fadc7440)

百分比位移(整個畫面相對位置)

![](https://1902678905-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LVJQfuBXyvHwCd1Nadk%2F-Ld9jfyXTQwozWIW1S4M%2F-Ld9mSXzvy3WldhQlJ8Q%2Fimage.png?alt=media\&token=84f3d39a-16d4-4af9-8186-2df54e2b186c)

參考線

![](https://1902678905-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LVJQfuBXyvHwCd1Nadk%2F-Ld9jfyXTQwozWIW1S4M%2F-Ld9ngnCHeQKCJplFgbK%2Fimage.png?alt=media\&token=c74109b0-0d6a-49b1-838e-615268c34c69)

![](https://1902678905-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LVJQfuBXyvHwCd1Nadk%2F-Ld9jfyXTQwozWIW1S4M%2F-Ld9nv-m7M6L86kJH7Xh%2Fimage.png?alt=media\&token=1060813b-7e5c-4ce3-9915-0320f33e0875)

要給確定座標begin

![](https://1902678905-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LVJQfuBXyvHwCd1Nadk%2F-Ld9jfyXTQwozWIW1S4M%2F-Ld9oK6eSPj3aPSV0v8F%2Fimage.png?alt=media\&token=12c66dc2-2824-4e14-b743-3ac16991b286)

![](https://1902678905-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LVJQfuBXyvHwCd1Nadk%2F-Ld9jfyXTQwozWIW1S4M%2F-Ld9oOLwxlO4jaqYaGQz%2Fimage.png?alt=media\&token=2ad7b937-e20a-4ca5-a425-624efb4150be)

從前面BEGIN 從後面END 畫面百分比 percent

![](https://lh3.googleusercontent.com/d8-KEUkxv55f_e-9FUrDdDhQ5qtoitzEzzWcEbYEliyaPWjBQwxSo8_Uw0t5QtLWialt4ynniwHmy02AweiYZSkZiSbhf0Rk5EK9FaPJfnAbYvljdgq2a_iad0PeH7G4qa7tRfXi)

ide 對齊字的底

### 元件大致上教完了

homework 明日上完課補上