Android tuyến tính: Thêm đường viền với bóng xung quanh tuyến tính

Tôi muốn tạo cùng một đường viền của linearLayout này làm ví dụ:

Trong ví dụ này, chúng ta có thể thấy rằng đường viền không giống nhau xung quanh linearLayout. Làm cách nào tôi có thể tạo tệp này bằng tệp có thể vẽ XML?

Hiện tại, tôi chỉ có thể tạo một đường viền đơn giản xung quanh linearLayout như thế này:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
  <corners
      android:radius="1dp"
      android:topRightRadius="0dp"
      android:bottomRightRadius="0dp"
      android:bottomLeftRadius="0dp" />
  <stroke
      android:width="1dp"
      android:color="#E3E3E1" />

  <solid android:color="@color/blanc" />

</shape>

Thử cái này..

<?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="#CABBBBBB"/>
            <corners android:radius="2dp" />
        </shape>
    </item>

    <item
        android:left="0dp"
        android:right="0dp"
        android:top="0dp"
        android:bottom="2dp">
        <shape android:shape="rectangle">
            <solid android:color="@android:color/white"/>
            <corners android:radius="2dp" />
        </shape>
    </item>
</layer-list>

Đó là lý do CardView tồn tại. Thẻ xem | Nhà phát triển Android
Đây chỉ là một FrameLayout hỗ trợ độ cao trong các thiết bị tiền kẹo.

<android.support.v7.widget.CardView
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:cardUseCompatPadding="true"
    app:cardElevation="4dp"
    app:cardCornerRadius="3dp" >

    <!-- put whatever you want -->

</android.support.v7.widget.CardView>

Để sử dụng điều này, bạn cần thêm phụ thuộc vào build.gradle:

compile 'com.android.support:cardview-v7:23.+'

Tôi nhận được kết quả tìm kiếm tốt nhất bằng cách sử dụng đồ họa 9 bản vá.

Bạn chỉ có thể tạo một đồ họa vá 9 cá nhân bằng cách sử dụng trình chỉnh sửa sau: http://inloop.github.io/shadow4android/

Thí dụ:

Đồ họa 9 bản vá:

Kết quả:

Nguồn:

<LinearLayout
android:layout_width="200dp"
android:layout_height="200dp"
android:orientation="vertical"
android:background="@drawable/my_nine_patch"

được rồi, tôi biết đây là cách quá muộn. nhưng tôi đã có cùng một yêu cầu. tôi đã giải quyết như thế này

1.Đầu tiên tạo một tệp xml (ví dụ: Border_shadow.xml) trong thư mục "drawable" và sao chép mã dưới đây vào nó.

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

<item>
    <shape>
        <!-- set the shadow color here -->
        <stroke
            android:width="2dp"
            android:color="#7000" />

        <!-- setting the thickness of shadow (positive value will give shadow on that side) -->

        <padding
            android:bottom="2dp"
            android:left="2dp"
            android:right="-1dp"
            android:top="-1dp" />

        <corners android:radius="3dp" />
    </shape>
</item>

<!-- Background -->

<item>
    <shape>
        <solid android:color="#fff" />
        <corners android:radius="3dp" />
    </shape>
</item>

2.now trên bố cục nơi bạn muốn bóng (ví dụ: linearLayout) thêm cái này trong android: nền

<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_margin="8dip"
    android:background="@drawable/border_shadow"
    android:orientation="vertical">

và điều đó đã làm việc cho tôi.

Điều này rất đơn giản:

Tạo một tệp có thể vẽ với một gradient như thế này:

cho bóng dưới một góc nhìn below_shadow.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">   
<gradient
    android:startColor="#20000000"
    android:endColor="@android:color/transparent"
    android:angle="270" >
</gradient>
</shape>

cho bóng trên một góc nhìn above_shadow.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">   
<gradient
    android:startColor="#20000000"
    android:endColor="@android:color/transparent"
    android:angle="90" >
</gradient>
</shape>

và cứ thế cho bóng phải và trái chỉ cần thay đổi góc của gradient :)

Thay vào đó, bạn có thể sử dụng hình ảnh vá 9 làm nền cho bố cục của mình, cho phép tạo bóng "tự nhiên" hơn:

Kết quả:

Đặt hình ảnh trong /res/drawablethư mục của bạn .
Hãy chắc chắn rằng phần mở rộng tập tin là .9.png, không.png

Nhân tiện, đây là một sửa đổi (giảm đến kích thước bình phương tối thiểu) của một tài nguyên hiện có trong thư mục tài nguyên sdk API 19.
Tôi đã để lại các điểm đánh dấu màu đỏ, vì chúng dường như không có hại, như được hiển thị trong công cụ draw9patch.

