如何在android的linearlayout周围显示阴影?

我怎样才能显示我的线性布局的阴影。 我想要在线性布局周围有阴影的白色圆形背景。 到目前为止,我已经做到了。 请帮帮我。 提前致谢。

<LinearLayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_margin="10dp" android:background="@xml/rounded_rect_shape" android:orientation="vertical" android:padding="10dp"> <-- My buttons, textviews, Imageviews go here --> </LinearLayout> 

和xml目录下的rounded_rect_shape.xml

  <?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle" > <solid android:color="#ffffff" /> <corners android:bottomLeftRadius="3dp" android:bottomRightRadius="3dp" android:topLeftRadius="3dp" android:topRightRadius="3dp" /> </shape> 

Android中没有这样的属性,显示出阴影。 但是可能的方法是:

  1. 添加一个简单的灰色LinearLayout,其中添加您的实际布局,在底部和右边的余量等于1或2 DP

  2. 有一个带有阴影的9-补丁图像,并将其设置为线性布局的背景

通过实现一个将作为LinearLayout的背景的层列表,还有另一个解决scheme。

将background_with_shadow.xml文件添加到res/drawable 。 含:

 <?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="@android:color/darker_gray" /> <corners android:radius="5dp"/> </shape> </item> <item android:right="1dp" android:left="1dp" android:bottom="2dp"> <shape android:shape="rectangle"> <solid android:color="@android:color/white"/> <corners android:radius="5dp"/> </shape> </item> </layer-list> 

然后在LinearLayout中添加图层列表作为背景。

 <LinearLayout android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/background_with_shadow"/> 

那么,这很容易实现。

只需构build一个GradientDrawable ,它来自黑色,并转换为透明颜色,而不是使用父级关系将您的形状放置在您希望具有阴影的视图附近,那么您只需将任何值赋予高度或宽度即可。

这里是一个例子,这个文件必须在res/drawable里面创build,我把它命名为shadow.xml

 <?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> <gradient android:startColor="#9444" android:endColor="#0000" android:type="linear" android:angle="90"> <!-- Change this value to have the correct shadow angle, must be multiple from 45 --> </gradient> </shape> 

LinearLayout放置以下代码,例如,将android:layout_widthandroid:layout_heightfill_parent2.3dp ,将在LinearLayout上产生一个不错的阴影效果。

 <View android:id="@+id/shadow" android:layout_width="fill_parent" android:layout_height="2.3dp" android:layout_above="@+id/id_from_your_LinearLayout" android:background="@drawable/shadow"> </View> 

注1:如果增加android:layout_height会显示更多的阴影。

注2:使用android:layout_above="@+id/id_from_your_LinearLayout"属性,如果你把这个代码放在一个RelativeLayout中,否则忽略它。

希望它能帮助别人。

对于棒棒糖和以上,你可以使用海拔 。

对于旧版本:

这是一个懒惰的黑客: http : //odedhb.blogspot.com/2013/05/android-layout-shadow-without-9-patch.html

(toast_frame在KitKat上不起作用,影子从吐司中移除)

只是使用:

 android:background="@android:drawable/toast_frame" 

要么:

 android:background="@android:drawable/dialog_frame" 

作为背景

例子:

 <TextView android:layout_width="fill_parent" android:text="I am a simple textview with a shadow" android:layout_height="wrap_content" android:textSize="18sp" android:padding="16dp" android:textColor="#fff" android:background="@android:drawable/toast_frame" /> 

和不同的颜色:

 <LinearLayout android:layout_height="64dp" android:layout_width="fill_parent" android:gravity="center" android:background="@android:drawable/toast_frame" android:padding="4dp" > <Button android:layout_width="fill_parent" android:layout_height="fill_parent" android:text="Button shadow" android:background="#33b5e5" android:textSize="24sp" android:textStyle="bold" android:textColor="#fff" android:layout_gravity="center|bottom" /> </LinearLayout> 

试试这个.. layout_shadow.xml

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

像这样适用于你的布局

  android:background="@drawable/layout_shadow" 

