Cardview和Glide - 没有圆角,没有阴影

时间:2017-01-03 14:22:37

标签: android android-cardview android-glide

enter image description here 左边的图像是我正在寻找的。如果仔细查看右边的结果,可以看到底部的白色圆角,但仍然没有阴影。

我正在使用Glide在CardView中加载一些图像。我不确定问题究竟是什么,但我怀疑它与Glide有关。 在布局预览中,CardView看起来像我想要的那样,但不是当我在模拟器或真实设备中加载它时。

Glide.with(mContext)
            .load(image.getSmall())
            .fitCenter()
            .crossFade()
            .bitmapTransform()
            .diskCacheStrategy(DiskCacheStrategy.ALL)
            .into(holder.coverImageView);}

XML

<android.support.v7.widget.CardView 
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="@+id/card_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="5dp"
card_view:cardCornerRadius="5dp"
card_view:cardElevation="5dp">

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="@dimen/card_height"
    android:orientation="vertical"
    android:weightSum="4">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="3.5"
        android:orientation="vertical">

        <FrameLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_gravity="center_horizontal">

            <ImageView
                android:id="@+id/coverImageView"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_gravity="center"
                android:scaleType="centerCrop" />

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_gravity="left|bottom"
                android:background="@android:drawable/screen_background_dark_transparent"
                android:orientation="vertical">

                <TextView
                    android:id="@+id/titleTextView"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:padding="16dp"
                    android:textColor="#FFFFFF"
                    android:textSize="@dimen/text_size"
                    android:textStyle="bold" />
            </LinearLayout>
        </FrameLayout>
    </LinearLayout>
</LinearLayout>

3 个答案:

答案 0 :(得分:1)

问题不在于布局或滑行。几个星期前,我补充说:

android:hardwareAccelerated="false"
android:largeHeap="true"
由于内存管理问题(我的应用程序将在Geneymotion中停止响应),因此我的Manifest。 原来它创造了比解决它们更多的问题。

答案 1 :(得分:1)

将RoundedCornerTransformation与Glide结合使用。您无法看到您的cardview的圆角,因为您的图像未被舍入。您可以给出imageview的宽度和高度。 删除.FitCenter()。

如果您的第二个列表具有相同的转换但尺寸不同的相同图像,则应注意.diskCacheStrategy(DiskCacheStrategy.ALL)它还会缓存转换。然后你想使用.diskCacheStrategy(DiskCacheStrategy.SOURCE)

以下代码是我在Xamarin Android中的代码,您可以轻松将其转换为java。

您可以这样称呼它:

.transform(new CornersTransformation(context, _radius, _radius, _radius, _radius, CornerTransformType.AllRounded, preferredImageWidth, preferredImageHeight))

使用枚举类定义圆角:

[Flags]
public enum CornerTransformType
{
    TopLeftCut = 0x1,
    TopRightCut = 0x2,
    BottomLeftCut = 0x4,
    BottomRightCut = 0x8,

    TopLeftRounded = 0x10,
    TopRightRounded = 0x20,
    BottomLeftRounded = 0x40,
    BottomRightRounded = 0x80,

    AllCut = TopLeftCut | TopRightCut | BottomLeftCut | BottomRightCut,
    LeftCut = TopLeftCut | BottomLeftCut,
    RightCut = TopRightCut | BottomRightCut,
    TopCut = TopLeftCut | TopRightCut,
    BottomCut = BottomLeftCut | BottomRightCut,

    AllRounded = TopLeftRounded | TopRightRounded | BottomLeftRounded | BottomRightRounded,
    LeftRounded = TopLeftRounded | BottomLeftRounded,
    RightRounded = TopRightRounded | BottomRightRounded,
    TopRounded = TopLeftRounded | TopRightRounded,
    BottomRounded = BottomLeftRounded | BottomRightRounded,
}

使用继承自Glide的BitmapTransformation的CornersTransformation。

public class CornersTransformation : BitmapTransformation
{
    #region properties

