绘制自定义形状以将Image加载到

时间:2016-01-18 07:26:15

标签: android drawable

我想在蓝色中绘制以下自定义形状以便将图像加载到(不是静态资源可绘制的)中:

enter image description here

空白内容是我的内容,它曾经是一个滚动视图。我尝试使用drawable,我在我的LinearLayout中将其设置为背景,但我认为我不会加载我的图像(我目前使用Picasso)

2 个答案:

答案 0 :(得分:3)

您可以创建自定义图像视图。

我创建了以下代码,并引用了此Tutorial

package com.example.demo;

import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Path;
import android.graphics.Point;
import android.graphics.PorterDuff;
import android.graphics.PorterDuffXfermode;
import android.graphics.Rect;
import android.graphics.drawable.BitmapDrawable;
import android.graphics.drawable.Drawable;
import android.util.AttributeSet;
import android.widget.ImageView;

/**
 * Created by ketan on 1/18/2016.
 */
public class CustomImage extends ImageView {

    public CustomImage(Context ctx, AttributeSet attrs) {
        super(ctx, attrs);

    }

    @Override
    protected void onDraw(Canvas canvas) {

        Drawable drawable = getDrawable();

        if (drawable == null) {
            return;
        }

        if (getWidth() == 0 || getHeight() == 0) {
            return;
        }
        Bitmap b = ((BitmapDrawable) drawable).getBitmap();
        Bitmap bitmap = b.copy(Bitmap.Config.ARGB_8888, true);

        int w = getWidth(), h = getHeight();

        Bitmap croppedBitmap = getCroppedBitmap(bitmap, w);
        canvas.drawBitmap(croppedBitmap, 0, 0, null);

    }

    public static Bitmap getCroppedBitmap(Bitmap bitmap, int radius) {
        Bitmap finalBitmap;
        if (bitmap.getWidth() != radius || bitmap.getHeight() != radius)
            finalBitmap = Bitmap.createScaledBitmap(bitmap, radius, radius,
                    false);
        else
            finalBitmap = bitmap;
        Bitmap output = Bitmap.createBitmap(finalBitmap.getWidth(),
                finalBitmap.getHeight(), Bitmap.Config.ARGB_8888);
        Canvas canvas = new Canvas(output);

        Paint paint = new Paint();
        final Rect rect = new Rect(0, 0, finalBitmap.getWidth(),
                finalBitmap.getHeight());

        /*change these value or make it dynamic*/
        Point point0_draw = new Point(0, 0);
        Point point1_draw = new Point(0, 175);
        Point point2_draw = new Point(101, 198);
        Point point3_draw = new Point(198, 175);
        Point point4_draw = new Point(198, 0);

        Path path = new Path();
        path.moveTo(point0_draw.x, point0_draw.y);
        path.lineTo(point1_draw.x, point1_draw.y);
        path.lineTo(point2_draw.x, point2_draw.y);
        path.lineTo(point3_draw.x, point3_draw.y);
        path.lineTo(point4_draw.x, point4_draw.y);
        path.lineTo(point0_draw.x, point0_draw.y);
        path.close();
        canvas.drawARGB(0, 0, 0, 0);
        paint.setColor(Color.parseColor("#BAB399"));
        canvas.drawPath(path, paint);
        paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN));
        canvas.drawBitmap(finalBitmap, rect, rect, paint);

        return output;
    }
}

答案 1 :(得分:1)

你认为这会有用吗,

想法是隐藏imageView的某些数量和形状以获得您想要的东西。为此,您需要drawable目录res/drawabletriangle_shape_left.xml

中的两个triangle_shape_right.xml资源
  

triangle_shape_left.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <rotate
            android:fromDegrees="-70"
            android:pivotX="90%"
            android:pivotY="75%"
            android:toDegrees="40">
            <shape android:shape="rectangle">
                <stroke
                    android:width="10dp"
                    android:color="@android:color/transparent" />
                <solid android:color="@android:color/holo_blue_bright" />
            </shape>
        </rotate>
    </item>
</layer-list>
  

triangle_shape_right.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <rotate
            android:fromDegrees="70"
            android:pivotX="15%"
            android:pivotY="75%"
            android:toDegrees="0">
            <shape android:shape="rectangle">
                <stroke
                    android:width="10dp"
                    android:color="@android:color/transparent" />
                <solid android:color="@android:color/holo_blue_bright" />
            </shape>
        </rotate>
    </item>
</layer-list>

代码==&GT;

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


    <ImageView
        android:id="@+id/imageView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:scaleType="fitXY"
        android:src="@drawable/gohan" />

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:scaleType="fitXY"
        android:src="@drawable/triangle_shape_left" />

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:scaleType="fitXY"
        android:src="@drawable/triangle_shape_right" />
</FrameLayout>

enter image description here