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

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



enter image description here



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



на данный момент у меня есть только возможность создать простую границу вокруг 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>
621   11  

11 ответов:

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

<?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>
188  
2014-06-07 11:24:42

вот почему существует CardView. CardView / Android Разработчики
Это просто FrameLayout, который поддерживает высоту в устройствах pre-lollipop.

<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.+'
57  
2016-01-11 10:11:23

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

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

пример:

9 патч графика:

The 9 patch graphic:

результат:

enter image description here

источник:

<LinearLayout
android:layout_width="200dp"
android:layout_height="200dp"
android:orientation="vertical"
android:background="@drawable/my_nine_patch"
46  
2015-07-30 14:09:59

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

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>

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

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

30  
2015-05-15 12:43:41

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

enter image description here

результат:

enter image description here

поместите изображение в свой .
Убедитесь, что расширение файла .9.png, а не .png

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

[EDIT]

около 9 патчей, в случае, если вы никогда не имели ничего общего с ними.

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

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

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

16  
2014-06-07 17:13:54

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

создать рисованный файл с градиентом, как это:

для тени под видом 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>

и так далее для правой и левой тени просто изменить угол градиента :)

15  
2016-02-15 12:17:59

создать файл .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"/>
8  
2016-08-25 11:22:59

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

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

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

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

0  
2017-04-14 08:10:10

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>
</layer-list>
0  
2017-11-04 03:09:28

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

0  
2018-01-30 10:33:43

вы можете сделать это с 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>

enter image description here

-1  
2016-07-30 14:45:46

Comments

    Ничего не найдено.
Click here to cancel reply.