Android 自定义漏斗图FunnelView（一）

最新推荐文章于 2022-09-02 22:10:46 发布
最新推荐文章于 2022-09-02 22:10:46 发布
阅读量2.2k 收藏 1
点赞数
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qingfeng812/article/details/52211110
版权

  1. 这个版本为固定设置漏斗数据;后面提供动态设置数据；
  2. 具有动画效果；
  3. 主要麻烦的地方是算坐标点；


效果截图：


代码 FunnelView：




import android.animation.ObjectAnimator;
import android.animation.ValueAnimator;
import android.annotation.SuppressLint;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Path;
import android.util.AttributeSet;
import android.util.TypedValue;
import android.view.View;
import android.view.animation.AccelerateDecelerateInterpolator;

import java.util.ArrayList;
import java.util.List;

/**
 * 漏斗图 v1.0
 */
@SuppressLint("NewApi")
public class FunnelView extends View implements ValueAnimator.AnimatorUpdateListener {
    public static final float ANGLE_SCALE = 3.0f;
    private List<Integer> mMoneys = new ArrayList<>();
    private int maxMoney;

    private float phaseX = 1f;
    private int textAlpha = 255;

    private Paint mPaint1;
    private Paint mPaint2;
    private Paint mPaint3;
    private Paint mPaint4;
    private Paint mPaint5;
    private Paint mPaint6;
    private Paint mPaint7;
    private Paint mPaint8;
    private Paint mPaint9;
    private Paint mPaint10;

    private Paint mPaintLine;
    private Paint mPaintText;


    private Path mPath1;
    private Path mPath2;
    private Path mPath3;
    private Path mPath4;
    private Path mPath5;
    private Path mPath6;
    private Path mPath7;
    private Path mPath8;
    private Path mPath9;
    private Path mPath10;


