Highlight：Android应用功能引导高亮库的终极解决方案-优快云博客

Highlight：Android应用功能引导高亮库的终极解决方案

【免费下载链接】Highlight 一个用于app指向性功能高亮的库项目地址: https://gitcode.com/gh_mirrors/hig/Highlight

还在为Android应用的新功能引导、用户指引而烦恼吗？Highlight库为你提供了一套完整、灵活且易用的高亮引导解决方案，让应用的用户体验瞬间提升！

什么是Highlight？

Highlight是一个专为Android应用设计的指向性功能高亮库，它能够：

🎯 精准高亮：精确标记应用中的任何View控件
🚀 多模式支持：支持普通模式和下一步模式
🎨 自定义形状：提供矩形、圆形、椭圆等多种高亮形状
📱 全屏/局部：支持全屏蒙版和局部区域高亮
🔧 高度可定制：完全自定义提示布局和位置

核心特性一览

特性	描述	优势
多模式引导	支持单次显示和分步引导	适应不同场景需求
形状多样化	矩形、圆形、椭圆及自定义形状	视觉体验丰富
精确定位	提供多种位置回调类	提示位置精准控制
事件拦截	可配置是否拦截触摸事件	交互控制灵活
自动布局	支持界面加载完成后自动显示	使用更方便

快速开始

添加依赖

dependencies {
    implementation 'com.isanwenyu.highlight:highlight:1.8.0'
}

基础使用示例

// 创建高亮实例
HighLight highLight = new HighLight(MainActivity.this)
    .anchor(findViewById(R.id.id_container)) // 设置锚点视图
    .addHighLight(R.id.target_view, R.layout.tip_layout, 
        new OnRightPosCallback(10), new CircleLightShape())
    .show();

两种核心模式详解

1. 普通模式 (Normal Mode)

普通模式适用于单次性的功能提示，用户点击后立即消失：

public void showSingleTip(View view) {
    mHighLight = new HighLight(MainActivity.this)
        .autoRemove(true) // 点击自动移除
        .intercept(true)  // 拦截触摸事件
        .setClickCallback(new HighLight.OnClickCallback() {
            @Override
            public void onClick() {
                Toast.makeText(MainActivity.this, "功能提示已关闭", Toast.LENGTH_SHORT).show();
            }
        })
        .addHighLight(R.id.btn_feature, R.layout.info_tip, 
            new OnBottomPosCallback(20), new RectLightShape())
        .show();
}

2. 下一步模式 (Next Mode)

下一步模式支持多步骤引导，用户按顺序查看每个功能点：

public void showMultiStepGuide() {
    mHighLight = new HighLight(MainActivity.this)
        .autoRemove(false)
        .enableNext() // 启用下一步模式
        .setOnNextCallback(new HighLightInterface.OnNextCallback() {
            @Override
            public void onNext(HightLightView hightLightView, View targetView, View tipView) {
                // 处理每一步的回调
                updateStepIndicator(currentStep);
            }
        })
        .addHighLight(R.id.step1, R.layout.step1_tip, new OnRightPosCallback(), new CircleLightShape())
        .addHighLight(R.id.step2, R.layout.step2_tip, new OnTopPosCallback(), new OvalLightShape())
        .addHighLight(R.id.step3, R.layout.step3_tip, new OnLeftPosCallback(), new RectLightShape())
        .show();
}

// 切换到下一步
public void nextStep(View view) {
    if (mHighLight.isShowing() && mHighLight.isNext()) {
        mHighLight.next();
    }
}

高亮形状定制

Highlight提供了丰富的高亮形状选项：

内置形状类

mermaid

自定义形状示例

// 创建自定义高亮形状
BaseLightShape customShape = new BaseLightShape(5, 5, 10) {
    @Override
    protected void resetRectF4Shape(RectF viewPosInfoRectF, float dx, float dy) {
        // 调整高亮区域大小
        viewPosInfoRectF.inset(dx, dy);
    }

    @Override
    protected void drawShape(Bitmap bitmap, HighLight.ViewPosInfo viewPosInfo) {
        Canvas canvas = new Canvas(bitmap);
        Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);
        paint.setDither(true);
        paint.setAntiAlias(true);
        
        if (blurRadius > 0) {
            paint.setMaskFilter(new BlurMaskFilter(blurRadius, BlurMaskFilter.Blur.SOLID));
        }
        
        // 绘制圆角矩形
        RectF rectF = viewPosInfo.rectF;
        canvas.drawRoundRect(rectF, 20, 20, paint);
    }
};

位置控制策略

Highlight提供了多种位置回调类来精确控制提示布局的位置：

位置回调类	描述	适用场景
`OnBaseCallback`	基础回调类	需要完全自定义位置
`OnRightPosCallback`	右侧位置	按钮在左侧时
`OnLeftPosCallback`	左侧位置	按钮在右侧时
`OnTopPosCallback`	上方位置	按钮在下方时
`OnBottomPosCallback`	下方位置	按钮在上方时

// 使用预置位置回调
.addHighLight(R.id.target_view, R.layout.tip_layout, 
    new OnRightPosCallback(15), // 右侧显示，间距15dp
    new CircleLightShape())