    public double TopLeftCornerSize { get; set; }
    public double TopRightCornerSize { get; set; }
    public double BottomLeftCornerSize { get; set; }
    public double BottomRightCornerSize { get; set; }
    public int DesiredWidht { get; set; }
    public int DesiredHeight { get; set; }
    public CornerTransformType CornersTransformType { get; set; }
    public bool SetForcedSize { get; set; }

    public override string Id
    {
        get
        {
            return string.Format("CornersTransformation,cornersSizes={0},{1},{2},{3},cornersTransformType={4},cropWidthRatio={5},cropHeightRatio={6},",
            TopLeftCornerSize, TopRightCornerSize, BottomRightCornerSize, BottomLeftCornerSize, CornersTransformType, DesiredWidht, DesiredHeight);
        }
    }

    #endregion

    #region constructor

    public CornersTransformation(IntPtr javaReference, JniHandleOwnership transfer) : base(javaReference, transfer)
    {
    }

    public CornersTransformation(IBitmapPool p0) : base(p0)
    {
    }

    public CornersTransformation(Context context, double topLeftCornerSize, double topRightCornerSize, double bottomLeftCornerSize, double bottomRightCornerSize,
                                 CornerTransformType cornersTransformType, int desiredWidht, int desiredHeight) : base(context)
    {
        TopLeftCornerSize = topLeftCornerSize;
        TopRightCornerSize = topRightCornerSize;
        BottomLeftCornerSize = bottomLeftCornerSize;
        BottomRightCornerSize = bottomRightCornerSize;
        CornersTransformType = cornersTransformType;
        DesiredWidht = desiredWidht;
        DesiredHeight = desiredHeight;
    }

    #endregion

    #region public methods

    protected override Bitmap Transform(IBitmapPool p0, Bitmap bitmap, int p2, int p3)
    {
        return ToTransformedCorners(bitmap, TopLeftCornerSize, TopRightCornerSize, BottomLeftCornerSize, BottomRightCornerSize, CornerTransformType.AllRounded, 1, 1);
    }

