Android 仿小米鎖屏實(shí)現(xiàn)九宮格解鎖功能(無(wú)需圖片資源)
最近公司要求做個(gè)九宮格解鎖,本人用的是小米手機(jī),看著他那個(gè)設(shè)置鎖屏九宮格很好看,就做了該組件,不使用圖片資源,純代碼實(shí)現(xiàn)。
尊重每個(gè)辛苦的博主,在http://blog.csdn.net/mu399/article/details/38734449的基礎(chǔ)上進(jìn)行修改
效果圖:
關(guān)鍵代碼類:
MathUtil.Java
/** * @author SoBan * @create 2016/12/5 15:52. */ public class MathUtil { public static double distance(double x1, double y1, double x2, double y2) { return Math.sqrt(Math.abs(x1 - x2) * Math.abs(x1 - x2) + Math.abs(y1 - y2) * Math.abs(y1 - y2)); } public static double pointTotoDegrees(double x, double y) { return Math.toDegrees(Math.atan2(x, y)); } public static boolean checkInRound(float sx, float sy, float r, float x, float y) { return Math.sqrt((sx - x) * (sx - x) + (sy - y) * (sy - y)) < r; } }
Point.java
/** * @author SoBan * @create 2016/12/5 15:51. */ public class Point { public static int STATE_NORMAL = 0; public static int STATE_CHECK = 1; // public static int STATE_CHECK_ERROR = 2; // public float x; public float y; public int state = 0; public int index = 0;// public Point() { } public Point(float x, float y, int value) { this.x = x; this.y = y; index = value; } public int getColNum() { return (index - 1) % 3; } public int getRowNum() { return (index - 1) / 3; } }
LocusPassWordView.java
import android.content.Context; import android.graphics.Canvas; import android.graphics.Paint; import android.graphics.Paint.Style; import android.text.TextUtils; import android.util.AttributeSet; import android.util.Log; import android.view.MotionEvent; import android.view.View; import java.util.ArrayList; import java.util.List; import java.util.Timer; import java.util.TimerTask; /** * @author SoBan * @create 2016/12/5 15:49. */ public class LocusPassWordView extends View { /** * 控件的寬高 */ private float width = 0; private float height = 0; private boolean isCache = false; //緩存pwdMaxLen個(gè)點(diǎn) private Paint mPaint = new Paint(Paint.ANTI_ALIAS_FLAG); private Point[][] mPoints = new Point[3][3]; private float dotRadius = 0; //選擇>pwdMinLen的點(diǎn) private List<Point> sPoints = new ArrayList<Point>(); private boolean checking = false; private long CLEAR_TIME = 1000; private int pwdMaxLen = 9; private int pwdMinLen = 4; private boolean isTouch = true; private Paint linePaint; private Paint normalPaint; private Paint selectedPaint; private Paint errorPaint; private int normalDotColor = 0xff929292; private int selectedColor = 0xffC3C3C3; private int selectedLineColor = 0xffEDEDED; private int errorColor = 0xffF34B2A; private int errorLineColor = 0xffEEBFB6; public LocusPassWordView(Context context, AttributeSet attrs, int defStyle) { super(context, attrs, defStyle); } public LocusPassWordView(Context context, AttributeSet attrs) { super(context, attrs); } public LocusPassWordView(Context context) { super(context); } @Override protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) { super.onMeasure(widthMeasureSpec, heightMeasureSpec); int width = measureDimension(200, widthMeasureSpec); int height = measureDimension(200, heightMeasureSpec); if (width > height) { setMeasuredDimension(height, height); } else { setMeasuredDimension(width, width); } } public int measureDimension(int defaultSize, int measureSpec) { int result; int specMode = MeasureSpec.getMode(measureSpec); int specSize = MeasureSpec.getSize(measureSpec); if (specMode == MeasureSpec.EXACTLY) { result = specSize; } else { result = defaultSize; //UNSPECIFIED if (specMode == MeasureSpec.AT_MOST) { result = Math.min(result, specSize); } } return result; } @Override public void onDraw(Canvas canvas) { if (!isCache) { initCache(); } drawToCanvas(canvas); } private void drawToCanvas(Canvas canvas) { boolean inErrorState = false; float radiu = dotRadius / 16; //圓的半徑 //畫點(diǎn) for (int i = 0; i < mPoints.length; i++) { for (int j = 0; j < mPoints[i].length; j++) { Point p = mPoints[i][j]; if (p.state == Point.STATE_CHECK) { selectedPaint.setColor(selectedColor); canvas.drawCircle(p.x, p.y, radiu, selectedPaint); } else if (p.state == Point.STATE_CHECK_ERROR) { inErrorState = true; errorPaint.setColor(errorColor); canvas.drawCircle(p.x, p.y, radiu, errorPaint); } else { normalPaint.setColor(normalDotColor); canvas.drawCircle(p.x, p.y, radiu, normalPaint); } } } if (inErrorState) { linePaint.setColor(errorLineColor); } else { linePaint.setColor(selectedLineColor); } //畫線 if (sPoints.size() > 0) { int tmpAlpha = mPaint.getAlpha(); Point tp = sPoints.get(0); for (int i = 1; i < sPoints.size(); i++) { Point p = sPoints.get(i); drawLine(tp, p, canvas, linePaint); tp = p; } if (this.movingNoPoint) { drawLine(tp, new Point(moveingX, moveingY, -1), canvas, linePaint); } mPaint.setAlpha(tmpAlpha); } } /** * 畫線 * @param start * @param end * @param canvas * @param paint */ private void drawLine(Point start, Point end, Canvas canvas, Paint paint) { float radiu = dotRadius / 16; //圓的半徑 double d = MathUtil.distance(start.x, start.y, end.x, end.y); float rx = (float) ((end.x - start.x) * radiu / d); float ry = (float) ((end.y - start.y) * radiu / d); canvas.drawLine(start.x + rx, start.y + ry, end.x - rx, end.y - ry, paint); } /** * 緩存控件寬高跟點(diǎn)個(gè)位置 */ private void initCache() { width = this.getWidth(); height = this.getHeight(); float x = 0; float y = 0; if (width > height) { x = (width - height) / 2; width = height; } else { y = (height - width) / 2; height = width; } int leftPadding = 15; float dotPadding = width / 3 - leftPadding; float middleX = width / 2; float middleY = height / 2; mPoints[0][0] = new Point(x + middleX - dotPadding, y + middleY - dotPadding, 1); mPoints[0][1] = new Point(x + middleX, y + middleY - dotPadding, 2); mPoints[0][2] = new Point(x + middleX + dotPadding, y + middleY - dotPadding, 3); mPoints[1][0] = new Point(x + middleX - dotPadding, y + middleY, 4); mPoints[1][1] = new Point(x + middleX, y + middleY, 5); mPoints[1][2] = new Point(x + middleX + dotPadding, y + middleY, 6); mPoints[2][0] = new Point(x + middleX - dotPadding, y + middleY + dotPadding, 7); mPoints[2][1] = new Point(x + middleX, y + middleY + dotPadding, 8); mPoints[2][2] = new Point(x + middleX + dotPadding, y + middleY + dotPadding, 9); Log.d("jerome", "canvas width:" + width); dotRadius = width / 10; isCache = true; initPaints(); } private void initPaints() { linePaint = new Paint(); linePaint.setColor(selectedColor); linePaint.setStyle(Style.FILL); linePaint.setAntiAlias(true); linePaint.setStrokeWidth(dotRadius / 9); selectedPaint = new Paint(); selectedPaint.setStyle(Style.FILL); selectedPaint.setAntiAlias(true); selectedPaint.setStrokeWidth(dotRadius / 6); errorPaint = new Paint(); errorPaint.setStyle(Style.FILL); errorPaint.setAntiAlias(true); errorPaint.setStrokeWidth(dotRadius / 6); normalPaint = new Paint(); normalPaint.setStyle(Style.FILL); normalPaint.setAntiAlias(true); normalPaint.setStrokeWidth(dotRadius / 9); } /** * 檢查 * * @param x * @param y * @return */ private Point checkSelectPoint(float x, float y) { for (int i = 0; i < mPoints.length; i++) { for (int j = 0; j < mPoints[i].length; j++) { Point p = mPoints[i][j]; if (MathUtil.checkInRound(p.x, p.y, dotRadius, (int) x, (int) y)) { return p; } } } return null; } /** * 重置 */ private void reset() { for (Point p : sPoints) { p.state = Point.STATE_NORMAL; } sPoints.clear(); this.enableTouch(); } /** * 判斷點(diǎn)是否有交叉 返回 0,新點(diǎn) ,1 與上一點(diǎn)重疊 2,與非最后一點(diǎn)重疊 * * @param p * @return */ private int crossPoint(Point p) { // 重疊的不最后一個(gè)則 reset if (sPoints.contains(p)) { if (sPoints.size() > 2) { // 與非最后一點(diǎn)重疊 if (sPoints.get(sPoints.size() - 1).index != p.index) { return 2; } } return 1; // 與最后一點(diǎn)重疊 } else { return 0; // 新點(diǎn) } } /** * 添加一個(gè)點(diǎn) * * @param point */ private void addPoint(Point point) { if (sPoints.size() > 0) { Point lastPoint = sPoints.get(sPoints.size() - 1); int dx = Math.abs(lastPoint.getColNum() - point.getColNum()); int dy = Math.abs(lastPoint.getRowNum() - point.getRowNum()); if ((dx > 1 || dy > 1) && (dx == 0 || dy == 0 || dx == dy)) { // if ((dx > 1 || dy > 1) && (dx != 2 * dy) && (dy != 2 * dx)) { int middleIndex = (point.index + lastPoint.index) / 2 - 1; Point middlePoint = mPoints[middleIndex / 3][middleIndex % 3]; if (middlePoint.state != Point.STATE_CHECK) { middlePoint.state = Point.STATE_CHECK; sPoints.add(middlePoint); } } } this.sPoints.add(point); } /** * 轉(zhuǎn)換為String */ private String toPointString() { if (sPoints.size() >= pwdMinLen && sPoints.size() <= pwdMaxLen) { StringBuffer sf = new StringBuffer(); for (Point p : sPoints) { sf.append(p.index); } return sf.toString(); } else { return ""; } } boolean movingNoPoint = false; float moveingX, moveingY; @Override public boolean onTouchEvent(MotionEvent event) { // 不可操作 if (!isTouch) { return false; } movingNoPoint = false; float ex = event.getX(); float ey = event.getY(); boolean isFinish = false; boolean redraw = false; Point p = null; switch (event.getAction()) { case MotionEvent.ACTION_DOWN: //點(diǎn)下 // 如果正在清除密碼,則取消 if (task != null) { task.cancel(); task = null; Log.d("task", "touch cancel()"); } // 刪除之前的點(diǎn) reset(); p = checkSelectPoint(ex, ey); if (p != null) { checking = true; } mCompleteListener.onPrompt("完成后松開手指"); break; case MotionEvent.ACTION_MOVE:// 移動(dòng) if (checking) { p = checkSelectPoint(ex, ey); if (p == null) { movingNoPoint = true; moveingX = ex; moveingY = ey; } } break; case MotionEvent.ACTION_UP:// 提起 p = checkSelectPoint(ex, ey); checking = false; isFinish = true; break; } if (!isFinish && checking && p != null) { int rk = crossPoint(p); if (rk == 2) {// 與非最后一重疊 // reset(); // checking = false; movingNoPoint = true; moveingX = ex; moveingY = ey; redraw = true; } else if (rk == 0) {// 一個(gè)新點(diǎn) p.state = Point.STATE_CHECK; addPoint(p); redraw = true; } // rk == 1 } // 是否重畫 if (redraw) { } if (isFinish) { if (this.sPoints.size() == 1) { this.reset(); isFirstPwdEmpty(); } else if (sPoints.size() > 0 && sPoints.size() < pwdMinLen) { error(); clearPassword(); isFirstPwdEmpty(); } else if (mCompleteListener != null) { if (this.sPoints.size() >= pwdMinLen) { this.disableTouch(); isPwdEqual(); } } } this.postInvalidate(); return true; } private void isFirstPwdEmpty() { if (TextUtils.isEmpty(firstPassword)) { mCompleteListener.onPrompt("至少需連接4個(gè)點(diǎn),請(qǐng)重試。"); } else { mCompleteListener.onPrompt("請(qǐng)重試"); } } private void isPwdEqual() { if (TextUtils.isEmpty(firstPassword)) { mCompleteListener.onPrompt("再次繪制圖案進(jìn)行確認(rèn)"); mCompleteListener.onComplete(toPointString()); } else { if (firstPassword.equals(toPointString())) { mCompleteListener.onPrompt("您的新解鎖圖案"); mCompleteListener.onComplete(toPointString()); } else { mCompleteListener.onPrompt("請(qǐng)重試"); error(); clearPassword(); } } } /** * 設(shè)置已經(jīng)選中的為錯(cuò)誤 */ private void error() { for (Point p : sPoints) { p.state = Point.STATE_CHECK_ERROR; } } /** * 設(shè)置為輸入錯(cuò)誤 */ public void markError() { markError(CLEAR_TIME); } /** * 設(shè)置為輸入錯(cuò)誤 */ public void markError(final long time) { for (Point p : sPoints) { p.state = Point.STATE_CHECK_ERROR; } this.clearPassword(time); } /** * 設(shè)置為可操作 */ public void enableTouch() { isTouch = true; } /** * 設(shè)置為不可操作 */ public void disableTouch() { isTouch = false; } private Timer timer = new Timer(); private TimerTask task = null; /** * 清除密碼 */ public void clearPassword() { clearPassword(CLEAR_TIME); } /** * 清除密碼 */ public void clearPassword(final long time) { if (time > 1) { if (task != null) { task.cancel(); Log.d("task", "clearPassword cancel()"); } postInvalidate(); task = new TimerTask() { public void run() { reset(); postInvalidate(); } }; Log.d("task", "clearPassword schedule(" + time + ")"); timer.schedule(task, time); } else { reset(); postInvalidate(); } } private String firstPassword; public String getFirstPassword() { return firstPassword; } public void setFirstPassword(String firstPassword) { this.firstPassword = firstPassword; } private OnCompleteListener mCompleteListener; public void setOnCompleteListener(OnCompleteListener mCompleteListener) { this.mCompleteListener = mCompleteListener; } public interface OnCompleteListener { void onComplete(String password); //密碼 void onPrompt(String prompt); //提示信息 } }
示例:可支持重繪,需要二次設(shè)置密碼。
MainActivity.class
import android.app.Activity; import android.os.Bundle; import android.util.Log; import android.view.View; import android.widget.Button; import android.widget.TextView; import android.widget.Toast; import soban.ninelockscreen.R; public class MainActivity extends Activity implements View.OnClickListener, LocusPassWordView.OnCompleteListener { private String TAG = Main2Activity.class.getName(); private TextView mExplainTv; private Button mRepaintBtn; private Button mConfirmBtn; private LocusPassWordView mPwdView; private String firstPassword; private String againPassword; private boolean isFirst; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); initViews(); } private void initViews() { mExplainTv = (TextView) findViewById(R.id.tv_explain); mRepaintBtn = (Button) findViewById(R.id.btn_repaint); mConfirmBtn = (Button) findViewById(R.id.btn_confirm); mPwdView = (LocusPassWordView) findViewById(R.id.mPassWordView2); mRepaintBtn.setOnClickListener(this); mConfirmBtn.setOnClickListener(this); mPwdView.setOnCompleteListener(this); initChoose(); } @Override public void onClick(View view) { switch (view.getId()) { case R.id.btn_repaint: repaint(); break; case R.id.btn_confirm: confirm(); break; } } private void repaint() { mPwdView.clearPassword(0); initChoose(); } private void confirm() { Toast.makeText(MainActivity.this, "你設(shè)置的密碼:" + againPassword, Toast.LENGTH_SHORT).show(); } @Override public void onComplete(String password) { if (isFirst) { firstChoose(password); } else { secondChoose(password); } Log.e(TAG, "onComplete -> " + password); } @Override public void onPrompt(String prompt) { mExplainTv.setText(prompt); } private void initChoose() { isFirst = true; firstPassword = ""; againPassword = ""; mPwdView.setFirstPassword(""); mRepaintBtn.setVisibility(View.GONE); mConfirmBtn.setVisibility(View.GONE); } private void firstChoose(String password) { isFirst = false; firstPassword = password; mPwdView.setFirstPassword(password); mPwdView.clearPassword(0); mRepaintBtn.setEnabled(true); mConfirmBtn.setEnabled(false); mRepaintBtn.setVisibility(View.VISIBLE); mConfirmBtn.setVisibility(View.VISIBLE); } private void secondChoose(String password) { isFirst = true; againPassword = password; mRepaintBtn.setEnabled(true); mConfirmBtn.setEnabled(true); } }
布局:activity_main.xml
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:gravity="center_horizontal" android:orientation="vertical"> <LinearLayout android:id="@+id/bottomLayout" android:layout_width="match_parent" android:layout_height="50dip" android:layout_alignParentBottom="true" android:orientation="horizontal"> <Button android:id="@+id/btn_repaint" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_weight="1" android:text="重繪" /> <Button android:id="@+id/btn_confirm" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_weight="1" android:text="確認(rèn)" /> </LinearLayout> <soban.ninelockscreen.demo.LocusPassWordView android:id="@+id/mPassWordView2" android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_above="@id/bottomLayout" /> <TextView android:id="@+id/tv_explain" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_above="@id/mPassWordView2" android:layout_alignParentTop="true" android:background="@color/colorPrimary" android:gravity="center" android:text="繪制解鎖圖案,請(qǐng)至少連接4個(gè)點(diǎn)" android:textColor="#FFFFFF" /> </RelativeLayout>
以上所述是小編給大家介紹的Android 仿小米鎖屏實(shí)現(xiàn)九宮格解鎖功能(無(wú)需圖片資源),希望對(duì)大家有所幫助,如果大家有任何疑問(wèn)請(qǐng)給我留言,小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持!
- android 九宮格滑動(dòng)解鎖開機(jī)實(shí)例源碼學(xué)習(xí)
- 輕松實(shí)現(xiàn)Android自定義九宮格圖案解鎖
- Android實(shí)現(xiàn)九宮格解鎖
- 輕松實(shí)現(xiàn)安卓(Android)九宮格解鎖
- Android實(shí)現(xiàn)九宮格解鎖的實(shí)例代碼
- 使用Android自定義控件實(shí)現(xiàn)滑動(dòng)解鎖九宮格
- Android自定義控件實(shí)現(xiàn)九宮格解鎖功能
- Android自定義View九宮格手勢(shì)密碼解鎖
- Android實(shí)現(xiàn)九宮格手勢(shì)解鎖
- Android自定義控件實(shí)現(xiàn)九宮格解鎖
相關(guān)文章
Android?startActivityForResult的調(diào)用與封裝詳解
startActivityForResult?可以說(shuō)是我們常用的一種操作了,目前有哪些方式實(shí)現(xiàn)?startActivityForResult?的功能呢?本文就來(lái)和大家詳細(xì)聊聊2023-03-03Android Fragment監(jiān)聽返回鍵的一種合理方式
這篇文章主要給大家介紹了關(guān)于Android Fragment監(jiān)聽返回鍵的一種合理方式,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2020-11-11Android?shape與selector標(biāo)簽使用詳解
Android中提供一種xml的方式,讓我們可以自由地定義背景,比較常用的就是shape標(biāo)簽和selector標(biāo)簽,這篇文章主要介紹了Android?shape與selector標(biāo)簽使用,需要的朋友可以參考下2022-05-05簡(jiǎn)單說(shuō)說(shuō)Android中如何使用攝像頭和相冊(cè)
本篇文章主要介紹了簡(jiǎn)單說(shuō)說(shuō)Android中如何使用攝像頭和相冊(cè),小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2018-05-05Android Studio報(bào):“Attribute application@theme or @ icon ”問(wèn)題的解
這篇文章主要給大家介紹了關(guān)于Android Studio報(bào):“Attribute application@theme or @ icon ”問(wèn)題的解決方法,文中通過(guò)示例代碼介紹的非常詳細(xì),需要的朋友可以參考借鑒,下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧。2017-12-12