美文网首页
【Android开发】图案解锁Demo(下)——源代码

【Android开发】图案解锁Demo(下)——源代码

作者: 榆野铃爱 | 来源:发表于2019-08-28 19:30 被阅读0次

    心得感悟

    粘贴完才发现居然写了这么多行代码,但其实写的时候并没有很累,以前我也很怕看到特别长的代码,根本看不下去,可使当我自己写过这么多行的代码后,就根本不怕了。注释比较多,虽然代码长,但还是很好理解的。最后换名字换图标的过程非常快乐,换了个图标更像是真正的应用了。不过这个软件只能通过连接电脑的Android安装,因为缺少apk文件,不能直接发给其他人呢。


    内容简概

    • 一、MainActivity
    • 二、activity_main
    • 三、效果图
    • 四、StringBuilder与String的区别

    一、MainActivity

    import androidx.appcompat.app.AppCompatActivity;
    import androidx.constraintlayout.widget.ConstraintLayout;
    import android.content.SharedPreferences;
    import android.graphics.Point;
    import android.graphics.Rect;
    import android.os.Bundle;
    import android.view.MotionEvent;
    import android.view.View;
    import android.view.ViewGroup;
    import android.widget.ImageView;
    import android.widget.RelativeLayout;
    import android.widget.TextView;
    import java.util.ArrayList;
    
    
    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) + 99*scale*j);
                        params.topMargin = (int)((y + 170*scale) + 99*scale*i);
    
                        // 将控件添加到容器中
                        rl.addView(LineView,params);
    
                        System.out.println(LineView.getTag());
                    }
                    // 换一行 相差22
                    tag += 11;
                }
    
                // 创建竖线 6 条
                //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 + 43*scale) + 99*scale*j);
                        params.topMargin = (int)((y + 170*scale) + 99*scale*i);
    
                        // 将控件添加到容器中
                        rl.addView(lineView,params);
                    }
                }
    
                // 创建斜线
                //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.setBackgroundResource(R.drawable.normal_highlight3);
                        rlineView.setVisibility(View.INVISIBLE);
                        rlineView.setTag(rTag);
                        lineTagsList.add(rTag);// 保存线的tag值
                        rTag += 11;
    
                        // 设置布局参数
                        RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT);
                        params.leftMargin = (int)((x + 42*scale) + 99*scale*j);
                        params.topMargin = (int)((y + 170*scale) + 99*scale*i);
    
                        rl.addView(rlineView,params);
    
                        ImageView lLineView = new ImageView(this);
                        lLineView.setBackgroundResource(R.drawable.normal_highlight4);
                        lLineView.setVisibility(View.INVISIBLE);
                        lLineView.setTag(tag);
                        lineTagsList.add(tag);// 保存线的tag值
                        tag += 11;
    
                        params.leftMargin = (int)((x + 53.3*scale) + 99*scale*j);
                        params.topMargin = (int)((y + 170*scale) + 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*scale) + 99*scale*j);
                        params.topMargin = (int)((y + 164*scale)+ 99*scale*i);
    
                        // 将控件添加到容器中
                        rl.addView(dotView,params);
    
                        // 将这个控件添加到数组
                        dotsList.add(dotView);
    
                        System.out.println(dotView.getTag());
                    }
                }
            }
        }
    
        @Override
        public boolean onTouchEvent(MotionEvent event) {
            // 获取事件的类型
            int action = event.getAction();
    
            ImageView selected = null;
            float x;
            float y;
            // 判断是什么事件
            switch (action){
                case MotionEvent.ACTION_DOWN:
                    // 按下
                    // 获取触摸点的x坐标和y坐标
                    x = event.getX();
                    y = event.getY();
    
                    // 判断xy是不是在某个点的范围内
                    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坐标和y坐标
                    x = event.getX();
                    y = event.getY();
    
                    // 判断xy是不是在某个点的范围内
                    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 组成的线的tag
                            int lTag = (Integer)lastSelectedDot.getTag();
                            int cTag = (Integer)selected.getTag();
    
                            // 获取两个线的tag samll*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相对于屏幕的XY
                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("请绘制密码图案");
            }
        }
    }
    

    二、activity_main

    <?xml version="1.0" encoding="utf-8"?>
    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        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:src="@drawable/main_bg"
           android:scaleType="fitXY"
           />
    
        <!--9个点的背景-->
        <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>
    

    三、效果图

    四、StringBuilder与String的区别

    这里的password定义为StringBuilder,想知道区别的朋友可以查看下面的文章:

    StringBuilder与String的区别

    相关文章

      网友评论

          本文标题:【Android开发】图案解锁Demo(下)——源代码

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