引导页高亮显示

引入第三方依赖 implementation ‘com.isanwenyu.highlight:highlight:1.8.0’
MainActivity2

import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Toast;
import com.oplayer.orunningplus.R;
import zhy.com.highlight.HighLight;
import zhy.com.highlight.interfaces.HighLightInterface;
import zhy.com.highlight.position.OnBottomPosCallback;
import zhy.com.highlight.position.OnLeftPosCallback;
import zhy.com.highlight.position.OnRightPosCallback;
import zhy.com.highlight.shape.CircleLightShape;
import zhy.com.highlight.shape.OvalLightShape;
import zhy.com.highlight.shape.RectLightShape;
import zhy.com.highlight.view.HightLightView;

public class MainActivity2 extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main2);
        showNextTipViewOnCreated();
    }
    HighLight mHightLight;
    /**
     * 显示 next模式 我知道了提示高亮布局
     * @param view id为R.id.iv_known的控件
     * @author isanwenyu@163.com
     */
    public  void showNextKnownTipView(View view) {
        mHightLight = new HighLight(MainActivity2.this)//
                .autoRemove(false)//设置背景点击高亮布局自动移除为false 默认为true
//                .intercept(false)//设置拦截属性为false 高亮布局不影响后面布局的滑动效果
                .intercept(true)//拦截属性默认为true 使下方ClickCallback生效
                //.enableNext()//开启next模式并通过show方法显示 然后通过调用next()方法切换到下一个提示布局,直到移除自身
                .setClickCallback(new HighLight.OnClickCallback() {
                    @Override
                    public void onClick() {
                        Toast.makeText(MainActivity2.this, "clicked and remove HightLight view by yourself", Toast.LENGTH_SHORT).show();
                       // mHightLight.next();
                    }
                })
               // .anchor(findViewById(R.id.id_container))//如果是Activity上增加引导层,不需要设置anchor
                .addHighLight(R.id.rl_smartWatch_novel,R.layout.activity_main2,new OnLeftPosCallback(45),new RectLightShape(0,0,15,0,0)) //矩形去除圆角
                .addHighLight(R.id.rl_smartWatch_novel,R.layout.info_known,new OnBottomPosCallback(100),new RectLightShape(0,0,15,0,0)) ;
        mHightLight.show();
    }
    /**
     * 响应所有R.id.iv_known的控件的点击事件
     * <p>
     *  移除高亮布局
     * </p>
     *
     * @param view
     */
    public void clickKnown(View view)
    {
        Toast.makeText(MainActivity2.this, "clicked and show next tip vie", Toast.LENGTH_SHORT).show();
        if(mHightLight.isShowing() && mHightLight.isNext())//如果开启next模式
        {
            //mHightLight.next();
            Toast.makeText(MainActivity2.this, "clicked and show next tip vie", Toast.LENGTH_SHORT).show();

        }else
        {
          //  remove(null);
        }
    }
    public void clickKnown2(View view)
    {
        Toast.makeText(MainActivity2.this, "clicked and show next tip vie22", Toast.LENGTH_SHORT).show();
        if(mHightLight.isShowing() && mHightLight.isNext())//如果开启next模式
        {
            //mHightLight.next();
            Toast.makeText(MainActivity2.this, "clicked and show next tip vie", Toast.LENGTH_SHORT).show();

        }else
        {
            //  remove(null);
        }
    }
    /**
     * 下一个回调监听 只有Next模式下生效
     */
    public static interface OnNextCallback extends HighLightInterface.OnNextCallback {
        /**
         * 监听下一步动作
         *
         * @param hightLightView 高亮布局控件
         * @param targetView     高亮目标控件
         * @param tipView        高亮提示控件
         */
        void onNext(HightLightView hightLightView, View targetView, View tipView);
    }

    /**
     * 当界面布局完成显示next模式提示布局
     * 显示方法必须在onLayouted中调用
     * 适用于Activity及Fragment中使用
     * 可以直接在onCreated方法中调用
     * @author isanwenyu@163.com
     */
    public  void showNextTipViewOnCreated(){
        mHightLight = new HighLight(MainActivity2.this)//
                //.anchor(findViewById(R.id.id_container))//如果是Activity上增加引导层,不需要设置anchor
                .autoRemove(false)
                //.enableNext()
                .setOnLayoutCallback(new HighLightInterface.OnLayoutCallback() {
                    @Override
                    public void onLayouted() {
                        //mAnchor界面布局完成添加tipview
//                        mHightLight.addHighLight(R.id.btn_rightLight,R.layout.info_gravity_left_down,new OnLeftPosCallback(45),new RectLightShape())
//                                .addHighLight(R.id.btn_light,R.layout.info_gravity_left_down,new OnRightPosCallback(5),new CircleLightShape())
//                                .addHighLight(R.id.btn_bottomLight,R.layout.info_gravity_left_down,new OnTopPosCallback(),new CircleLightShape());
                        mHightLight.addHighLight(R.id.rl_smartWatch_novel,R.layout.activity_main2,new OnLeftPosCallback(45),new RectLightShape(0,0,15,0,0)) //矩形去除圆角
                                .addHighLight(R.id.rl_smartWatch_novel,R.layout.info_known,new OnBottomPosCallback(100),new RectLightShape(0,0,15,0,0)) ;
                        //然后显示高亮布局
                        mHightLight.show();
                    }
                })
                .setClickCallback(new HighLight.OnClickCallback() {
                    @Override
                    public void onClick() {
                        Toast.makeText(MainActivity2.this, "clicked and show next tip view by yourself", Toast.LENGTH_SHORT).show();
                        mHightLight.next();
                    }
                });
    }
    /**
     * 显示我知道了提示高亮布局
     * @param view id为R.id.iv_known的控件
     * @author isanwenyu@163.com
     */
    public  void showKnownTipView(View view) {
        mHightLight = new HighLight(MainActivity2.this)//
                .autoRemove(false)//设置背景点击高亮布局自动移除为false 默认为true
                .intercept(false)//设置拦截属性为false 高亮布局不影响后面布局的滑动效果 而且使下方点击回调失效
                .setClickCallback(new HighLight.OnClickCallback() {
                    @Override
                    public void onClick() {
                        Toast.makeText(MainActivity2.this, "clicked and remove HightLight view by yourself", Toast.LENGTH_SHORT).show();
                       // remove(null);
                    }
                })
               // .anchor(findViewById(R.id.id_container))//如果是Activity上增加引导层,不需要设置anchor
                .anchor(findViewById(R.id.id_container))//如果是Activity上增加引导层,不需要设置anchor
                .addHighLight(R.id.btn_rightLight,R.layout.info_down,new OnLeftPosCallback(45),new RectLightShape())
                .addHighLight(R.id.btn_light,R.layout.info_down,new OnRightPosCallback(5),new CircleLightShape(0,0,0))
               // .addHighLight(R.id.btn_bottomLight,R.layout.info_down,new OnTopPosCallback(),new CircleLightShape())
                .addHighLight(view,R.layout.info_down,new OnBottomPosCallback(10),new OvalLightShape(5,5,20));
        mHightLight.show();
//        //added by isanwenyu@163.com 设置监听器只有最后一个添加到HightLightView的knownView响应了事件
//        //优化方案:在布局中声明onClick方法 {@link #clickKnown(view)}响应所有R.id.iv_known的控件的点击事件
//        View decorLayout = mHightLight.getHightLightView();
//        ImageView knownView = (ImageView) decorLayout.findViewById(R.id.iv_known);
//        knownView.setOnClickListener(new View.OnClickListener() {
//            @Override
//            public void onClick(View view) {
                remove(null);
//                Toast.makeText(MainActivity2.this, "clicked and remove", Toast.LENGTH_SHORT).show();
//
//            }
//        });
    }

}```

```xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/id_container">

    <Button
        android:id="@+id/btn_show_known_tip"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_marginStart="10dp"
        android:layout_marginTop="10dp"
        android:layout_marginEnd="10dp"
        android:layout_marginBottom="10dp"
        android:onClick="showKnownTipView"
        android:text="showKnownTip" />

    <Button
        android:id="@+id/btn_show_next_known_tip"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/btn_show_known_tip"
        android:layout_alignParentLeft="true"
        android:layout_marginStart="10dp"
        android:layout_marginTop="10dp"
        android:layout_marginEnd="10dp"
        android:layout_marginBottom="10dp"
        android:onClick="showNextKnownTipView"
        android:text="showNextKnownTip" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="250dp"
        android:orientation="vertical">


        <RelativeLayout
            android:id="@+id/rl_settings_disconn_novel"
            android:layout_width="match_parent"
            android:layout_height="55dp"
            android:layout_below="@+id/rl_name_novel"
            android:layout_marginLeft="5dp"
            android:layout_marginTop="1dp"
            android:layout_marginRight="5dp"
            android:orientation="vertical">

            <ImageView
                android:id="@+id/iv_settings_disconn_novel"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_alignParentStart="true"
                android:layout_marginStart="15dp"
                android:src="@mipmap/today_connect" />

            <com.oplayer.orunningplus.view.them.ThemeTextView
                android:id="@+id/tv_settings_disconn_novel"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_marginStart="30dp"
                android:layout_toEndOf="@+id/iv_settings_disconn_novel"
                android:gravity="center_vertical"
                android:text="@string/settings_disconn"
                app:textFont="3"
                app:textSize="18" />

            <ImageView
                android:id="@+id/iv_arrow_disconn_novel"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_alignParentEnd="true"
                android:layout_marginEnd="5dp"
                android:src="@mipmap/settings_arrow" />

            <include layout="@layout/layout_line" />
        </RelativeLayout>

        <RelativeLayout
            android:id="@+id/rl_smartWatch_novel"
            android:layout_width="match_parent"
            android:layout_height="55dp"
            android:layout_below="@+id/rl_name_novel"
            android:layout_marginLeft="5dp"
            android:layout_marginRight="5dp"
            android:orientation="vertical">

            <ImageView
                android:id="@+id/iv_icon_smartWatch_novel"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_alignParentStart="true"
                android:layout_marginStart="15dp"
                android:src="@mipmap/settings_smartwatchsettings" />

            <com.oplayer.orunningplus.view.them.ThemeTextView
                android:id="@+id/tv_smartWatch_novel_name"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_marginStart="30dp"
                android:layout_toEndOf="@+id/iv_icon_smartWatch_novel"
                android:gravity="center_vertical"
                android:text="@string/newTypeSetting_smartWatch"
                app:textFont="3"
                app:textSize="18" />

            <ImageView
                android:id="@+id/iv__smartWatch_novelarrow"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_alignParentEnd="true"
                android:layout_marginEnd="5dp"
                android:src="@mipmap/settings_arrow" />

            <include layout="@layout/layout_line" />
        </RelativeLayout>

        <RelativeLayout
            android:id="@+id/rl_activityWellness_novel"
            android:layout_width="match_parent"
            android:layout_height="55dp"
            android:layout_below="@+id/rl_smartWatch_novel"
            android:layout_marginLeft="5dp"
            android:layout_marginTop="1dp"
            android:layout_marginRight="5dp"
            android:orientation="vertical"
            android:visibility="visible"
            app:cardElevation="2dp">

            <ImageView
                android:id="@+id/iv_icon_activityWellness_novel"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_alignParentStart="true"
                android:layout_marginStart="15dp"
                android:src="@mipmap/wellness" />

            <com.oplayer.orunningplus.view.them.ThemeTextView
                android:id="@+id/tv_activityWellness_novel_name"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_marginStart="30dp"
                android:layout_toEndOf="@+id/iv_icon_activityWellness_novel"
                android:gravity="center_vertical"
                android:text="@string/newTypeSetting_activityWellness"
                app:textFont="3"
                app:textSize="18" />

            <ImageView
                android:id="@+id/iv__activityWellness_novelarrow"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_alignParentEnd="true"
                android:layout_marginEnd="5dp"
                android:src="@mipmap/settings_arrow" />

            <include layout="@layout/layout_line" />
        </RelativeLayout>

        <ImageView
            android:id="@+id/iv_icon_bgkkkkk"
            android:layout_width="match_parent"
            android:layout_height="200dp"
            android:layout_alignParentStart="true"
            android:layout_marginStart="15dp"
            android:src="@mipmap/wellness"
            android:visibility="gone" />
    </LinearLayout>


    <Button
        android:id="@+id/btn_light"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_marginTop="200dp"
        android:text="高亮按钮" />


    <Button
        android:id="@+id/btn_rightLight"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="290dp"
        android:layout_alignParentRight="true"
        android:text="高亮按钮1" />


    <Button
        android:id="@+id/btn_bottomLight"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:visibility="gone"
        android:layout_alignParentBottom="true"
        android:layout_marginLeft="30dp"
        android:layout_marginBottom="60dp"
        android:text="高亮按钮2" />