实际上,我同意@debreckiner,但我把dialog_frame放在第一层,并隐藏白色层下的黑色背景。

  <?xml version="1.0" encoding="utf-8"?> <layer-list xmlns:android="http://schemas.android.com/apk/res/android"> <item android:drawable="@android:drawable/dialog_frame" android:right="2dp" android:left="2dp" android:bottom="2dp" android:top="5dp" > <shape android:shape="rectangle"> <corners android:radius="5dp"/> </shape> </item> <item> <shape android:shape="rectangle"> <solid android:color="@android:color/white"/> <corners android:radius="5dp"/> </shape> </item> </layer-list> 
  1. 保存这个9.png。 (改名为9.png

在这里输入图像描述

把它保存在你的drawable

3.将其设置为您的布局。

4.set填充。

例如 :

 <LinearLayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:background="@drawable/shadow" android:paddingBottom="6dp" android:paddingLeft="5dp" android:paddingRight="5dp" android:paddingTop="6dp" > . . . </LinearLayout> 

在DRAWABLE中用下面的代码创build一个名为“shadow.xml”的新的XML(你可以修改它或者find另一个更好的):

 <?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="@color/middle_grey"/> </shape> </item> <item android:left="2dp" android:right="2dp" android:bottom="2dp"> <shape android:shape="rectangle"> <solid android:color="@color/white"/> </shape> </item> </layer-list> 

在LinearLayout或另一个想要创build阴影的Widget中创buildXML之后,可以使用BACKGROUND属性来查看效果。 这将是这样的:

 <LinearLayout android:orientation="horizontal" android:layout_height="wrap_content" android:layout_width="match_parent" android:paddingRight="@dimen/margin_med" android:background="@drawable/shadow" android:minHeight="?attr/actionBarSize" android:gravity="center_vertical"> 

一个可能的解决scheme是使用像这样的九个补丁图像http://developer.android.com/guide/topics/graphics/2d-graphics.html#nine-patch

要么

我以下面的方式做了这个。 这是我使用round_corner.xml和drop_shadow.xml作为背景资源的主要布局。 round_corner_two与round_corner.xml相同,只是颜色属性不同。 将round_corner.xml,drop_shadow.xml和round_conere_two.xml复制到drawable文件夹中。

 <RelativeLayout android:id="@+id/facebook_id" android:layout_width="250dp" android:layout_height="52dp" android:layout_centerHorizontal="true" android:layout_marginTop="28dp" android:background="@drawable/round_corner" > <LinearLayout android:id="@+id/shadow_id" android:layout_width="match_parent" android:layout_height="48dp" android:layout_margin="1dp" android:background="@drawable/drop_shadow" > <TextView android:layout_width="match_parent" android:layout_height="match_parent" android:layout_gravity="center" android:layout_marginBottom="2dp" android:background="@drawable/round_corner_two" android:gravity="center" android:text="@string/fb_butn_text" android:textColor="@color/white" > </TextView> </LinearLayout> </RelativeLayout> 

round_corner.xml:

 <?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> <!-- view background color --> <solid android:color="#ffffff" > </solid> <!-- view border color and width --> <stroke android:width="0dp" android:color="#3b5998" > </stroke> <!-- If you want to add some padding --> <padding android:left="1dp" android:top="1dp" android:right="1dp" android:bottom="1dp" > </padding> <!-- Here is the corner radius --> <corners android:radius="10dp" > </corners> </shape> 

drop_shadow.xml

 <?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="@android:color/darker_gray" /> <corners android:radius="12dp"/> </shape> </item> <item android:right="1dp" android:left="1dp" android:bottom="5dp"> <shape android:shape="rectangle"> <solid android:color="@android:color/white"/> <corners android:radius="5dp"/> </shape> </item> </layer-list> 

设置这个xml drwable作为你的背景; —

 <?xml version="1.0" encoding="utf-8"?> <layer-list xmlns:android="http://schemas.android.com/apk/res/android" > <!-- Bottom 2dp Shadow --> <item> <shape android:shape="rectangle" > <solid android:color="#d8d8d8" />-->Your shadow color<-- <corners android:radius="15dp" /> </shape> </item> <!-- White Top color --> <item android:bottom="3px" android:left="3px" android:right="3px" android:top="3px">-->here you can customize the shadow size<--- <shape android:shape="rectangle" > <solid android:color="#FFFFFF" /> <corners android:radius="15dp" /> </shape> </item> </layer-list> 

我知道这太晚了。 但我有同样的要求。 我解决这个问题

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

你需要添加依赖关系:

 compile 'com.android.support:cardview-v7:25.0.1' 

您可以使用以下类为XML标记:

 import android.annotation.SuppressLint; import android.content.Context; import android.content.res.TypedArray; import android.graphics.Bitmap; import android.graphics.BlurMaskFilter; import android.graphics.Canvas; import android.graphics.Color; import android.graphics.Paint; import android.graphics.PorterDuff; import android.graphics.Rect; import android.os.Build; import android.support.annotation.FloatRange; import android.util.AttributeSet; import android.view.ViewGroup; import android.view.ViewTreeObserver; import android.widget.FrameLayout; import com.webappmate.weeassure.R; /** * Created by GIGAMOLE on 13.04.2016. */ public class ShadowLayout extends FrameLayout { // Default shadow values private final static float DEFAULT_SHADOW_RADIUS = 30.0F; private final static float DEFAULT_SHADOW_DISTANCE = 15.0F; private final static float DEFAULT_SHADOW_ANGLE = 45.0F; private final static int DEFAULT_SHADOW_COLOR = Color.DKGRAY; // Shadow bounds values private final static int MAX_ALPHA = 255; private final static float MAX_ANGLE = 360.0F; private final static float MIN_RADIUS = 0.1F; private final static float MIN_ANGLE = 0.0F; // Shadow paint private final Paint mPaint = new Paint(Paint.ANTI_ALIAS_FLAG) { { setDither(true); setFilterBitmap(true); } }; // Shadow bitmap and canvas private Bitmap mBitmap; private final Canvas mCanvas = new Canvas(); // View bounds private final Rect mBounds = new Rect(); // Check whether need to redraw shadow private boolean mInvalidateShadow = true; // Detect if shadow is visible private boolean mIsShadowed; // Shadow variables private int mShadowColor; private int mShadowAlpha; private float mShadowRadius; private float mShadowDistance; private float mShadowAngle; private float mShadowDx; private float mShadowDy; public ShadowLayout(final Context context) { this(context, null); } public ShadowLayout(final Context context, final AttributeSet attrs) { this(context, attrs, 0); } public ShadowLayout(final Context context, final AttributeSet attrs, final int defStyleAttr) { super(context, attrs, defStyleAttr); setWillNotDraw(false); setLayerType(LAYER_TYPE_HARDWARE, mPaint); // Retrieve attributes from xml final TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.ShadowLayout); try { setIsShadowed(typedArray.getBoolean(R.styleable.ShadowLayout_sl_shadowed, true)); setShadowRadius( typedArray.getDimension( R.styleable.ShadowLayout_sl_shadow_radius, DEFAULT_SHADOW_RADIUS ) ); setShadowDistance( typedArray.getDimension( R.styleable.ShadowLayout_sl_shadow_distance, DEFAULT_SHADOW_DISTANCE ) ); setShadowAngle( typedArray.getInteger( R.styleable.ShadowLayout_sl_shadow_angle, (int) DEFAULT_SHADOW_ANGLE ) ); setShadowColor( typedArray.getColor( R.styleable.ShadowLayout_sl_shadow_color, DEFAULT_SHADOW_COLOR ) ); } finally { typedArray.recycle(); } } @Override protected void onDetachedFromWindow() { super.onDetachedFromWindow(); // Clear shadow bitmap if (mBitmap != null) { mBitmap.recycle(); mBitmap = null; } } public boolean isShadowed() { return mIsShadowed; } public void setIsShadowed(final boolean isShadowed) { mIsShadowed = isShadowed; postInvalidate(); } public float getShadowDistance() { return mShadowDistance; } public void setShadowDistance(final float shadowDistance) { mShadowDistance = shadowDistance; resetShadow(); } public float getShadowAngle() { return mShadowAngle; } @SuppressLint("SupportAnnotationUsage") @FloatRange public void setShadowAngle(@FloatRange(from = MIN_ANGLE, to = MAX_ANGLE) final float shadowAngle) { mShadowAngle = Math.max(MIN_ANGLE, Math.min(shadowAngle, MAX_ANGLE)); resetShadow(); } public float getShadowRadius() { return mShadowRadius; } public void setShadowRadius(final float shadowRadius) { mShadowRadius = Math.max(MIN_RADIUS, shadowRadius); if (isInEditMode()) return; // Set blur filter to paint mPaint.setMaskFilter(new BlurMaskFilter(mShadowRadius, BlurMaskFilter.Blur.NORMAL)); resetShadow(); } public int getShadowColor() { return mShadowColor; } public void setShadowColor(final int shadowColor) { mShadowColor = shadowColor; mShadowAlpha = Color.alpha(shadowColor); resetShadow(); } public float getShadowDx() { return mShadowDx; } public float getShadowDy() { return mShadowDy; } // Reset shadow layer private void resetShadow() { // Detect shadow axis offset mShadowDx = (float) ((mShadowDistance) * Math.cos(mShadowAngle / 180.0F * Math.PI)); mShadowDy = (float) ((mShadowDistance) * Math.sin(mShadowAngle / 180.0F * Math.PI)); // Set padding for shadow bitmap final int padding = (int) (mShadowDistance + mShadowRadius); setPadding(padding, padding, padding, padding); requestLayout(); } private int adjustShadowAlpha(final boolean adjust) { return Color.argb( adjust ? MAX_ALPHA : mShadowAlpha, Color.red(mShadowColor), Color.green(mShadowColor), Color.blue(mShadowColor) ); } @Override protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) { super.onMeasure(widthMeasureSpec, heightMeasureSpec); // Set ShadowLayout bounds mBounds.set( 0, 0, MeasureSpec.getSize(widthMeasureSpec), MeasureSpec.getSize(heightMeasureSpec) ); } @Override public void requestLayout() { // Redraw shadow mInvalidateShadow = true; super.requestLayout(); } @Override protected void dispatchDraw(final Canvas canvas) { // If is not shadowed, skip if (mIsShadowed) { // If need to redraw shadow if (mInvalidateShadow) { // If bounds is zero if (mBounds.width() != 0 && mBounds.height() != 0) { // Reset bitmap to bounds mBitmap = Bitmap.createBitmap( mBounds.width(), mBounds.height(), Bitmap.Config.ARGB_8888 ); // Canvas reset mCanvas.setBitmap(mBitmap); // We just redraw mInvalidateShadow = false; // Main feature of this lib. We create the local copy of all content, so now // we can draw bitmap as a bottom layer of natural canvas. // We draw shadow like blur effect on bitmap, cause of setShadowLayer() method of // paint does`t draw shadow, it draw another copy of bitmap super.dispatchDraw(mCanvas); // Get the alpha bounds of bitmap final Bitmap extractedAlpha = mBitmap.extractAlpha(); // Clear past content content to draw shadow mCanvas.drawColor(0, PorterDuff.Mode.CLEAR); // Draw extracted alpha bounds of our local canvas mPaint.setColor(adjustShadowAlpha(false)); mCanvas.drawBitmap(extractedAlpha, mShadowDx, mShadowDy, mPaint); // Recycle and clear extracted alpha extractedAlpha.recycle(); } else { // Create placeholder bitmap when size is zero and wait until new size coming up mBitmap = Bitmap.createBitmap(1, 1, Bitmap.Config.RGB_565); } } // Reset alpha to draw child with full alpha mPaint.setColor(adjustShadowAlpha(true)); // Draw shadow bitmap if (mCanvas != null && mBitmap != null && !mBitmap.isRecycled()) canvas.drawBitmap(mBitmap, 0.0F, 0.0F, mPaint); } // Draw child`s super.dispatchDraw(canvas); } } 

在xml中使用标签,如下所示:

 <yourpackagename.ShadowLayout android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:layout_centerHorizontal="true" android:layout_gravity="center_horizontal" app:sl_shadow_color="#9e000000" app:sl_shadow_radius="4dp"> <child views> </yourpackagename.ShadowLayout>