圆形的ViewPager [英] Circle shape for ViewPager

问题描述

您好，我有一个viewpager相对布局。

Hi i have a relative layout with a viewpager.

<RelativeLayout
    android:id="@+id/bubble_circle"
    android:layout_width="200px"
    android:layout_height="200px"
    android:layout_centerHorizontal="true"
    android:background="@drawable/circle">
    <android.support.v4.view.ViewPager
        android:id="@+id/pager"
        android:overScrollMode="never"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:background="@android:color/transparent"/>
</RelativeLayout>>

我想，这种看法寻呼机有一个圆形。
我试图重写RelativeLayout的方法dispachdraw

I want that this view pager has a circle shape. I tried to override the method dispachdraw of relativelayout

paint = new Paint();
mShadowBounds.top = 0;
mShadowBounds.bottom = canvas.getHeight();
mShadowBounds.left = 0;
mShadowBounds.right = canvas.getWidth();

paint.setXfermode(new PorterDuffXfermode(android.graphics.PorterDuff.Mode.DST_IN));
canvas.drawOval(mShadowBounds, paint);

但它只能绘制在上面黑圈。
我该怎么办？

But it paint only a black circle on top. How can i do?

感谢

推荐答案

使用下面的类作为XML父，

use below class as parent in xml,

import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.PorterDuff;
import android.graphics.PorterDuffXfermode;
import android.graphics.RectF;
import android.util.AttributeSet;
import android.util.DisplayMetrics;
import android.util.TypedValue;
import android.widget.FrameLayout;

public class RoundedCornerLayout extends FrameLayout
{
    private final static float CORNER_RADIUS = 100.0f;

    private Bitmap maskBitmap;
    private Paint paint, maskPaint;
    private float cornerRadius;

    public RoundedCornerLayout(Context context)
    {
        super(context);
        init(context, null, 0);
    }

    public RoundedCornerLayout(Context context, AttributeSet attrs)
    {
        super(context, attrs);
        init(context, attrs, 0);
    }

    public RoundedCornerLayout(Context context, AttributeSet attrs, int defStyle)
    {
        super(context, attrs, defStyle);
        init(context, attrs, defStyle);
    }

    private void init(Context context, AttributeSet attrs, int defStyle)
    {
        pain_border = new Paint();
        pain_border.setFlags(Paint.ANTI_ALIAS_FLAG);
        pain_border.setColor(Color.WHITE);
        pain_border.setStyle(android.graphics.Paint.Style.STROKE);
        pain_border.setStrokeWidth(6);

        paint_inside_background = new Paint();
        paint_inside_background.setColor(Color.parseColor("#686868"));

        DisplayMetrics metrics = context.getResources().getDisplayMetrics();
        cornerRadius = TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, CORNER_RADIUS, metrics);

        paint = new Paint(Paint.ANTI_ALIAS_FLAG);

        maskPaint = new Paint(Paint.ANTI_ALIAS_FLAG | Paint.FILTER_BITMAP_FLAG);
        maskPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR));

        setWillNotDraw(false);
    }

    Paint pain_border;
    Paint paint_inside_background;

    @Override
    public void draw(Canvas canvas)
    {

        Bitmap offscreenBitmap = Bitmap.createBitmap(canvas.getWidth(), canvas.getHeight(), Bitmap.Config.ARGB_8888);
        Canvas offscreenCanvas = new Canvas(offscreenBitmap);

        super.draw(offscreenCanvas);

        if (maskBitmap == null)
        {
            maskBitmap = createMask(canvas.getWidth(), canvas.getHeight());
        }
        canvas.drawCircle(maskBitmap.getWidth() / 2, maskBitmap.getHeight() / 2, maskBitmap.getWidth() / 2, paint_inside_background);

        offscreenCanvas.drawBitmap(maskBitmap, 0f, 0f, maskPaint);
        canvas.drawBitmap(offscreenBitmap, 0f, 0f, paint);


        canvas.drawCircle((maskBitmap.getWidth() / 2), (maskBitmap.getHeight() / 2), (maskBitmap.getWidth() - 6) / 2, pain_border);
    }

    private Bitmap createMask(int width, int height)
    {
        Bitmap mask = Bitmap.createBitmap(width, height, Bitmap.Config.ALPHA_8);
        Canvas canvas = new Canvas(mask);

        Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);
        paint.setColor(Color.WHITE);

        canvas.drawRect(0, 0, width, height, paint);

        paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR));
        canvas.drawRoundRect(new RectF(0, 0, width, height), cornerRadius, cornerRadius, paint);

        return mask;
    }
}

请确保你必须使用 DP 代替的像素以更好的性能。

make sure you have to use dp instead of px to better performance.

这篇关于圆形的ViewPager的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！