实战应用场景

场景1：新用户引导

public void showNewUserGuide() {
    mHighLight = new HighLight(MainActivity.this)
        .enableNext()
        .setOnLayoutCallback(new HighLightInterface.OnLayoutCallback() {
            @Override
            public void onLayouted() {
                // 界面布局完成后添加引导步骤
                mHighLight.addHighLight(R.id.btn_profile, R.layout.guide_profile, 
                    new OnRightPosCallback(), new CircleLightShape())
                    .addHighLight(R.id.btn_settings, R.layout.guide_settings,
                        new OnBottomPosCallback(), new OvalLightShape())
                    .addHighLight(R.id.btn_help, R.layout.guide_help,
                        new OnTopPosCallback(), new RectLightShape());
                mHighLight.show();
            }
        });
}

场景2：新功能提示

public void highlightNewFeature(View featureView) {
    new HighLight(MainActivity.this)
        .addHighLight(featureView, R.layout.new_feature_tip,
            new OnBottomPosCallback(10), new CircleLightShape(0, 0, 8))
        .setOnRemoveCallback(new HighLightInterface.OnRemoveCallback() {
            @Override
            public void onRemove() {
                // 用户查看后标记为已读
                markFeatureAsSeen();
            }
        })
        .show();
}

高级配置选项

事件监听配置

// 完整的监听器配置
mHighLight = new HighLight(MainActivity.this)
    .setOnShowCallback(new HighLightInterface.OnShowCallback() {
        @Override
        public void onShow(HightLightView hightLightView) {
            // 高亮显示时触发
            trackGuideDisplay();
        }
    })
    .setOnRemoveCallback(new HighLightInterface.OnRemoveCallback() {
        @Override
        public void onRemove() {
            // 高亮移除时触发
            trackGuideCompletion();
        }
    })
    .setOnNextCallback(new HighLightInterface.OnNextCallback() {
        @Override
        public void onNext(HightLightView hightLightView, View targetView, View tipView) {
            // 下一步切换时触发
            updateProgress(targetView.getId());
        }
    });

样式自定义配置

// 高级样式配置
mHighLight = new HighLight(MainActivity.this)
    .maskColor(0x80000000) // 半透明黑色蒙版
    .autoRemove(false)     // 手动控制移除
    .intercept(true)       // 拦截触摸事件
    .anchor(specificView)  // 指定锚点视图
    .setClickCallback(new HighLight.OnClickCallback() {
        @Override
        public void onClick() {
            // 自定义点击处理
            handleCustomClick();
        }
    });

常见问题解决方案

问题1：提示布局位置不正确

解决方案：使用合适的PositionCallback并调整偏移量

// 调整右侧提示的位置
new OnRightPosCallback(20) // 增加右边距

// 调整下方提示的位置  
new OnBottomPosCallback(30) // 增加下边距

问题2：高亮形状需要自定义

解决方案：继承BaseLightShape实现自定义绘制逻辑

public class CustomLightShape extends BaseLightShape {
    public CustomLightShape(float dx, float dy, float blurRadius) {
        super(dx, dy, blurRadius);
    }

    @Override
    protected void resetRectF4Shape(RectF rectF, float dx, float dy) {
        rectF.inset(dx, dy);
    }

    @Override
    protected void drawShape(Bitmap bitmap, ViewPosInfo viewPosInfo) {
        // 自定义绘制逻辑
    }
}

问题3：在ViewPager中使用异常

解决方案：使用v1.7.2+版本并正确计算位置

new BaseLightShape() {
    @Override
    protected void resetRectF4Shape(RectF rectF, float dx, float dy) {
        // 处理ViewPager中的位置计算
        rectF.offsetTo(rectF.left % screenWidth, rectF.top);
    }
}

版本特性演进

版本	重要特性	发布日期
v1.8.0	添加OnLayoutCallback支持	2017/5/25
v1.7.0	下一个回调监听器	2016/11/25
v1.6.0	椭圆形状支持	2016/11/16
v1.5.0	接口约束优化	2016/11/01
v1.4.0	自定义高亮形状	2016/10/27
v1.3.0	Next模式支持	2016/10/5

最佳实践建议

性能优化：避免在滚动视图中频繁创建HighLight实例
内存管理：及时调用remove()方法释放资源
用户体验：合理控制引导步骤数量，通常3-5步为宜
兼容性：测试在不同Android版本和设备上的表现
可访问性：确保高亮内容对屏幕阅读器友好

总结

Highlight库为Android应用提供了强大而灵活的功能引导解决方案，无论是简单的单点提示还是复杂的多步骤引导，都能轻松应对。其丰富的定制选项和良好的扩展性使得开发者可以根据具体需求创建出完美的用户引导体验。

通过合理的配置和使用，Highlight能够显著提升应用的用户体验，降低新功能的学习成本，是每个Android开发者工具箱中不可或缺的利器。

立即集成Highlight，让你的应用引导体验更上一层楼！

【免费下载链接】Highlight 一个用于app指向性功能高亮的库项目地址: https://gitcode.com/gh_mirrors/hig/Highlight

创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考