美文网首页android
Android-推荐一个引导层的开源库(NewbieGuide)

Android-推荐一个引导层的开源库(NewbieGuide)

作者: 阿博聊编程 | 来源:发表于2022-09-02 09:56 被阅读0次
    图片来源网络,入侵必删
    在日常Android业务开发当中,我们肯定会有关于新手引导的需求。我们怎么快速实现呢?这里推荐一个快速实现的框架。

    NewbieGuide

    这是一款可以通过简洁链式调用新手引导层的库,一行代码实现引导层的显示,自动判断首次显示,当然也可以通过参数配置来满足不同的显示逻辑和需求。

    NewbieGuide的引入

    需要在项目级的build.gradle加入:

    allprojects {
            repositories {
                ...
                maven { url 'https://jitpack.io' }
            }
    }
    

    module的build.gradle加入:

     dependencies {
          implementation 'com.github.huburt-Hu:NewbieGuide:v2.4.0'
    }
    

    注意这个库是使用v7包,如果项目是使用AndroidX,是需要自己下载代码重构的。更多具体的信息请看开源库wiki

    简单使用

    NewbieGuide.with(activity)
            .setLabel("guide1")
            .addGuidePage(GuidePage.newInstance()
                .addHighLight(btnSimple)
                .setLayoutRes(R.layout.view_guide_simple))
            .show();
    

    高亮View

    addHighLight方法有多个重写,完整参数如下:

        /**
         * 添加需要高亮的view
         *
         * @param view          需要高亮的view
         * @param shape         高亮形状{@link com.app.hubert.guide.model.HighLight.Shape}
         * @param round         圆角尺寸,单位dp,仅{@link com.app.hubert.guide.model.HighLight.Shape#ROUND_RECTANGLE}有效
         * @param padding       高亮相对view的padding,单位px
         * @param relativeGuide 相对于高亮的引导布局
         */
        public GuidePage addHighLight(View view, HighLight.Shape shape, int round, int padding, @Nullable RelativeGuide relativeGuide)
    

    高亮区域

    有些情况可能不太容易获得高亮view的引用,那么此时可以用添加高亮区域的方式来代替, 计算出需要高亮的view在anchor中位置,将获得的rectF传入addHighLight方法

        /**
         * 添加高亮区域
         *
         * @param rectF         高亮区域,相对于anchor view(默认是android.R.id.content)
         * @param shape         高亮形状{@link com.app.hubert.guide.model.HighLight.Shape}
         * @param round         圆角尺寸,单位dp,仅{@link com.app.hubert.guide.model.HighLight.Shape#ROUND_RECTANGLE}有效
         * @param relativeGuide 相对于高亮的引导布局
         */
        public GuidePage addHighLight(RectF rectF, HighLight.Shape shape, int round, @Nullable RelativeGuide relativeGuide)
    

    显示次数限制

    通常情况下引导页只在用户首次打开app的时候显示,第二次进入时不显示,因此默认只显示一次。当然你也可以通过.setShowCounts(3)自定义显示的次数,调试的时候可以使用.alwaysShow(true)设置每次都显示。

    NewbieGuide.with(activity)
            .setLabel("guide1")
            //.setShowCounts(3)//控制次数
            .alwaysShow(true)//总是显示,调试时可以打开
            .addGuidePage(GuidePage.newInstance()
                .addHighLight(btnSimple)
                .setLayoutRes(R.layout.view_guide_simple))
            .show();
    

    引入布局

    setLayoutRes方法,通常其他的类似的库都是通过代码参数来控制说明内容展示在高亮view相对的位置。

    GuidePage.newInstance()
        .addHighLight(btnDialog)
        .setEverywhereCancelable(false)//是否点击任意位置消失引导页,默认true
        .setLayoutRes(R.layout.view_guide_dialog, R.id.btn_ok)
        .setOnLayoutInflatedListener(new OnLayoutInflatedListener() {
            @Override
            public void onLayoutInflated(View view, Controller controller) {
                TextView tv = view.findViewById(R.id.tv_text);
            }
        })
    

    引导页显示隐藏监听

    NewbieGuide.with(FirstActivity.this)
        .setLabel("listener")
        .alwaysShow(true)//总是显示,调试时可以打开
        .setOnGuideChangedListener(new OnGuideChangedListener() {
            @Override
            public void onShowed(Controller controller) {
                Toast.makeText(FirstActivity.this, "引导层显示", Toast.LENGTH_SHORT).show();
            }
    
            @Override
            public void onRemoved(Controller controller) {
                Toast.makeText(FirstActivity.this, "引导层消失", Toast.LENGTH_SHORT).show();
            }
        })
        .addGuidePage(GuidePage.newInstance().addHighLight(btnListener))
        .show();
    

    多引导页的监听

    .setOnPageChangedListener(new OnPageChangedListener() {
        @Override
        public void onPageChanged(int page) {
             //引导页切换,page为当前页位置,从0开始
            Toast.makeText(MainActivity.this, "引导页切换:" + page, Toast.LENGTH_SHORT).show();
        }
    })
    .addGuidePage(//添加一页引导页
        GuidePage.newInstance()//创建一个实例
           .addHighLight(button)//添加高亮的view
            .addHighLight(tvBottom, HighLight.Shape.RECTANGLE)
            .setLayoutRes(R.layout.view_guide)//设置引导页布局
            .setOnLayoutInflatedListener(new OnLayoutInflatedListener() {
                @Override
                public void onLayoutInflated(View view, Controller controller) {
                    //引导页布局填充后回调,用于初始化
                    TextView tv = view.findViewById(R.id.textView2);
                    tv.setText("我是动态设置的文本");
                }
            })
        .setEnterAnimation(enterAnimation)//进入动画
        .setExitAnimation(exitAnimation)//退出动画
                    )
    .addGuidePage(
          GuidePage.newInstance()
            .addHighLight(tvBottom, HighLight.Shape.RECTANGLE, 20)
            .setLayoutRes(R.layout.view_guide_custom, R.id.iv)//引导页布局,点击跳转下一页或者消失引导层的控件id
           .setEverywhereCancelable(false)//是否点击任意地方跳转下一页或者消失引导层,默认true
            .setBackgroundColor(getResources().getColor(R.color.testColor))//设置背景色,建议使用有透明度的颜色
            .setEnterAnimation(enterAnimation)//进入动画
            .setExitAnimation(exitAnimation)//退出动画
        )
    

    引导页切换动画

    Animation enterAnimation = new AlphaAnimation(0f, 1f);
    enterAnimation.setDuration(600);
    enterAnimation.setFillAfter(true);
    
    Animation exitAnimation = new AlphaAnimation(1f, 0f);
    exitAnimation.setDuration(600);
    exitAnimation.setFillAfter(true);
    
    GuidePage.setEnterAnimation(enterAnimation)//进入动画
    GuidePage.setExitAnimation(exitAnimation)//退出动画
    

    相关文章

      网友评论

        本文标题:Android-推荐一个引导层的开源库(NewbieGuide)

        本文链接:https://www.haomeiwen.com/subject/jcvenrtx.html