Làm cách nào để tạo đường viền xung quanh Android LinearLayout?


Câu trả lời:


241

Chắc chắn rồi. Bạn có thể thêm đường viền vào bất kỳ bố cục nào bạn muốn. Về cơ bản, bạn cần tạo một bản vẽ có thể tùy chỉnh và thêm nó làm nền cho bố cục của mình. thí dụ:

Tạo một tệp có tên customborder.xmltrong thư mục có thể vẽ của bạn:

<?xml version="1.0" encoding="UTF-8"?>
 <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
   <corners android:radius="20dp"/> 
   <padding android:left="10dp" android:right="10dp" android:top="10dp" android:bottom="10dp"/>
   <stroke android:width="1dp" android:color="#CCCCCC"/>
 </shape>

Bây giờ áp dụng nó làm nền cho bố cục nhỏ hơn của bạn:

<LinearLayout android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="@drawable/customborder">

Điều đó sẽ làm các trick.

Cũng thấy:


29
<solid> sẽ tô màu trong hình chữ nhật. u cần sử dụng <stroke> để chỉ vẽ đường viền.
NightFury

1
Thủ thuật ở đây thực sự là <padding>, tôi đã mất một lúc để tìm ra lý do tại sao hình dạng của tôi không hoạt động. Với đệm nó hoạt động tốt.
John

3
Cả hai <solid/><stroke/>điền vào toàn bộ hình chữ nhật? Đây có phải là lỗi trong mã của tôi không?
mr5

13
Thêm <stroke android: width = "1dip" android: color = "# CCCCCC" />, nó hoạt động tốt.
Cập bến

1
Nhận xét của Pierry làm cho câu trả lời này chính xác. Nếu không, bạn chỉ có thể nhận được một nền đầy đủ.
kagkar

25

Tạo XML có tên là border.xml trong thư mục có thể vẽ như bên dưới:

<?xml version="1.0" encoding="utf-8"?>
 <layer-list xmlns:android="http://schemas.android.com/apk/res/android">
  <item> 
    <shape android:shape="rectangle">
      <solid android:color="#FF0000" /> 
    </shape>
  </item>   
    <item android:left="5dp" android:right="5dp"  android:top="5dp" >  
     <shape android:shape="rectangle"> 
      <solid android:color="#000000" />
    </shape>
   </item>    
 </layer-list>

sau đó thêm điều này vào bố cục tuyến tính như sau:

     android:background="@drawable/border"

11

Thử cái này:

Ví dụ: hãy định nghĩa res / drawable / my_custom_background.xml là:

(tạo bố cục này trong thư mục có thể vẽ của bạn) layout_border.xml

  <?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="rectangle">
            <stroke android:width="2dp" android:height="2dp"
                android:color="#FF0000" />
            <solid android:color="#000000" />
            <padding android:left="1dp" android:top="1dp" android:right="1dp"
                android:bottom="1dp" />

            <corners android:radius="1dp" android:bottomRightRadius="5dp"
                android:bottomLeftRadius="0dp" android:topLeftRadius="5dp"
                android:topRightRadius="0dp" />
        </shape>
    </item>

</layer-list>

main.xml

<LinearLayout 
    android:layout_gravity="center"
    android:layout_width="200dp" 
    android:layout_height="200dp"   
    android:background="@drawable/layout_border" />
</LinearLayout>

11

Tạo một tệp xml trong thư mục có thể vẽ

<stroke
    android:width="2dp"
    android:color="#B40404" />

<padding
    android:bottom="5dp"
    android:left="5dp"
    android:right="5dp"
    android:top="5dp" />

<corners android:radius="4dp" />

Bây giờ hãy gọi xml này cho nền bố cục nhỏ của bạn

android: background = "@ drawable / yourxml"


Phần tử đột quỵ không được phép ở đây.
hdavidzhu

3

Giải pháp này sẽ chỉ thêm đường viền, phần thân của LinearLayout sẽ trong suốt.

Đầu tiên, Tạo đường viền có thể vẽ này trong thư mục có thể vẽ, border.xml

<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android= "http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <stroke android:width="2dp" android:color="#ec0606"/>
    <corners android:radius="10dp"/>
</shape>

Sau đó, trong Dạng xem LinearLayout của bạn, thêm border.xml làm nền như thế này

<LinearLayout 
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:background="@drawable/border">

3

bạn cũng có thể làm điều đó Thực dụng

  GradientDrawable gradientDrawable=new GradientDrawable();
   gradientDrawable.setStroke(4,getResources().getColor(R.color.line_Input));

Sau đó, đặt nền của bố cục là:

LinearLayout layout = (LinearLayout ) findViewById(R.id.ayout); layout .setBackground(gradientDrawable);

3

Tôi sẽ thêm liên kết tài liệu Android vào các câu trả lời khác.

https://developer.android.com/guide/topics/resources/drawable-resource.html#Shape

Nó mô tả tất cả các thuộc tính của Hình dạng có thể vẽ và stroketrong số đó để thiết lập đường viền.

Thí dụ:

<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
  <stroke android:width="1dp" android:color="#F00"/>
  <solid android:color="#0000"/>
</shape>

Viền đỏ với nền trong suốt.


Phần rắn chỉ cho phép thiết lập sắc thái thành viền. +1
aksh1618

0

Bạn không muốn tạo một tài nguyên có thể vẽ được?

  <FrameLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@android:color/black"
    android:minHeight="128dp">

    <FrameLayout
      android:layout_width="match_parent"
      android:layout_height="match_parent"
      android:layout_margin="1dp"
      android:background="@android:color/white">

      <TextView ... />
    </FrameLayout>
  </FrameLayout>

0

Hãy thử điều này trong res / drawable của bạn

    <?xml version="1.0" encoding="UTF-8"?><layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
  <shape
    android:shape="rectangle">
    <padding android:left="15dp"
        android:right="15dp"
        android:top="15dp"
        android:bottom="15dp"/>
    <stroke android:width="10dp"
        android:color="@color/colorPrimary"/>
  </shape>
</item><item android:left="-5dp"
        android:right="-5dp"
        android:top="-5dp"
        android:bottom="-5dp">
  <shape android:shape="rectangle">
    <solid android:color="@color/background" />
  </shape></item></layer-list>
Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.