Android LinearLayout: добавьте границу с тенью вокруг линейногоLayout

Я хотел бы создать ту же границу этого linearlayout, что и пример:

Введите описание изображения здесь

В этом примере мы можем видеть, что граница не одинаковая вокруг линейногоLayout. Как я могу создать это с помощью xml-файла?

На данный момент я могу только создать простую рамку вокруг linearlayout следующим образом:

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

Solutions Collecting From Web of "Android LinearLayout: добавьте границу с тенью вокруг линейногоLayout"

Попробуй это..

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

Я получаю лучшие результаты, используя графику с 9 патчами.

Вы можете просто создать отдельный графический файл 9 с помощью следующего редактора: http://inloop.github.io/shadow4android/

Пример:

9 графических патчей:

9 графических патчей:

Результат:

Введите описание изображения здесь

Источник:

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

Вот почему CardView существует. CardView | Разработчики Android
Это просто FrameLayout, который поддерживает возвышение в устройствах с предварительным леллипопом.

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

Чтобы использовать это, вам нужно добавить зависимость для build.gradle :

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

Хорошо, я знаю, что это слишком поздно. Но у меня было такое же требование. Я решил так

1. Сначала создайте xml-файл (пример: border_shadow.xml) в папке «drawable» и скопируйте в него код ниже.

 <?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> 1 <?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. Теперь на макете, где вам нужна тень (пример: LinearLayout), добавьте это в android: background

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

И это сработало для меня.

В качестве альтернативы вы можете использовать 9 патч-изображений в качестве фона для вашего макета, что позволяет использовать более «естественные» тени:

Введите описание изображения здесь

Результат:

Введите описание изображения здесь

Поместите изображение в папку /res/drawable .
Убедитесь, что расширение файла – .9.png , а не .png

Кстати, это модифицированный (уменьшенный до минимального квадратного размера) существующий ресурс, найденный в папке ресурсов sdk API 19.
Я оставил красные маркеры, так как они не кажутся вредными, как показано в инструменте draw9patch.

[РЕДАКТИРОВАТЬ]

Примерно 9 патчей, если вы никогда с ними не имели никакого отношения.

Просто добавьте его в качестве фона вашего представления.

Черные области (слева и сверху) будут растягиваться (вертикально, горизонтально).
Черные области (справа, внизу) определяют «область содержимого» (там, где можно добавить текст или «Представления»), вы можете вызывать немаркированные области «отступы», если хотите).

Учебник: http://radleymarx.com/blog/simple-guide-to-9-patch/

Это так просто:

Создайте файл с градиентом, подобный этому:

Для тени ниже вида 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> 

Для тени над представлением 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> 

И т. Д. Для правой и левой тени просто измените угол градиента 🙂

Вы создаете файл .xml в drawable с именем 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> 

Затем:

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

Ya Mahdi aj — для 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>`enter code here` </layer-list> 

Я нашел лучший способ справиться с этим.

  1. Вам нужно установить сплошной прямоугольник на макет.

  2. Используйте этот код – ViewCompat.setElevation(view , value)

  3. На родительском макете установлен android:clipToPadding="false"

Вы можете сделать это с помощью 9 графических патчей, но это неправильно, потому что вам нужно использовать png-файл. Я думаю, вы должны использовать xml-файл (drawable file). Попробуйте использовать этот код

 activity_main.xml <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:padding="10dp" android:orientation="vertical"> <LinearLayout android:layout_width="match_parent" android:layout_height="3dp" android:layout_marginLeft="3dp" android:layout_marginRight="3dp" android:background="@drawable/gradient_top"/> <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="horizontal"> <LinearLayout android:layout_width="3dp" android:layout_height="match_parent" android:layout_marginBottom="3dp" android:background="@drawable/gradient_left"/> <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:layout_marginRight="3dp" android:layout_marginBottom="3dp" android:background="@color/md_white_1000" android:orientation="vertical"> </LinearLayout> <LinearLayout android:layout_width="3dp" android:layout_height="match_parent" android:layout_marginLeft="-4dp" android:layout_marginBottom="3dp" android:background="@drawable/gradient_right"/> </LinearLayout> <LinearLayout android:layout_width="match_parent" android:layout_height="3dp" android:layout_marginTop="-4dp" android:layout_marginLeft="3dp" android:layout_marginRight="3dp" android:background="@drawable/gradient_bottom"/> 

gradient_top.xml

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

gradient_left.xml

 <?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> <gradient android:startColor="#dadada" android:endColor="#f2f2f2" android:angle="180"/> </shape> 

gradient_right.xml

 <?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> <gradient android:startColor="#dadada" android:endColor="#f2f2f2" android:angle="0"/> </shape> 

gradient_bottom.xml

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

Введите описание изображения здесь