ConstraintLayout 約束佈局:探討 Margin 邊距屬性如何使用

更新於 發佈於 閱讀時間約 6 分鐘
【Android 入門指南】系列文章目錄:https://bit.ly/3TFgCzu
Android 線上課程教學影片:https://bit.ly/433Offj

課程摘要

本課程學習如何使用 ConstraintLayout 約束佈局中的 Margin 邊距屬性。

教學影片

若您無法順利觀看教學影片,請先登入您的 YouTube 帳號,然後點擊以下連結加入我們的頻道會員:

  • 一般會員:成為一般會員後,您將能夠觀看我們所提供的一般會員專屬線上課程。
  • 精實會員:成為精實會員後,您將能夠觀看我們所提供的精實會員專屬線上課程。

程式碼範例

範例名稱:ConstraintLayout 約束佈局:探討 Margin 邊距屬性如何使用
作者:HKT (侯光燦)
授權範圍:使用時必須註明出處且不得為商業目的之使用
範例下載點:點我下載


activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/linearLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">

<Button
android:id="@+id/btn_x"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="X"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"/>

<Button
android:id="@+id/btn_a"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="A"
app:layout_constraintBottom_toTopOf="@+id/btn_x"
app:layout_constraintStart_toStartOf="@+id/btn_x" />

<Button
android:id="@+id/btn_b"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="B"
app:layout_constraintStart_toEndOf="@+id/btn_x"
app:layout_constraintTop_toTopOf="@+id/btn_x" />

<Button
android:id="@+id/btn_c"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="C"
app:layout_constraintStart_toStartOf="@+id/btn_x"
app:layout_constraintTop_toBottomOf="@+id/btn_x" />

<Button
android:id="@+id/btn_d"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="D"
app:layout_constraintEnd_toStartOf="@+id/btn_x"
app:layout_constraintTop_toTopOf="@+id/btn_x" />

</androidx.constraintlayout.widget.ConstraintLayout>
avatar-img
13會員
251內容數
哈囉!歡迎光臨我的沙龍!我是 KT,一位對應用程式開發充滿熱情的開發者。在這個專屬空間,我將與您分享我在應用開發領域的深入學習心得和豐富的實戰經驗。如果您對應用程式開發技術同樣充滿好奇,渴望不斷探索新知,歡迎成為我們的會員,一起在應用程式開發的旅途上,探索更深層次的技術世界,享受學習的樂趣。
留言0
查看全部
avatar-img
發表第一個留言支持創作者!
HKT實驗室 的其他內容
本課程學習如何轉換 ConstraintLayout 提升效能優化佈局指南。
本課程學習 ConstraintLayout 約束佈局實戰練習。
本課程學習如何使用 ConstraintLayout 約束佈局基本技巧。
本課程瞭解為什麼要使用 ConstraintLayout 約束佈局。
本課程目標是讓你深入瞭解 Android Activity 的生命週期。
本課程學習如何使用 Android Studio 的 Logcat 日誌功能。
本課程學習如何轉換 ConstraintLayout 提升效能優化佈局指南。
本課程學習 ConstraintLayout 約束佈局實戰練習。
本課程學習如何使用 ConstraintLayout 約束佈局基本技巧。
本課程瞭解為什麼要使用 ConstraintLayout 約束佈局。
本課程目標是讓你深入瞭解 Android Activity 的生命週期。
本課程學習如何使用 Android Studio 的 Logcat 日誌功能。
你可能也想看
Google News 追蹤
Thumbnail
現代社會跟以前不同了,人人都有一支手機,只要打開就可以獲得各種資訊。過去想要辦卡或是開戶就要跑一趟銀行,然而如今科技快速發展之下,金融App無聲無息地進到你生活中。但同樣的,每一家銀行都有自己的App時,我們又該如何選擇呢?(本文係由國泰世華銀行邀約) 今天我會用不同角度帶大家看這款國泰世華CUB
Thumbnail
嘿,大家新年快樂~ 新年大家都在做什麼呢? 跨年夜的我趕工製作某個外包設計案,在工作告一段落時趕上倒數。 然後和兩個小孩過了一個忙亂的元旦。在深夜時刻,看到朋友傳來的解籤網站,興致勃勃熬夜體驗了一下,覺得非常好玩,或許有人玩過了,但還是想寫上來分享紀錄一下~
Thumbnail
CSS入門-Day3 的主要內容包括字體大小、字體顏色、字體系列、字體樣式、字體粗細等屬性。此外,還涵蓋了文本對齊、行高、文字間距、單詞間距和文本裝飾。最後,介紹了如何引入和使用 Google 字體,以提高網頁的排版效果。
本課程學習如何使用 ConstraintLayout 約束佈局中的 Circular positioning 圓形定位。
本課程學習如何使用 ConstraintLayout 約束佈局中的 Guideline 導覽線。
本課程學習如何使用 ConstraintLayout 約束佈局中的 Bias 偏移屬性。
本課程學習如何使用 ConstraintLayout 約束佈局中的 Chains 鏈結屬性。
Thumbnail
現代社會跟以前不同了,人人都有一支手機,只要打開就可以獲得各種資訊。過去想要辦卡或是開戶就要跑一趟銀行,然而如今科技快速發展之下,金融App無聲無息地進到你生活中。但同樣的,每一家銀行都有自己的App時,我們又該如何選擇呢?(本文係由國泰世華銀行邀約) 今天我會用不同角度帶大家看這款國泰世華CUB
Thumbnail
嘿,大家新年快樂~ 新年大家都在做什麼呢? 跨年夜的我趕工製作某個外包設計案,在工作告一段落時趕上倒數。 然後和兩個小孩過了一個忙亂的元旦。在深夜時刻,看到朋友傳來的解籤網站,興致勃勃熬夜體驗了一下,覺得非常好玩,或許有人玩過了,但還是想寫上來分享紀錄一下~
Thumbnail
CSS入門-Day3 的主要內容包括字體大小、字體顏色、字體系列、字體樣式、字體粗細等屬性。此外,還涵蓋了文本對齊、行高、文字間距、單詞間距和文本裝飾。最後,介紹了如何引入和使用 Google 字體,以提高網頁的排版效果。
本課程學習如何使用 ConstraintLayout 約束佈局中的 Circular positioning 圓形定位。
本課程學習如何使用 ConstraintLayout 約束佈局中的 Guideline 導覽線。
本課程學習如何使用 ConstraintLayout 約束佈局中的 Bias 偏移屬性。
本課程學習如何使用 ConstraintLayout 約束佈局中的 Chains 鏈結屬性。