</RelativeLayout>

info_known.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="300dp"
    android:layout_height="wrap_content"
    xmlns:tools="http://schemas.android.com/tools"
    tools:context=".function.main.settings.SettingsFragment"
    android:orientation="vertical">
    <TextView
        android:id="@+id/id_iv_tip"
        android:layout_width="250dp"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:text="profile_nameprofile_nameprofile_name"
        android:textSize="20sp"
        android:textColor="@color/white"
        />
    <TextView
        android:id="@+id/iv_known"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/id_iv_tip"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="10dp"
        android:text="我知道了"
        android:textColor="@color/white"
        android:gravity="center"
        android:paddingRight="10dp"
        android:background="@mipmap/sportpush_square" />

</LinearLayout>

<!--copy from layout/info_gravity_left_down.xml-->

fragment使用方法

    open fun showNextTipViewOnCreated() {
        var mHightLight:HighLight? = null
        mHightLight = HighLight(requireActivity())
//            .anchor(activity?.findViewById<LinearLayout>((R.id.ll_setting_disconn_bgk)))
            .autoRemove(true) //.enableNext()
            .intercept(true)
            .setOnLayoutCallback { //mAnchor界面布局完成添加tipview
                mHightLight?.addHighLight(
                    R.id.rl_smartWatch_novel,
                    R.layout.info_known,
                    OnBottomPosCallback(100f),
                    RectLightShape(0f, 0f, 15f, 0f, 0f)
                )

//                mHightLight?.addHighLight(
//                R.id.rl_smartWatch_novel,
//                R.layout.activity_main2,
//                OnLeftPosCallback(45f),
//                RectLightShape(0f, 0f, 15f, 0f, 0f)
//            ) //矩形去除圆角
                //然后显示高亮布局
                mHightLight?.show()
            }
            .setClickCallback {
                var view = activity?.findViewById<LinearLayout>(R.layout.info_known)
                view?.findViewById<TextView>(R.id.iv_known)?.setOnClickListener {
                    Slog.d("EVENT_CHANGE_UNIT_FORMAT22")
                }
                Slog.d("输出EVENT_CHANGE_UNIT_FORMATEVENT_CHANGE_UNIT_FORMAT")
            }

    }
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

打赏作者

信工院李平

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

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

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

打赏作者

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

抵扣说明:

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

余额充值