    public Bitmap ToTransformedCorners(Bitmap source, double topLeftCornerSize, double topRightCornerSize, double bottomLeftCornerSize, double bottomRightCornerSize,
    CornerTransformType cornersTransformType, double cropWidthRatio, double cropHeightRatio)
    {
        if (DesiredWidht == 0 || DesiredHeight == 0)
        {
            return source;
        }

        float cropX = 0, cropY = 0;
        double desiredWidth = 0;
        double desiredHeight = 0;

        if (forcedSize)
        {
            BzLogging.Log("DesiredWidht: " + DesiredWidht + ", DesiredHeight: " + DesiredHeight + " in transformation");

            if (DesiredWidht > source.Width)
            {
                source = Bitmap.CreateScaledBitmap(source, DesiredWidht, source.Height * (DesiredWidht / source.Width), true);
            }

            double sourceWidth = source.Width;
            double sourceHeight = source.Height;

            desiredWidth = DesiredWidht;
            desiredHeight = DesiredHeight;

            topLeftCornerSize = topLeftCornerSize * (desiredWidth + desiredHeight) / 2 / 100;
            topRightCornerSize = topRightCornerSize * (desiredWidth + desiredHeight) / 2 / 100;
            bottomLeftCornerSize = bottomLeftCornerSize * (desiredWidth + desiredHeight) / 2 / 100;
            bottomRightCornerSize = bottomRightCornerSize * (desiredWidth + desiredHeight) / 2 / 100;

            cropX = (float)((sourceWidth - desiredWidth) / 2);
            cropY = (float)((sourceHeight - desiredHeight) / 2);
        }
        else
        {
            cropX = 0;
            cropY = 0;
            desiredWidth = source.Width;
            desiredHeight = source.Height;

            topLeftCornerSize = topLeftCornerSize * (desiredWidth + desiredHeight) / 2 / 100;
            topRightCornerSize = topRightCornerSize * (desiredWidth + desiredHeight) / 2 / 100;
            bottomLeftCornerSize = bottomLeftCornerSize * (desiredWidth + desiredHeight) / 2 / 100;
            bottomRightCornerSize = bottomRightCornerSize * (desiredWidth + desiredHeight) / 2 / 100;
        }

        Bitmap bitmap = Bitmap.CreateBitmap((int)desiredWidth, (int)desiredHeight, Bitmap.Config.Argb8888);

        using (Canvas canvas = new Canvas(bitmap))
        using (Paint paint = new Paint())
        using (BitmapShader shader = new BitmapShader(source, Shader.TileMode.Clamp, Shader.TileMode.Clamp))
        using (Matrix matrix = new Matrix())
        using (var path = new Path())
        {
            if (Math.Abs(cropX) > 0.0001 || Math.Abs(cropY) > 0.0001)
            {
                matrix.SetTranslate(-cropX, -cropY);
                shader.SetLocalMatrix(matrix);
            }

            paint.SetShader(shader);
            paint.AntiAlias = true;

            // TopLeft
            if (cornersTransformType.HasFlag(CornerTransformType.TopLeftCut))
            {
                path.MoveTo(0, (float)topLeftCornerSize);
                path.LineTo((float)topLeftCornerSize, 0);
            }
            else if (cornersTransformType.HasFlag(CornerTransformType.TopLeftRounded))
            {
                path.MoveTo(0, (float)topLeftCornerSize);
                path.QuadTo(0, 0, (float)topLeftCornerSize, 0);
            }
            else
            {
                path.MoveTo(0, 0);
            }

            // TopRight
            if (cornersTransformType.HasFlag(CornerTransformType.TopRightCut))
            {
                path.LineTo((float)(desiredWidth - topRightCornerSize), 0);
                path.LineTo((float)desiredWidth, (float)topRightCornerSize);
            }
            else if (cornersTransformType.HasFlag(CornerTransformType.TopRightRounded))
            {
                path.LineTo((float)(desiredWidth - topRightCornerSize), 0);
                path.QuadTo((float)desiredWidth, 0, (float)desiredWidth, (float)topRightCornerSize);
            }
            else
            {
                path.LineTo((float)desiredWidth, 0);
            }

            // BottomRight
            if (cornersTransformType.HasFlag(CornerTransformType.BottomRightCut))
            {
                path.LineTo((float)desiredWidth, (float)(desiredHeight - bottomRightCornerSize));
                path.LineTo((float)(desiredWidth - bottomRightCornerSize), (float)desiredHeight);
            }
            else if (cornersTransformType.HasFlag(CornerTransformType.BottomRightRounded))
            {
                path.LineTo((float)desiredWidth, (float)(desiredHeight - bottomRightCornerSize));
                path.QuadTo((float)desiredWidth, (float)desiredHeight, (float)(desiredWidth - bottomRightCornerSize), (float)desiredHeight);
            }
            else
            {
                path.LineTo((float)desiredWidth, (float)desiredHeight);
            }

            // BottomLeft
            if (cornersTransformType.HasFlag(CornerTransformType.BottomLeftCut))
            {
                path.LineTo((float)bottomLeftCornerSize, (float)desiredHeight);
                path.LineTo(0, (float)(desiredHeight - bottomLeftCornerSize));
            }
            else if (cornersTransformType.HasFlag(CornerTransformType.BottomLeftRounded))
            {
                path.LineTo((float)bottomLeftCornerSize, (float)desiredHeight);
                path.QuadTo(0, (float)desiredHeight, 0, (float)(desiredHeight - bottomLeftCornerSize));
            }
            else
            {
                path.LineTo(0, (float)desiredHeight);
            }

            path.Close();
            canvas.DrawPath(path, paint);

            return bitmap;
        }
    }

    #endregion
}

}

有关自定义转换的详细信息:https://futurestud.io/tutorials/glide-custom-transformation

答案 2 :(得分:-1)

使用此

app:cardCornerRadius="10dp"
app:cardElevation="5dp"