    private float mTotalHeight = TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 250, getResources().getDisplayMetrics());

    private float mPath1Height;
    private float mPath2Height;
    private float mPath3Height;
    private float mPath4Height;
    private float mPath5Height;
    private float mPath6Height;
    private float mPath7Height;
    private float mPath8Height;
    private float mPath9Height;
    private float mPath10Height;

    private float mPath1AngleWidth;
    private float mPath2AngleWidth;
    private float mPath3AngleWidth;
    private float mPath4AngleWidth;
    private float mPath5AngleWidth;
    private float mPath6AngleWidth;
    private float mPath7AngleWidth;
    private float mPath8AngleWidth;
    private float mPath9AngleWidth;
    private float mPath10AngleWidth;


    private float mPath3LineStartX;
    private float mPath3LineStartY;

    private float mPath4LineStartX;
    private float mPath4LineStartY;

    private float mPath5LineStartX;
    private float mPath5LineStartY;

    private float maxWidth = TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 330, getResources().getDisplayMetrics());
    private float maxLineH = TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 90, getResources().getDisplayMetrics());
    private float minLineH = TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 5, getResources().getDisplayMetrics());

    private float startOffsetX = TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 5, getResources().getDisplayMetrics());
    private float startOffsetY = TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 5, getResources().getDisplayMetrics());

    private float lineStartOffsetX = TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 8, getResources().getDisplayMetrics());
    private float textStartOffsetX = TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 7, getResources().getDisplayMetrics());

    private float mLastX;
    private float mLastY;
    private float mLastWidth;

    public FunnelView(Context context) {
        this(context, null);
    }

    public FunnelView(Context context, AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public FunnelView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init();
    }

    /**
     * @desc:设置数据
     * @author：Arison on 2016/8/15
     */
    public void setData(List<Integer> moneys, int maxMoney) {
        this.mMoneys = moneys;
        this.maxMoney = maxMoney;
        calculate();
        //int averageHeight = (int) (mTotalHeight / 5);
        invalidate();
    }

    private void calculate() {
        for (int i = 0; i < mMoneys.size(); i++) {
            int money = mMoneys.get(i);
            float scale = (float) money / maxMoney;
            switch (i) {
                case 0:
                    mPath1Height = mTotalHeight * scale * phaseX;
                    if (mPath1Height < minLineH * phaseX) {
                        mPath1Height = minLineH * phaseX;
                    } else if (mPath1Height > maxLineH * phaseX) {
                        mPath1Height = maxLineH * phaseX;
                    }
                    mPath1AngleWidth = mPath1Height / ANGLE_SCALE;
                    //System.out.println("mPath1Height=" + mPath1Height + " ,phaseX=" + phaseX);
                    break;
                case 1:
                    mPath2Height = mTotalHeight * scale * phaseX;
                    if (mPath2Height < minLineH * phaseX) {
                        mPath2Height = minLineH * phaseX;
                    } else if (mPath2Height > maxLineH * phaseX) {
                        mPath2Height = maxLineH * phaseX;
                    }

                    mPath2AngleWidth = mPath2Height / ANGLE_SCALE;

                    //System.out.println("mPath2Height=" + mPath2Height);
                    break;
                case 2:
                    mPath3Height = mTotalHeight * scale * phaseX;
                    if (mPath3Height < minLineH * phaseX) {
                        mPath3Height = minLineH * phaseX;
                    } else if (mPath3Height > maxLineH * phaseX) {
                        mPath3Height = maxLineH * phaseX;
                    }

                    mPath3AngleWidth = mPath3Height / ANGLE_SCALE;

                    //System.out.println("mPath3Height=" + mPath3Height);
                    break;
                case 3:
                    mPath4Height = mTotalHeight * scale * phaseX;
                    if (mPath4Height < minLineH * phaseX) {
                        mPath4Height = minLineH * phaseX;
                    } else if (mPath4Height > maxLineH * phaseX) {
                        mPath4Height = maxLineH * phaseX;
                    }

                    mPath4AngleWidth = mPath4Height / ANGLE_SCALE;

                    //System.out.println("mPath4Height=" + mPath4Height);
                    break;
                case 4:
                    mPath5Height = mTotalHeight * scale * phaseX;
                    if (mPath5Height < minLineH * phaseX) {
                        mPath5Height = minLineH * phaseX;
                    } else if (mPath5Height > maxLineH * phaseX) {
                        mPath5Height = maxLineH * phaseX;
                    }

                    mPath5AngleWidth = mPath5Height / ANGLE_SCALE;

                    //System.out.println("mPath5Height=" + mPath5Height);
                    break;
                case 5:
                    mPath6Height = mTotalHeight * scale * phaseX;
                    if (mPath6Height < minLineH * phaseX) {
                        mPath6Height = minLineH * phaseX;
                    } else if (mPath6Height > maxLineH * phaseX) {
                        mPath6Height = maxLineH * phaseX;
                    }

                    mPath6AngleWidth = mPath6Height / ANGLE_SCALE;
                    break;
                case 6:
                    mPath7Height = mTotalHeight * scale * phaseX;
                    if (mPath7Height < minLineH * phaseX) {
                        mPath7Height = minLineH * phaseX;
                    } else if (mPath7Height > maxLineH * phaseX) {
                        mPath7Height = maxLineH * phaseX;
                    }

                    mPath7AngleWidth = mPath7Height / ANGLE_SCALE;
                    break;
                case 7:
                    mPath8Height = mTotalHeight * scale * phaseX;
                    if (mPath8Height < minLineH * phaseX) {
                        mPath8Height = minLineH * phaseX;
                    } else if (mPath8Height > maxLineH * phaseX) {
                        mPath8Height = maxLineH * phaseX;
                    }

                    mPath8AngleWidth = mPath8Height / ANGLE_SCALE;
                    break;
                case 8:
                    mPath9Height = mTotalHeight * scale * phaseX;
                    if (mPath9Height < minLineH * phaseX) {
                        mPath9Height = minLineH * phaseX;
                    } else if (mPath9Height > maxLineH * phaseX) {
                        mPath9Height = maxLineH * phaseX;
                    }

                    mPath9AngleWidth = mPath9Height / ANGLE_SCALE;
                    break;
                case 9:
                    mPath10Height = mTotalHeight * scale * phaseX;
                    if (mPath10Height < minLineH * phaseX) {
                        mPath10Height = minLineH * phaseX;
                    } else if (mPath10Height > maxLineH * phaseX) {
                        mPath10Height = maxLineH * phaseX;
                    }

                    mPath10AngleWidth = mPath10Height / ANGLE_SCALE;
                    break;
            }

        }
    }

    private void init() {
        mPaint1 = new Paint();
        mPaint2 = new Paint();
        mPaint3 = new Paint();
        mPaint4 = new Paint();
        mPaint5 = new Paint();
        mPaint6 = new Paint();
        mPaint7 = new Paint();
        mPaint8 = new Paint();
        mPaint9 = new Paint();
        mPaint10 = new Paint();
        //FF0000   00CCFF   FFFF00  00FF00    FF00FF   FF9900  993366  C0C0C0  FFCC99
        mPaint1.setColor(Color.parseColor("#FF0000"));
        mPaint1.setStyle(Paint.Style.FILL);
        mPaint1.setDither(true);
        mPaint1.setAntiAlias(true);

        mPaint2.setColor(Color.parseColor("#00CCFF"));
        mPaint2.setStyle(Paint.Style.FILL);
        mPaint2.setDither(true);
        mPaint2.setAntiAlias(true);

        mPaint3.setColor(Color.parseColor("#FFFF00"));
        mPaint3.setStyle(Paint.Style.FILL);
        mPaint3.setDither(true);
        mPaint3.setAntiAlias(true);

        mPaint4.setColor(Color.parseColor("#00FF00"));
        mPaint4.setStyle(Paint.Style.FILL);
        mPaint4.setDither(true);
        mPaint4.setAntiAlias(true);

        mPaint5.setColor(Color.parseColor("#FF00FF"));
        mPaint5.setStyle(Paint.Style.FILL);
        mPaint5.setDither(true);
        mPaint5.setAntiAlias(true);


        mPaint6.setColor(Color.parseColor("#FF9900"));
        mPaint6.setStyle(Paint.Style.FILL);
        mPaint6.setDither(true);
        mPaint6.setAntiAlias(true);


        mPaint7.setColor(Color.parseColor("#993366"));
        mPaint7.setStyle(Paint.Style.FILL);
        mPaint7.setDither(true);
        mPaint7.setAntiAlias(true);


        mPaint8.setColor(Color.parseColor("#C0C0C0"));
        mPaint8.setStyle(Paint.Style.FILL);
        mPaint8.setDither(true);
        mPaint8.setAntiAlias(true);


        mPaint9.setColor(Color.parseColor("#FFCC99"));
        mPaint9.setStyle(Paint.Style.FILL);
        mPaint9.setDither(true);
        mPaint9.setAntiAlias(true);


        mPaint10.setColor(Color.parseColor("#FFCC99"));
        mPaint10.setStyle(Paint.Style.FILL);
        mPaint10.setDither(true);
        mPaint10.setAntiAlias(true);

        mPaintLine = new Paint();
        mPaintText = new Paint();
        mPaintLine.setColor(Color.parseColor("#A8ADB2"));
        mPaintLine.setStyle(Paint.Style.FILL);
        mPaintLine.setStrokeWidth(2);

        mPaintText.setColor(Color.parseColor("#A8ADB2"));
        mPaintText.setTextSize(TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_SP, 14, getResources().getDisplayMetrics()));
        mPaintText.setAntiAlias(true);
        mPaintText.setTextAlign(Paint.Align.LEFT);
    }

    private void draw1(Canvas canvas) {
        mLastX = startOffsetX;
        mLastY = startOffsetY;
        mLastWidth = maxWidth - startOffsetX;

        mPath1 = new Path();
        mPath1.moveTo(mLastX, startOffsetY);
        mPath1.lineTo(mLastX + mLastWidth, startOffsetY);
        mPath1.lineTo(mLastX + mLastWidth - mPath1AngleWidth, mLastY + mPath1Height);
        mPath1.lineTo(mLastX + mPath1AngleWidth, mLastY + mPath1Height);

        mPath1.close();
        canvas.drawPath(mPath1, mPaint1);
        mLastWidth = mLastWidth - 2 * mPath1AngleWidth;
        mLastX = mLastX + mPath1AngleWidth;
        mLastY = mLastY + mPath1Height;
    }


    private void draw2(Canvas canvas) {

        mPath2 = new Path();

        mPath2.moveTo(mLastX, mLastY);
        mPath2.lineTo(mLastX + mLastWidth, mLastY);
        mPath2.lineTo(mLastX + mLastWidth - mPath2AngleWidth, mLastY + mPath2Height);
        mPath2.lineTo(mLastX + mPath2AngleWidth, mLastY + mPath2Height);
        mPath2.close();
        canvas.drawPath(mPath2, mPaint2);

        mLastWidth = mLastWidth - mPath2AngleWidth - mPath2AngleWidth;
        mLastX = mLastX + mPath2AngleWidth;
        mLastY = mLastY + mPath2Height;
    }


    private void draw3(Canvas canvas) {

        mPath3 = new Path();

        mPath3.moveTo(mLastX, mLastY);
        mPath3.lineTo(mLastX + mLastWidth, mLastY);
        mPath3.lineTo(mLastX + mLastWidth - mPath3AngleWidth, mLastY + mPath3Height);
        mPath3.lineTo(mLastX + mPath3AngleWidth, mLastY + mPath3Height);
        mPath3.close();
        canvas.drawPath(mPath3, mPaint3);

        mLastWidth = mLastWidth - mPath3AngleWidth - mPath3AngleWidth;
        mLastX = mLastX + mPath3AngleWidth;
        mLastY = mLastY + mPath3Height;
        mPath3LineStartX = mLastX + mLastWidth + mPath3AngleWidth / 2;
        mPath3LineStartY = mLastY - mPath3Height / 2;
    }

    private void draw4(Canvas canvas) {

        mPath4 = new Path();

        mPath4.moveTo(mLastX, mLastY);
        mPath4.lineTo(mLastX + mLastWidth, mLastY);
        mPath4.lineTo(mLastX + mLastWidth - mPath4AngleWidth, mLastY + mPath4Height);
        mPath4.lineTo(mLastX + mPath4AngleWidth, mLastY + mPath4Height);
        mPath4.close();
        canvas.drawPath(mPath4, mPaint4);

        mLastWidth = mLastWidth - 2 * mPath4AngleWidth;//最新长度
        mLastX = mLastX + mPath4AngleWidth;//第四个点的x坐标
        mLastY = mLastY + mPath4Height;//第四个点的y坐标
        mPath4LineStartX = mLastX + mLastWidth + mPath4AngleWidth / 2;
        mPath4LineStartY = mLastY - mPath4Height / 2;
    }

    private void draw5(Canvas canvas) {
        mPath5 = new Path();

        mPath5.moveTo(mLastX, mLastY);
        mPath5.lineTo(mLastX + mLastWidth, mLastY);
        mPath5.lineTo(mLastX + mLastWidth - mPath5AngleWidth, mLastY + mPath5Height);
        mPath5.lineTo(mLastX + mPath5AngleWidth, mLastY + mPath5Height);
        mPath5.close();
        canvas.drawPath(mPath5, mPaint5);


        //mLastWidth = maxWidth - startOffsetX;
        //mLastX = mLastX;
//        mLastY = mLastY + mPath5Height;
//        mPath5LineStartX = mLastX + mLastWidth;
//        mPath5LineStartY = mLastY - mPath5Height / 2;

        mLastWidth = mLastWidth - 2 * mPath5AngleWidth;//最新长度
        mLastX = mLastX + mPath5AngleWidth;//第四个点的x坐标
        mLastY = mLastY + mPath5Height;//第四个点的y坐标
    }


    private void draw6(Canvas canvas) {
        mPath6 = new Path();
        mPath6.moveTo(mLastX, mLastY);
        mPath6.lineTo(mLastX + mLastWidth, mLastY);
        mPath6.lineTo(mLastX + mLastWidth - mPath6AngleWidth, mLastY + mPath6Height);
        mPath6.lineTo(mLastX + mPath6AngleWidth, mLastY + mPath6Height);
        mPath6.close();
        canvas.drawPath(mPath6, mPaint6);
        mLastWidth = mLastWidth - 2 * mPath6AngleWidth;//最新长度
        mLastX = mLastX + mPath6AngleWidth;//第四个点的x坐标
        mLastY = mLastY + mPath6Height;//第四个点的y坐标
    }


    private void draw7(Canvas canvas) {
        mPath7 = new Path();
        mPath7.moveTo(mLastX, mLastY);
        mPath7.lineTo(mLastX + mLastWidth, mLastY);
        mPath7.lineTo(mLastX + mLastWidth - mPath7AngleWidth, mLastY + mPath7Height);
        mPath7.lineTo(mLastX + mPath7AngleWidth, mLastY + mPath7Height);
        mPath7.close();
        canvas.drawPath(mPath7, mPaint7);
        mLastWidth = mLastWidth - 2 * mPath7AngleWidth;//最新长度
        mLastX = mLastX + mPath7AngleWidth;//第四个点的x坐标
        mLastY = mLastY + mPath7Height;//第四个点的y坐标
    }


    private void draw8(Canvas canvas) {
        mPath8 = new Path();
        mPath8.moveTo(mLastX, mLastY);
        mPath8.lineTo(mLastX + mLastWidth, mLastY);
        mPath8.lineTo(mLastX + mLastWidth - mPath8AngleWidth, mLastY + mPath8Height);
        mPath8.lineTo(mLastX + mPath8AngleWidth, mLastY + mPath8Height);
        mPath8.close();
        canvas.drawPath(mPath8, mPaint8);
        mLastWidth = mLastWidth - 2 * mPath8AngleWidth;//最新长度
        mLastX = mLastX + mPath8AngleWidth;//第四个点的x坐标
        mLastY = mLastY + mPath8Height;//第四个点的y坐标
    }


    private void draw9(Canvas canvas) {
        mPath9 = new Path();
        mPath9.moveTo(mLastX, mLastY);
        mPath9.lineTo(mLastX + mLastWidth, mLastY);
        mPath9.lineTo(mLastX + mLastWidth - mPath9AngleWidth, mLastY + mPath9Height);
        mPath9.lineTo(mLastX + mPath9AngleWidth, mLastY + mPath9Height);
        mPath9.close();
        canvas.drawPath(mPath9, mPaint9);
//        mLastWidth = mLastWidth - 2 * mPath9AngleWidth;//最新长度
//        mLastX = mLastX + mPath9AngleWidth;//第四个点的x坐标
        mLastY = mLastY + mPath9Height;//第四个点的y坐标
    }


    private void draw10(Canvas canvas) {
        mPath10 = new Path();
        mPath10.moveTo(mLastX, mLastY);
        mPath10.lineTo(mLastX + mLastWidth, mLastY);
        mPath10.lineTo(mLastX + mLastWidth - mPath10AngleWidth, mLastY + mPath10Height);
        mPath10.lineTo(mLastX + mPath10AngleWidth, mLastY + mPath10Height);
        mPath10.close();
        canvas.drawPath(mPath10, mPaint10);
        mLastWidth = mLastWidth - 2 * mPath10AngleWidth;//最新长度
        mLastX = mLastX + mPath10AngleWidth;//第四个点的x坐标
        mLastY = mLastY + mPath10Height;//第四个点的y坐标
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        draw1(canvas);
        draw2(canvas);
        draw3(canvas);
        draw4(canvas);
        draw5(canvas);
        draw6(canvas);
        draw7(canvas);
        draw8(canvas);
        draw9(canvas);
        drawText9(canvas);
    }

    public void animateY() {
        ObjectAnimator xAnimator = ObjectAnimator.ofFloat(this, "phaseX", 0, 1);
        xAnimator.setDuration(2000);
        xAnimator.addUpdateListener(this);
        xAnimator.setInterpolator(new AccelerateDecelerateInterpolator());
        xAnimator.start();

        ObjectAnimator alphaAnimator = ObjectAnimator.ofInt(this, "textAlpha", 0, 255);
        alphaAnimator.setDuration(2000);
        //alphaAnimator.addUpdateListener(this);
        alphaAnimator.setInterpolator(new AccelerateDecelerateInterpolator());
        alphaAnimator.start();
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        /*int specMode = MeasureSpec.getMode(heightMeasureSpec);
        int specSize = MeasureSpec.getSize(heightMeasureSpec);

        int height = 0;
        if (specMode == MeasureSpec.EXACTLY) {
            height = specSize;
        } else {
            height = (int) mLastY;
        }
        System.out.println("onMeasure mLastY=" + mLastY);

        setMeasuredDimension(MeasureSpec.getMode(widthMeasureSpec), height);*/
    }

    public float getPhaseX() {
        return phaseX;
    }

    public void setPhaseX(float phaseX) {
        this.phaseX = phaseX;
    }

    public int getTextAlpha() {
        return textAlpha;
    }

    public void setTextAlpha(int textAlpha) {
        this.textAlpha = textAlpha;
    }

    @Override
    public void onAnimationUpdate(ValueAnimator animation) {
        calculate();
        postInvalidate();
    }


    private void drawText1(Canvas canvas) {
        Paint.FontMetrics fontMetrics = mPaintText.getFontMetrics();

        float fontTotalHeight = fontMetrics.bottom - fontMetrics.top;

        float offY = fontTotalHeight / 2 - fontMetrics.bottom;
        //System.out.println("offY=" +offY);
        //float newY = baseY + offY;

        mPaintText.setAlpha(textAlpha);
        canvas.drawText("初期沟通(10%)", maxWidth + textStartOffsetX, mLastY - mPath1Height / 2 + offY, mPaintText);
    }

    private void drawText2(Canvas canvas) {
        Paint.FontMetrics fontMetrics = mPaintText.getFontMetrics();

        float fontTotalHeight = fontMetrics.bottom - fontMetrics.top;

        float offY = fontTotalHeight / 2 - fontMetrics.bottom;
        //float newY = baseY + offY;

        canvas.drawText("立项跟踪(10%)", maxWidth + textStartOffsetX, mLastY - mPath2Height / 2 + offY, mPaintText);
    }

    private void drawLine3(Canvas canvas) {
        canvas.drawLine(mPath3LineStartX + lineStartOffsetX, mPath3LineStartY, maxWidth, mPath3LineStartY, mPaintLine);
    }

    private void drawText3(Canvas canvas) {
        Paint.FontMetrics fontMetrics = mPaintText.getFontMetrics();

        float fontTotalHeight = fontMetrics.bottom - fontMetrics.top;

        float offY = fontTotalHeight / 2 - fontMetrics.bottom;
        //float newY = baseY + offY;

        canvas.drawText("呈报方案(10%)", maxWidth + textStartOffsetX, mLastY - mPath3Height / 2 + offY, mPaintText);
    }

    private void drawLine4(Canvas canvas) {
        canvas.drawLine(mPath4LineStartX + lineStartOffsetX, mPath4LineStartY, maxWidth, mPath4LineStartY, mPaintLine);
    }

    private void drawText4(Canvas canvas) {
        Paint.FontMetrics fontMetrics = mPaintText.getFontMetrics();

        float fontTotalHeight = fontMetrics.bottom - fontMetrics.top;

        float offY = fontTotalHeight / 2 - fontMetrics.bottom;
        //float newY = baseY + offY;

        canvas.drawText("商务谈判(10%)", maxWidth + textStartOffsetX, mLastY - mPath4Height / 2 + offY, mPaintText);
    }


    private void drawText9(Canvas canvas) {
        Paint.FontMetrics fontMetrics = mPaintText.getFontMetrics();

        float fontTotalHeight = fontMetrics.bottom - fontMetrics.top;

        float offY = fontTotalHeight / 2 - fontMetrics.bottom;
        //float newY = baseY + offY;

        canvas.drawText("销售漏斗", mLastX + mLastWidth - mPath9AngleWidth + 3 * textStartOffsetX, mLastY - mPath9Height / 2 + offY, mPaintText);
    }


    private void drawLine5(Canvas canvas) {
        canvas.drawLine(mPath5LineStartX + lineStartOffsetX, mPath5LineStartY, maxWidth, mPath5LineStartY, mPaintLine);
    }

    private void drawText5(Canvas canvas) {
        Paint.FontMetrics fontMetrics = mPaintText.getFontMetrics();

        float fontTotalHeight = fontMetrics.bottom - fontMetrics.top;

        float offY = fontTotalHeight / 2 - fontMetrics.bottom;
        //float newY = baseY + offY;

        canvas.drawText("赢单(10%)", maxWidth + textStartOffsetX, mLastY - mPath5Height / 2 + offY, mPaintText);
    }

}

