美文网首页程序员
Android_滑动解锁

Android_滑动解锁

作者: 书虫大王X | 来源:发表于2019-09-27 10:35 被阅读0次
    1.滑动解锁代码流程图:
    流程图
    图片资源:https://pan.baidu.com/s/1tkcw0tdxV78mnwHqOtcAGg
    提取码:2xsq
    2.代码:

    xml文件:

    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        xmlns:tools="http://schemas.android.com/tools"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:context=".MainActivity"
        android:id="@+id/root_layout">
    
        <!--背景图片-->
        <ImageView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:scaleType="fitXY"
            android:src="@drawable/main_bg"
    
            tools:layout_editor_absoluteX="66dp"
            tools:layout_editor_absoluteY="632dp"
            />
    
        <!--添加用于放九个点的图片-->
        <ImageView
            android:id="@+id/opView"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/op_bg"
            android:layout_centerInParent="true"
            />
       <!--提示框-->
        <TextView
            android:id="@+id/tv_alert"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="图案解锁"
            android:textSize="20sp"
            android:textColor="#ffffff"
            android:textAlignment="center"
            android:layout_alignTop="@id/opView"
            android:layout_marginTop="90dp"
            />
    </RelativeLayout>
    
    界面效果图

    MainActivity 文件:

    public class MainActivity extends AppCompatActivity{
        //定义⼀个数组 保存每个点的控件
        ArrayList<ImageView> dotsList;
        ArrayList<Integer> lineTagsList;
        ArrayList<ImageView> selectedList;
        int tag;
        //保存上⼀次被点亮的点的对象
        ImageView lastSelectedDot;
        //记录滑动的密码
        StringBuilder password;
        //保存原始密码
        String orgPassword;
        //保存第⼀次输⼊的密码
        String firstPassword;
        //提示的⽂本视图
        TextView alertTextView;
    
        @Override
        public void onWindowFocusChanged(boolean hasFocus) {
            super.onWindowFocusChanged(hasFocus);
            //判断是否已经显示
            if (hasFocus){
                //获取容器
                RelativeLayout rl = findViewById(R.id.root_layout);
                //获取背景视图
                ImageView iv = findViewById(R.id.opView);
                //获取x 和 y坐标
                int x = iv.getLeft();
                int y = iv.getTop();
                //获取屏幕密度
                float scale = getResources().getDisplayMetrics().density;
                //创建横线 6条
                //12 23
                //45 56
                //78 89
                tag = 12;
                for (int i = 0; i < 3; i++) {
                    for (int j = 0; j < 2; j++) {
                        //创建⼀个视图⽤于显示线
                        ImageView lineView = new ImageView(this);
                        lineView.setBackgroundResource(R.drawable.normal_highlight1);
                        lineView.setVisibility(View.INVISIBLE);
                        lineView.setTag(tag);
                        lineTagsList.add(tag);//保存线的tag值
                        tag += 11; //同⼀⾏相差11
                        //创建布局参数
                        RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(
                                ViewGroup.LayoutParams.WRAP_CONTENT,
                                ViewGroup.LayoutParams.WRAP_CONTENT);
                        params.leftMargin = (int)(x + 46.6*scale) + (int)(99*scale*j);
                        params.topMargin = (int)(y + 170*scale) + (int)(99*scale*i);
                        rl.addView(lineView, params);
                    }
                    //换⼀⾏ 相差22
                    tag += 11;
                }
                //创建竖线 4条
                //14 25 36
                //47 58 69
                tag = 14;
                for (int i = 0; i < 2; i++) {
                    for (int j = 0; j < 3; j++) {
                        //创建⼀个视图⽤于显示线
                        ImageView lineView = new ImageView(this);
                        lineView.setBackgroundResource(R.drawable.normal_highlight2);
                        lineView.setVisibility(View.INVISIBLE);
                        lineView.setTag(tag);
                        lineTagsList.add(tag);//保存线的tag值
                        tag += 11;
                        //创建布局参数
                        RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(
                                ViewGroup.LayoutParams.WRAP_CONTENT,
                                ViewGroup.LayoutParams.WRAP_CONTENT);
                        params.leftMargin = (int)(x + 42*scale) + (int)(99*scale*j);
                        params.topMargin = (int)(y + 170*scale) + (int)(99*scale*i);
                        rl.addView(lineView, params);
                    }
                }
                //创建斜线
                //左斜
                // 24 35
                // 57 68
                // 右斜
                // 15 26
                // 48 59
                tag = 24;
                int rTag = 15;
                for (int i = 0; i < 2; i++) {
                    for (int j = 0; j < 2; j++) {
                        //创建⼀个视图⽤于显示线
                        ImageView rLineView = new ImageView(this);
                        rLineView.setTag(rTag);
                        lineTagsList.add(rTag);//保存线的tag值
                        rTag += 11;
                        //设置图⽚
                        rLineView.setBackgroundResource(R.drawable.normal_highlight3);
                        //创建布局参数
                        rLineView.setVisibility(View.INVISIBLE);
                        RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(
                                ViewGroup.LayoutParams.WRAP_CONTENT,
                                ViewGroup.LayoutParams.WRAP_CONTENT);
                        params.leftMargin = (int)(x + 42*scale) + (int)(99*scale*j);
                        params.topMargin = (int)(y + 170*scale) + (int)(99*scale*i);
                        rl.addView(rLineView, params);
                        ImageView lLineView = new ImageView(this);
                        lLineView.setTag(tag);
                        lineTagsList.add(tag);//保存线的tag值
                        tag += 11;
                        lLineView.setVisibility(View.INVISIBLE);
                        lLineView.setBackgroundResource(R.drawable.normal_highlight4);
                        params.leftMargin = (int)(x + 53.3*scale) + (int)(99*scale*j);
                        params.topMargin = (int)(y + 170*scale) + (int)(99*scale*i);
                        rl.addView(lLineView,params);
                    }
                    tag += 11;
                    rTag += 11;
                }
                //创建9个点
                tag = 1;
                for (int i = 0; i < 3; i++) {
                    for (int j = 0; j < 3; j++) {
                        //创建⽤于显示点的视图
                        ImageView dotView = new ImageView(this);;
                        //设置对应的tag值
                        dotView.setTag(tag);
                        tag++;
                        //隐藏视图
                        dotView.setVisibility(View.INVISIBLE);
                        //显示对应的图⽚
                        dotView.setBackgroundResource(R.drawable.selected_dot);
                        //创建控件的尺⼨
                        RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(
                                ViewGroup.LayoutParams.WRAP_CONTENT,
                                ViewGroup.LayoutParams.WRAP_CONTENT);
                        params.leftMargin = (int)(x + 35.33*scale) + (int)(98.66*scale*j);
                        params.topMargin = (int)(y + 162*scale) + (int)(98.66*scale*i);
                        //将控件添加到容器中
                        rl.addView(dotView, params);
                        //将这个控件添加到数组
                        dotsList.add(dotView);
                    }
                }
            }
        }
        //监听触摸事件
        @Override
        public boolean onTouchEvent(MotionEvent event) {
            //获取事件的类型
            int action = event.getAction();
            ImageView selected;
            float x;
            float y;
            //判断是什么事件
            switch (action){
                case MotionEvent.ACTION_DOWN:
                    //按下
                    //获取触摸点的坐标
                    x = event.getX();
                    y = event.getY();
                    //判断x y是不是在某个点的范围内
                    selected = dotOfTouch(x, y);
                    if (selected != null) {
                        //点亮
                        selected.setVisibility(View.VISIBLE);
                        //记录当前这个点
                        lastSelectedDot = selected;
                        //将tag值拼接到密码中
                        password.append(selected.getTag());
                        //将点亮的点添加到数组中
                        selectedList.add(selected);
                    }
                    break;
                case MotionEvent.ACTION_MOVE:
                    //移动
                    //获取触摸点的坐标
                    x = event.getX();
                    y = event.getY();
                    //判断x y是不是在某个点的范围内
                    selected = dotOfTouch(x, y);
                    if (selected != null) {
                        //判断这个点是不是第⼀个点
                        if (lastSelectedDot == null){
                            //第⼀个点
                            selected.setVisibility(View.VISIBLE);
                            //记录
                            lastSelectedDot = selected;
                            //将tag值拼接到密码中
                            password.append(selected.getTag());
                            //将点亮的点添加到数组中
                            selectedList.add(selected);
                        } else{
                            //不是第⼀个点
                            //获取上⼀个点和当前点的tag
                            int lTag = (Integer) lastSelectedDot.getTag();
                            int cTag = (Integer) selected.getTag();
                            //获取两个线的tag值 small * 10 + big
                            int lineTag = lTag > cTag ? cTag*10+lTag: lTag*10+cTag;
                            //判断这条线是否存在
                            if (lineTagsList.contains(lineTag)){
                                //线存在
                                //点亮点
                                selected.setVisibility(View.VISIBLE);
                                //将tag值拼接到密码中
                                password.append(selected.getTag());
                                //点亮这条线
                                //获取容器对象
                                RelativeLayout rl = findViewById(R.id.root_layout);
                                //通过tag查找⼦控件
                                ImageView iv = rl.findViewWithTag(lineTag);
                                //点亮线
                                iv.setVisibility(View.VISIBLE);
                                //记录这个点
                                lastSelectedDot = selected;
                                //将点亮的点添加到数组中
                                selectedList.add(selected);
                                //将点亮的线添加到数组中
                                selectedList.add(iv);
                            }
                        }
                    }
                    break;
                case MotionEvent.ACTION_UP:
                    //离开
                    // 1.绘制密码 和原始密码⽐较
                    // 2.设置密码 第⼀次
                    // 3.设置密码 第⼆次
                    if (orgPassword != null){
                        //有密码了
                        if (password.toString().equals(orgPassword)){
                            alertTextView.setText("解锁密码成功");
                        } else{
                            alertTextView.setText("解锁密码失败");
                        }
                    } else{
                        //设置密码
                        //判断是第⼀次还是第⼆次确认密码
                        if (firstPassword == null){
                            //设置密码的第⼀次
                            firstPassword = password.toString();
                            //提示确认密码
                            alertTextView.setText("请确认密码图案");
                        } else{
                            //第⼆次确认密码
                            //判断两次是否⼀致
                            if (firstPassword.equals(password.toString())){
                                //设置成功
                                alertTextView.setText("设置密码成功");
                                //保存密码
                                SharedPreferences sp = getSharedPreferences("password",0);
                                SharedPreferences.Editor editor = sp.edit();
                                editor.putString("pwd",firstPassword);
                                editor.commit();
                            } else{
                                //设置失败
                                alertTextView.setText("两次密码不⼀致 请重新设置");
                                firstPassword = null;
                            }
                        }
                    }
                    clean();
                    break;
                default:
                    break;
            }
            return true;
        }
        //清空
        public void clean(){
            password.setLength(0);
            //隐藏所有选中的视图 点 线
            for (ImageView iv:selectedList){
                iv.setVisibility(View.INVISIBLE);
            }
            //清空数组
            selectedList.clear();
        }
        //写⼀个⽅法 处理 判断触摸点是否在某个控件内部
        public ImageView dotOfTouch(float x, float y){
            //计算状态栏或者标题栏的距离
            //遍历数组
            for (ImageView dot:dotsList){
                //获取这个dot相对于屏幕的x y
                int[] loc = new int[2];
                dot.getLocationOnScreen(loc);
                int dx = loc[0];
                int dy = loc[1];
                //获取右边的偏移量
                int r = dx + dot.getWidth();
                //获取最底部的偏移量
                int b = dy + dot.getHeight();
                //判断这个点是否在这个范围内
                if ((x <= r && x >= dx) &&
                        (y <= b && y >= dy)){
                    return dot;
                }
            }
            return null;
        }
    
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_main);
            //准备好数组 实例化对象
            dotsList = new ArrayList<>();
            lineTagsList = new ArrayList<>();
            password = new StringBuilder();
            selectedList = new ArrayList<>();
            //获取xml的⽂本控件
            alertTextView = findViewById(R.id.tv_alert);
            //查找偏好设置⾥⾯是否有保存的密码pwd
            SharedPreferences sp = getSharedPreferences("password",MODE_PRIVATE);
            //获取pwd对应密码
            orgPassword = sp.getString("pwd",null);
            if (orgPassword == null){
                alertTextView.setText("请设置密码图案");
            }else{
                alertTextView.setText("请绘制密码图案");
            }
        }
        @Override
        protected void onResume() {
            super.onResume();
            Point p = new Point();
            getWindowManager().getDefaultDisplay().getSize(p);
            float w = p.x;
            float h = p.y;
            if (w > h){
                System.out.println("横屏");
            } else{
                System.out.println("竖屏");
            }
        }
    }
    

    注意:按照1-9的顺序给9个点添加tag值。在创建横线、竖线和斜线时,给它们添加两位数的tag值(每条线连接两个点,两个点的tag值小的数组成线tag值的两位,大的组成tag值的个位数)。手指在两个点间滑动时,两个点的tag值组成一个两位数(两个点小的tag值组成十位,大的组成个位),遍历所有的线的tag值,判断是否有与这个两位数相同的tag值,有则点亮该线。

    相关文章

      网友评论

        本文标题:Android_滑动解锁

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