仿即刻APP点赞桃心的效果

仿即刻APP点赞桃心的效果

2016-12-5更新

• 修改测量逻辑
• 添加了对齐方式
• 添加了一个评论图形的GraphAdapter
• 修改了已知BUG

先看效果图

likeview.gif

使用方法

布局配置

注意,一般不需要直接指定宽高,内部会根据字体大小自动测量

代码配置

        //点赞view的设置
        holder.like.setActivated(entity.isLike);
        holder.like.setNumber(entity.likeNum);
        holder.like.setCallback(new LikeView.SimpleCallback() {
            @Override
            public void activate(LikeView view) {
                Snackbar.make(view, "你觉得" + entity.name + "很赞!", Snackbar.LENGTH_SHORT).show();
            }

            @Override
            public void deactivate(LikeView view) {
                Snackbar.make(view, "你取消了对" + entity.name + "的赞!", Snackbar.LENGTH_SHORT).show();
            }
        });
        //评论view的设置
        holder.comment.setNumber(entity.commentNum);
        //设置图形适配器
        holder.comment.setGraphAdapter(CommentPathAdapter.getInstance());
        holder.comment.setCallback(new LikeView.SimpleCallback(){
            @Override
            public boolean onClick(LikeView view) {
                Snackbar.make(view, "你点击" + entity.name + "的评论按钮", Snackbar.LENGTH_SHORT).show();
                //返回true代表拦截此次点击,不使用默认的点击事件
                return true;
            }
        });

自定义图形适配器

public class CommentPathAdapter implements LikeView.GraphAdapter {
    private static CommentPathAdapter instance;
    private static final float xOffsetScale = 0.06f;
    private static final float yOffsetScale = 0.2f;
    //可用单例模式
    public static CommentPathAdapter getInstance() {
        synchronized (CommentPathAdapter.class) {
            if (null == instance) {
                instance = new CommentPathAdapter();
            }
        }
        return instance;
    }
    //这里绘制你想要的图形
    @Override
    public Path getGraphPath(LikeView view, int length) {
        Path path = new Path();
        int dx = (int) (length * xOffsetScale);
        int dy = (int) (length * yOffsetScale);
        int w = (int) (length * (1 - xOffsetScale * 2));
        int h = (int) (length * (1 - yOffsetScale * 2));
        path.moveTo(dx, dy);
        path.lineTo(dx + w, dy);
        path.lineTo(dx + w, dy + h);
        path.lineTo(dx + (w * 0.35f), dy + h);
        path.lineTo(dx + (w * 0.1f), dy + (h * 1.4f));
        path.lineTo(dx + (w * 0.1f), dy + h);
        path.lineTo(dx, dy + h);
        path.lineTo(dx, dy);
        return path;
    }
}

自定义配置

接口

/**
     * 事件监听接口
     */
    public interface Callback {
        /**
         * 点击事件监听
         *
         * @param view 当前View
         * @return 返回true则代表不使用默认的点击事件
         */
        boolean onClick(LikeView view);

        /**
         * 变为激活状态
         *
         * @param view 当前View
         */
        void activate(LikeView view);

        /**
         * 变为不激活状态
         *
         * @param view 当前View
         */
        void deactivate(LikeView view);
    }
    
    /**
     * 获取图形Path接口
     */
    public interface GraphAdapter {
        /**
         * 获取图形的Path
         *
         * @param view   当前View
         * @param length 可绘制图形区域正方形的边长
         * @return 带有图形的Path
         */
        Path getGraphPath(LikeView view, int length);
    }

声明

此项目为练手项目,当中可能存在BUG,发现BUG请指出,谢谢
github地址 欢迎Star