【Android】設定 LinearLayout 的樣式

weixin_34162629發表於2019-01-08
Android

前言

 LinearLayout是最常用的控制元件之一，主要是用來進行排版佈局，本人介紹如何給LinearLayout 增加邊框樣式，在增加樣式之前的效果如下：

可以看得出來，每個LinearLayout幾乎都連線在一起，視覺效果較差，下面我們為此編寫一個樣式，如同CSS樣式表：

 

解決方法

 1.在res資料夾中新建一個 android 的 xml 檔案，命名為“linearlayout_boder”，程式碼如下：

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >

    <solid android:color="#FFFFFF" />

    <stroke
        android:width="0.1dp"
        android:color="#DDDDDD" />

    <padding
        android:bottom="1dp"
        android:left="0.5dp"
        android:right="0.5dp"
        android:top="0dp" />
</shape>

2.在需要用到此樣式的地方增加如下程式碼：

 android:background="@drawable/linearlayout_boder"

3.完整程式碼如下：

<?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" 
   >

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="28dp"
         android:background="@drawable/linearlayout_boder"
         >

        <TextView
            android:id="@+id/TextView04"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="9"
            android:text="   WLAN" />

        <ImageView
            android:id="@+id/ImageView04"
            android:layout_width="28dp"
            android:layout_height="match_parent"
            android:layout_weight="0.38"
            android:src="@drawable/onblack" />
    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="28dp" 
         android:background="@drawable/linearlayout_boder">

        <TextView
            android:id="@+id/TextView03"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="9"
            android:text="   藍芽" />

        <ImageView
            android:id="@+id/ImageView03"
            android:layout_width="28dp"
            android:layout_height="match_parent"
            android:layout_weight="0.38"
            android:src="@drawable/onblack" />
    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="28dp" 
         android:background="@drawable/linearlayout_boder">

        <TextView
            android:id="@+id/TextView02"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="9"
            android:text="   省電模式" />

        <ImageView
            android:id="@+id/ImageView02"
            android:layout_width="28dp"
            android:layout_height="match_parent"
            android:layout_weight="0.38"
            android:src="@drawable/onblack" />
    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="28dp" 
         android:background="@drawable/linearlayout_boder">

        <TextView
            android:id="@+id/textView1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="9"
            android:text="   重力感應" />

        <ImageView
            android:id="@+id/imageView1"
            android:layout_width="28dp"
            android:layout_height="match_parent"
            android:layout_weight="0.38"
            android:src="@drawable/onblack" />

    </LinearLayout>

</LinearLayout>

 

最終效果

 

相關文章