[BIÊN TẬP]

Khoảng 9 bản vá, trong trường hợp bạn không bao giờ có bất cứ điều gì để làm với chúng.

Chỉ cần thêm nó làm nền của Chế độ xem của bạn.

Các khu vực được đánh dấu màu đen (trái và trên cùng) sẽ kéo dài (theo chiều dọc, chiều ngang).
Các khu vực được đánh dấu màu đen (phải, dưới cùng) xác định "khu vực nội dung" (nơi có thể thêm văn bản hoặc Chế độ xem - bạn có thể gọi các khu vực không được đánh dấu là "phần đệm", nếu bạn muốn).

Hướng dẫn: http://radleymarx.com/blog/simple-guide-to-9-patch/

Bạn tạo một tệp .xml có thể vẽ được với tên drop_shadow.xml:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <!--<item android:state_pressed="true">
        <layer-list>
            <item android:left="4dp" android:top="4dp">
                <shape>
                    <solid android:color="#35000000" />
                    <corners android:radius="2dp"/>
                </shape>
            </item>
            ...
        </layer-list>
    </item>-->
    <item>
        <layer-list>
            <!-- SHADOW LAYER -->
            <!--<item android:top="4dp" android:left="4dp">
                <shape>
                    <solid android:color="#35000000" />
                    <corners android:radius="2dp" />
                </shape>
            </item>-->
            <!-- SHADOW LAYER -->
            <item>
                <shape>
                    <solid android:color="#35000000" />
                    <corners android:radius="2dp" />
                </shape>
            </item>
            <!-- CONTENT LAYER -->
            <item android:bottom="3dp" android:left="1dp" android:right="3dp" android:top="1dp">
                <shape>
                    <solid android:color="#ffffff" />
                    <corners android:radius="1dp" />
                </shape>
            </item>
        </layer-list>
    </item>
</selector>

Sau đó:

<LinearLayout
...
android:background="@drawable/drop_shadow"/>

Sử dụng dòng duy nhất này và hy vọng bạn sẽ đạt được kết quả tốt nhất;

sử dụng: android:elevation="3dp" Điều chỉnh kích thước bao nhiêu tùy ý và đây là cách tốt nhất và đơn giản nhất để đạt được bóng như các nút và các bóng Android mặc định khác. Hãy cho tôi biết nếu nó hoạt động!

Nếu bạn đã có đường viền từ hình dạng, chỉ cần thêm độ cao:

<LinearLayout
    android:id="@+id/layout"
    ...
    android:elevation="2dp"
    android:background="@drawable/rectangle" />

1.Đầu tiên tạo một tên tệp xml Shadow.xml trong thư mục "drawable" và sao chép mã dưới đây vào nó.

 <?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="#CABBBBBB" />
                <corners android:radius="10dp" />
            </shape>
        </item>

        <item
            android:bottom="6dp"
            android:left="0dp"
            android:right="6dp"
            android:top="0dp">
            <shape android:shape="rectangle">
                <solid android:color="@android:color/white" />
                <corners android:radius="4dp" />
            </shape>
        </item>
    </layer-list>

Sau đó thêm danh sách lớp làm nền trong linearLayout của bạn.

<LinearLayout
        android:id="@+id/header_bar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/shadow"
        android:orientation="vertical">

Ya Mahdi aj --- cho RelativeLayout

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="rectangle">
            <gradient
                android:startColor="#7d000000"
                android:endColor="@android:color/transparent"
                android:angle="90" >
            </gradient>
            <corners android:radius="2dp" />
        </shape>
    </item>

    <item
        android:left="0dp"
        android:right="3dp"
        android:top="0dp"
        android:bottom="3dp">
        <shape android:shape="rectangle">
            <padding
                android:bottom="40dp"
                android:top="40dp"
                android:right="10dp"
                android:left="10dp"
                >
            </padding>
            <solid android:color="@color/Whitetransparent"/>
            <corners android:radius="2dp" />
        </shape>
    </item>
</layer-list>

Tôi biết điều này là muộn nhưng nó có thể giúp ai đó.

Bạn có thể sử dụng một ràng buộcLayout và thêm thuộc tính sau vào xml,

        android:elevation="4dp"

Tôi tìm thấy cách tốt nhất để giải quyết điều này.

1. Bạn cần đặt một nền hình chữ nhật vững chắc trên bố cục.

2. Sử dụng mã này - ViewCompat.setElevation(view , value)

3. Trên tập bố trí cha android:clipToPadding="false"