Arisono
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
Android自定义漏斗图View
tian_321go的博客
12-20 764
import android.app.Activity; import android.content.Intent; import android.graphics.Canvas; import android.graphics.Color; import android.graphics.Paint; import android.graphics.Paint.Style; import a...
Android 自定义漏斗图FunnelView（二）
yundashi168.com
08-29 1821
基于上次静态漏斗图做出改进： 动态添加数据，根据集合数据动态展示；高度根据漏斗图数据自适配，根据数据量多少，漏斗图高度自动适配；顺利添加动画效果；各种手机型号自适配；加文字，加线条等需要的人士，参考早期版本；代码示例改日上传到github上；   下次版本改进：  固定一定布局高度；漏斗图自身高度按比例缩放，不会撑破需求给定的布局高度；增加点击事情，提示漏斗图某数据
android 漏斗 动画,android 漏斗图
weixin_34222309的博客
05-26 311
效果图漏斗图效果核心代码自定义View：FunnelChartimport android.content.Context;import android.graphics.Canvas;import android.graphics.Color;import android.graphics.Paint;import android.graphics.Path;import android.gra...
[数据可视化] 漏斗图(Funnel Chart)
Hudas的博客
09-02 6360
本文主要讲解漏斗图(Funnel Chart)
ECharts漏斗图(详细示例——满满的注释)
GRAY_KEY的博客
04-29 2万+
图表效果如下：代码如下：&lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;(金字塔)漏斗图案例&lt;/title&gt; &lt;!-- 引入 ECharts 文件 --&gt; &lt;script src="
android自定义环形统计图动画
01-03
本文实例为大家分享了android自定义环形统计图动画的具体代码，供大家参考，具体内容如下 一、测试截图 二、实现原理  package com.freedomanlib; import java.util.Timer; import java.util.TimerTask; import ...
Android自定义view实现动态柱状图
01-21
主要功能是可以自定义指定的字体，柱状图颜色，动态效果。 在自定义view public class Histogram extends View { int MAX = 100;//矩形显示的最大值 int corner = 0; //矩形的角度。 设置为0 则没有角度。 ...
Android自定义可左右滑动和点击的折线图
08-26
Android自定义可左右滑动和点击的折线图是一种非常实用的图表控件，能够满足各种项目的需求。通过自定义view，开发者可以自由地设置折线图的样式、颜色、文字大小等属性，实现了高度的自定义性。 首先，在自定义...
Android自定义View实现公交成轨迹图
08-25
Android自定义View实现公交成轨迹图是Android开发中的一种常见需求，特别是在交通类应用程序中。通过自定义View，可以实现复杂的轨迹图，提高应用程序的用户体验。 一、Android自定义View简介 Android自定义View是...
Android自定义双向进度条的实现代码
08-29
Android自定义双向进度条的实现代码是Android开发中非常重要的一部分，本篇文章主要介绍了Android自定义双向进度条的实现代码，非常具有实用的价值。下面将详细讲解Android自定义双向进度条的实现代码。 首先， ...
MPAndroidChartSample散点图
11-22
http://blog.csdn.net/qq_26787115/article/details/53258500
Android自定义圆角条形图表
toaksg的博客
10-05 1329
安卓的图表框架比较常用的有HelloChart和MPAndroidChart。HelloChart据说性能优化比较好，但是我根据我的个人经验，MPAndroidChart能实现的样式比较多。不得不说的是，在实际需求中，无论用哪个框架，把图表样式改得跟UI图一致都要费很大很大很大的力气。当框架无法满足UI需求的效果时，就需要自定义了。
Android自定义散点图View
tian_321go的博客
12-20 1952
import android.app.Activity; import android.graphics.Paint; import android.graphics.Paint.Style; import android.graphics.Canvas; import android.graphics.Color; import android.graphics.Path; import an...
我的Android进阶之旅------>【强力推荐】Android开源图表库XCL-Charts版本发布及展示页...
weixin_33905756的博客
10-16 219
因为要做图表相关的应用，后来百度发现了一个很好的Android开源图表库(XCL-Charts is a free charting library for Android platform.) 下面内容转载于：http://blog....
ios、android 数据可视化图表赏析
05-18 196
NChart3D是最常用的移动开发数据可视化图表框架。具备多种图表类型—柱状 、区域图、线性图、扇形图、圆环图、气泡图、K线图、散点图、雷达图、漏斗图热图等等几十种图表，并且同时支持3D展示，出色的灯光效果...
app用户数据分析基础：【漏斗模型】渠道漏斗公式（渠道 = 流量 x 转化率 x 客单价 x 复购率）的最后一个变量“复购率”。 ​​​
iOS逆向与安全
02-11 1万+
1.1漏斗定义说明 1.1.1事件序列的计算规则 用户要按照预先定义的事件顺序来完成漏斗。假设先前定义的事件序列是A-B-C-D-E，以下举例说明哪些序列会被算做成功的转化。 (1) 用户完成了A-B-C-D-E，友盟会认为这个用户成功完成了A-B-C-D-E。 (2) 用户完成了A-B-C-F-D-E，友盟会认为这个用户成功完成了A-B-C-D-E，只不过是按松散的顺序完成的
推荐Android15个常用的图表库，包含线性，条形柱状，饼状图，扇形，雷达，股票，折线，散点，仪表盘......
热门推荐
杨的博客
07-05 3万+
1.https://github.com/xcltapestry/XCL-Charts Android开源图表库(XCL-Charts is a free charting library for Android platform.)     XCL-Charts基于Android原生Canvas来绘制各种图表,使用简便,定制灵活。     目前支持(3D/非3D,背向式)柱形图(Bar Ch...
写一段android 自定义柱状图代码
最新发布
05-24
以下是一个简单的 Android 自定义柱状图的实现代码，使用 Canvas 和 Paint 绘制： ```java public class BarChartView extends View { private Paint mPaint; private List<Integer> mData; private int ...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Arisono

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值