Android 界面布局-LinearLayout
發布時間：2021-05-14 13:51:34
Android 界面布局-LinearLayout
爲了更好地管理Android應用的用戶界面裏的各組件，Android提供了布局管理器。通過使用布局管理器，Android應用圖形用戶界面具有良好的平台無關性。推薦使用布局管理器來管理組件的分布、大小，而不是(shì)直接設置組件的位置和大小。可以使用布局管理器嵌套布局管理器，即也可作爲一個UI組件來使用。
LinearLayout可以控制組件橫向排列或者縱向排列，内容不會換行，超出屏幕部分将不會顯示出來。
下面列出幾種之後可能會用到LinearLayout中的屬性，遺忘時查詢即可。
屬性名 | 意義 |
orientation | 布局方式，有horizontal(水平布局)和vertical(垂直布局)兩種方式 |
id | 組件名稱，方便之後調用 |
layout_width | 該組件的寬度 |
layout_height | 該組件的高度 |
layout_weight | 權重 |
layout_gravity | 該組件（在父容器）中的對齊方式 |
gravity | 該組件所含子組件在其内部的對齊方式 |
background | 設置背景圖片或填充顔色 |
orientation屬性有horizontal和vertical兩個參數供選擇，參數的值決定了布局方式。
①水平布局（horizontal）
代碼如下：
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:gravity="center"
android:text="第一個文本框"
android:background="#ffff00"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:gravity="center"
android:text="第二個文本框"
android:background="#ff0000"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:gravity="center"
android:text="第三個文本框"
android:background="#008000"/>
</LinearLayout>
②垂直布局（vertical）
代碼如下：
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="第一個文本框"
android:background="#ffff00"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="第二個文本框"
android:background="#ff0000"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="第三個文本框"
android:background="#008000"/>
</LinearLayout>
在這之前先簡要說明下match_parent，fill_parent和wrap_content。
match_parent和fill_parent在效果上相(xiàng)同，都是(shì)使該組件的寬度或高度填滿父元素，也就是(shì)說令其寬度或高度與父元素的寬度或高度一緻。
用wrap_content産生的效果由該組件本身的實際情況決定，例如一個TextView組件，它的寬度就是(shì)由文本實際的内容多少決定的。
回到正題，weight，這裏理解爲權重，或是(shì)比例，需要注意的是(shì)：
水平布局時，按比例分配父元素的寬度(width)
豎直布局時，按比例分配父元素的高度（height）
先看一個例子（以水平布局舉例）：
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:gravity="center"
android:text="第一個文本框"
android:layout_weight="1"
android:background="#ffff00"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:gravity="center"
android:text="第二個文本框"
android:layout_weight="1"
android:background="#ff0000"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:gravity="center"
android:text="第三個文本框"
android:layout_weight="1"
android:background="#008000"/>
</LinearLayout>
還是(shì)之前水平布局的例子，隻是(shì)我們給每個TextView添加了一句android:layout_weight="1"
貌似達到了我們的預期，三個TextView按1：1：1分完了總寬度。
但(dàn)有時候可能無法達到預期的效果，請看下面的例子，将三個TextView的android:layout_weight依次設置爲'1'，'2'，'3'：
可以看出三個文本框的大小不一緻了，但(dàn)是(shì)明顯沒有達到我們預期的1：2：3的效果。這是(shì)因爲我們設置的每個TextView的寬度爲wrap_content，每個組件都有本身由text内容決定的寬度，隻是(shì)将剩餘的在寬度上的空間按比例分好後再加在其本身的寬度上。
所以說，爲達到真正的比例效果：
水平布局時，将每個組件的寬度（width）設置爲0dp
豎直布局時，将每個組件的高度（height）設置爲0dp
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<TextView
android:layout_width="0dp"
android:layout_height="match_parent"
android:gravity="center"
android:text="第一個文本框"
android:layout_weight="1"
android:background="#ffff00"/>
<TextView
android:layout_width="0dp"
android:layout_height="match_parent"
android:gravity="center"
android:text="第二個文本框"
android:layout_weight="2"
android:background="#ff0000"/>
<TextView
android:layout_width="0dp"
android:layout_height="match_parent"
android:gravity="center"
android:text="第三個文本框"
android:layout_weight="3"
android:background="#008000"/>
</LinearLayout>
在現(xiàn)實開發中有時經常會動态創建布局，并且在布局中添加動态添加組建來達到展示目的。下面例子使用button來觸發單擊事件，然後在單擊事件中動态廠家一個水平的LinearLayout，并在此中添加文本組建和按鈕組件，最後添加到id爲linearTable的垂直LinearLayout中，點擊delete删除按鈕自動删除所在行。
頁面代碼如下：
<?xmlversion="1.0"encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayoutxmlns: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:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:layout_editor_absoluteX="1dp"
tools:layout_editor_absoluteY="1dp">
<Button
android:id="@+id/addRow"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="add"
android:textAllCaps="false" />
<ScrollView
android:layout_width="match_parent"
android:layout_height="180dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/linearTable"
android:orientation="vertical" >
</LinearLayout>
</ScrollView>
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
Java代碼如下：
packagecom.example.a05_list;
importandroidx.appcompat.app.AppCompatActivity;
importandroid.annotation.SuppressLint;
importandroid.content.Context;
import android.os.Bundle;
importandroid.view.View;
import android.widget.ArrayAdapter;
importandroid.widget.Button;
importandroid.widget.LinearLayout;
importandroid.widget.Spinner;
import android.widget.TextView;
importstatic com.example.a05_list.R.drawable.*;
import staticandroid.widget.LinearLayout.HORIZONTAL;
public classMainActivity extends AppCompatActivity {
privateButton m_AddRow = null;
private LinearLayout m_Table =null;
private Context m_this = null;
private intm_Count = 0;
@Override
protected voidonCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
m_AddRow =findViewById(R.id.addRow);
m_Table =findViewById(R.id.linearTable);
m_this = this;
m_AddRow.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
LinearLayout row = new LinearLayout(m_this);
row.setOrientation(HORIZONTAL);
TextView textID = new TextView(m_this);
textID.setText(Integer.toString(m_Count));
textID.setWidth(80);
m_Count++;
TextView text = new TextView(m_this);
text.setText("test");
text.setWidth(120);
Button buttonCmd = newButton(m_this);
buttonCmd.setText("delete");
buttonCmd.setOnClickListener(newView.OnClickListener() {
@Override
public void onClick(View v) {
LinearLayout tmp = (LinearLayout) v.getParent();
m_Table.removeView(tmp);
}
});
row.addView(textID);
row.addView(text);
row.addView(buttonCmd);
row.setBackgroundResource(under_line);
m_Table.addView(row);
}
});
}
}
- 上一篇：C++應該怎麽學
- 下一篇：基于OpenCV的條形碼檢測
