高仿猫眼电影Logo图标

Posted FightSeeker

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了高仿猫眼电影Logo图标相关的知识,希望对你有一定的参考价值。

上面是原图,下面是代码实现的高仿。

源码如下:

package com.lingyun.loaddemo;

import android.content.Context;
import android.content.res.Resources;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Path;
import android.graphics.RectF;
import android.util.AttributeSet;
import android.util.DisplayMetrics;
import android.util.TypedValue;
import android.view.View;

/**
 * Created by dandy on 2016/6/14.
 */
public class Cat extends View 

    private static final float SIZE = 60f;//默认大小

    private DisplayMetrics dm;

    private Paint paint,nosePaint,whiskerPaint;

    private  int exactlySize;

    private float size = SIZE;

    private RectF oval = new RectF();

    private Path mPath = new Path();

    private float center;

    private float noseSharp;//鼻尖宽度(就是那个小圆点)

    private float eyeRadius;

    private  float eyeDiameter;

    public Cat(Context context,AttributeSet attributeSet)
        super(context, attributeSet);
        setUpInit(attributeSet);
    

    private void setUpInit(AttributeSet set)
        dm = Resources.getSystem().getDisplayMetrics();
        paint = new Paint();
        paint.setAntiAlias(true);
        paint.setStrokeCap(Paint.Cap.ROUND);

        nosePaint = new Paint();
        nosePaint.setColor(Color.RED);
        nosePaint.setAntiAlias(true);
        nosePaint.setStyle(Paint.Style.STROKE);
        nosePaint.setStrokeCap(Paint.Cap.ROUND);

        whiskerPaint = new Paint();
        whiskerPaint.setColor(Color.WHITE);
        whiskerPaint.setAntiAlias(true);
        whiskerPaint.setStyle(Paint.Style.STROKE);
        whiskerPaint.setStrokeCap(Paint.Cap.ROUND);
    

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) 
        /**计算宽**/
        final int widthMode = MeasureSpec.getMode(widthMeasureSpec);
        int width = MeasureSpec.getSize(widthMeasureSpec);
        if(widthMode == MeasureSpec.UNSPECIFIED || widthMode == MeasureSpec.AT_MOST)
            width = applyDimension(size);
        

        /**计算高**/
        final int heightMode = MeasureSpec.getMode(heightMeasureSpec);
        int height = MeasureSpec.getSize(heightMeasureSpec);
        if (heightMode == MeasureSpec.UNSPECIFIED || heightMode == MeasureSpec.AT_MOST) 
            height = applyDimension(size);
        

        /**
         * 取小的值作为控件的大小
         */
        exactlySize = width >= height ? height:width;

        center = exactlySize / 2.0f;

        noseSharp = exactlySize / 16.0f;

        eyeRadius = center / 4.0f;

        eyeDiameter = eyeRadius * 2.0f;

        nosePaint.setStrokeWidth(applyDimension(1.5f)*exactlySize / applyDimension(size));
        whiskerPaint.setStrokeWidth(applyDimension(2.0f)*exactlySize / applyDimension(size));

        setMeasuredDimension(exactlySize, exactlySize);
    

    @Override
    protected void onDraw(Canvas canvas) 
        drawBackCicle(canvas);
        drawWhiskers(canvas);
        drawFace(canvas);
        drawEyes(canvas);
        drawNose(canvas);
        drawEars(canvas);
        super.onDraw(canvas);
    

    private void drawBackCicle(Canvas canvas)
        canvas.save();
        canvas.translate(center, center);
        oval.set(-center, -center, center, center);
        paint.setColor(Color.RED);
        canvas.drawRoundRect(oval, center, center, paint);
        canvas.restore();
    

    private void drawFace(Canvas canvas)
        canvas.save();
        canvas.translate(center,center);
        oval.set(-center * 0.7f, -center * 0.5f, center * 0.7f, center*0.7f);
        paint.setColor(Color.WHITE);
        canvas.drawOval(oval, paint);
        canvas.restore();
    

    private void drawEyes(Canvas canvas)
        canvas.save();
        canvas.translate(center, center);
        final float eyeLineWidth = eyeRadius / 1.5f;
        paint.setColor(Color.RED);
        //left eye
        oval.set(-(noseSharp / 2.0f + eyeDiameter), -eyeRadius / 2.0f, -noseSharp / 2.0f, eyeDiameter - eyeRadius / 2.0f);
        canvas.drawRoundRect(oval, eyeRadius, eyeRadius, paint);
        //right eye
        oval.set(noseSharp / 2.0f, -eyeRadius / 2.0f, noseSharp / 2.0f+eyeDiameter, eyeDiameter- eyeRadius / 2.0f);
        canvas.drawRoundRect(oval, eyeRadius, eyeRadius, paint);
        paint.setColor(Color.WHITE);
        //left eyeLine
        oval.set(-(noseSharp / 2.0f + eyeRadius + eyeLineWidth / 6.0f), -eyeRadius / 2.0f + eyeLineWidth/1.5f,
                -(noseSharp / 2.0f + eyeRadius - eyeLineWidth / 6.0f), eyeDiameter - eyeRadius / 2.0f - eyeLineWidth/1.5f);
        canvas.drawRect(oval,paint);
        //right eyeLine
        oval.set((noseSharp / 2.0f + eyeRadius - eyeLineWidth / 6.0f), -eyeRadius / 2.0f + eyeLineWidth/1.5f,
                (noseSharp / 2.0f + eyeRadius + eyeLineWidth / 6.0f), eyeDiameter - eyeRadius / 2.0f - eyeLineWidth/1.5f);
        canvas.drawRect(oval,paint);
        canvas.restore();
    

    private void drawNose(Canvas canvas)
        nosePaint.setColor(Color.RED);
        canvas.save();
        canvas.translate(center, center);
        //鼻尖底部比眼睛底部稍低一些
        final float noseBottom = 3.0f * center / 7.0f;
        oval.set(-noseSharp / 1.5f, noseBottom - noseSharp, noseSharp / 1.5f, noseBottom);
        paint.setColor(Color.RED);
        canvas.drawOval(oval, paint);
        //鼻孔
        final float diameter = center / 4.0f;
        oval.set(-diameter, noseBottom - noseSharp, 0, noseBottom - noseSharp + diameter/1.2f);
        canvas.drawArc(oval, -25, 240, false, nosePaint);
        oval.set(0, noseBottom - noseSharp, diameter, noseBottom - noseSharp + diameter/1.2f);
        canvas.drawArc(oval, -25, 240, false, nosePaint);
        canvas.restore();
    

    private void drawEars(Canvas canvas)
        paint.setColor(Color.WHITE);
        canvas.save();
        canvas.translate(center, center);
        //先确定三个点的坐标
        //左下
        final float leftBottomX = -(noseSharp / 2.0f + eyeDiameter);
        final float leftBottomY = - eyeRadius / 2.0f;
        //左中
        final float leftCenterX = leftBottomX + center / 20.0f;
        final float leftCenterY = leftBottomY - center / 2.0f;
        //左上
        final float leftTopX = -(noseSharp / 2.0f + eyeRadius*0.6f);
        final float leftTopY = leftBottomY - center / 4.0f;
        mPath.reset();
        mPath.moveTo(leftBottomX, leftBottomY);
        mPath.quadTo(leftBottomX - center / 20.0f, leftBottomY - center / 4.0f, leftCenterX, leftCenterY);
        mPath.quadTo(-(noseSharp / 2.0f + eyeRadius*0.5f),leftBottomY - center / 2.5f,leftTopX,leftTopY);
        canvas.drawPath(mPath,paint);
        //右下
        final float rightBottomX = noseSharp / 2.0f + eyeDiameter;
        final float rightBottomY = - eyeRadius / 2.0f;
        //右中
        final float rightCenterX = rightBottomX - center / 20.0f;
        final float rightCenterY = rightBottomY - center / 2.0f;
        //右上
        final float rightTopX = noseSharp / 2.0f + eyeRadius*0.6f;
        final float rightTopY = rightBottomY - center / 4.0f;
        mPath.reset();
        mPath.moveTo(rightBottomX, rightBottomY);
        mPath.quadTo(rightBottomX + center / 20.0f, rightBottomY - center / 4.0f, rightCenterX, rightCenterY);
        mPath.quadTo(noseSharp / 2.0f + eyeRadius*0.5f,leftBottomY - center / 2.5f,rightTopX,rightTopY);
        canvas.drawPath(mPath,paint);
        canvas.restore();
    

    private void drawWhiskers(Canvas canvas)
        canvas.save();
        canvas.translate(center, center);
        oval.set(-center, 0.3f * center, center, 0.4f * center);
        canvas.drawArc(oval, 202, 135, false, whiskerPaint);
        oval.set(-center, 0.36f * center, center, 0.7f * center);
        canvas.drawArc(oval, 208, 125, false, whiskerPaint);
        oval.set(-center, 0.43f * center, center,center);
        canvas.drawArc(oval, 215, 110, false, whiskerPaint);
        canvas.restore();
    


    @Override
    protected void onLayout(boolean changed, int left, int top, int right, int bottom) 
        super.onLayout(changed, left, top, right, bottom);
    

    /**
     * px2dp
     * @param value
     */
    private int applyDimension(float value)
        return (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, value, dm);
    




以上是关于高仿猫眼电影Logo图标的主要内容,如果未能解决你的问题,请参考以下文章

微信小程序框架分析小练手——猫眼电影底部标签导航制作

猫眼查到的电影是不是会上映?

爬取猫眼电影

python爬取猫眼代码没

Web爬虫|入门实战之猫眼电影

爬取猫眼电影数据