編輯:關於Android編程
滑動解鎖九宮格的分析:
1、需要自定義控件;
2、需要重寫事件onTouchEvent();
3、需要給九個點設置序號和坐標,這裡用Map類就行;
4、需要判斷是否到滑到過九點之一,並存儲滑到過的點的序號,而且需要一個方法可以返回它們,這裡用List類就行;
滑動解鎖當前還是比較流行的,今天寫了個簡單的滑動解鎖九宮格的例程,分享出來讓初學者看看。
我的是這樣的:
首先,自定義一個View
/**
* 九宮格
*/
public class NineGridView extends View {
private int width;//該控件的寬
private int height;//該控件的高
private Paint mPaintBigCircle;//用於畫外圓
private Paint mPaintSmallCircle;//用於畫內圓
private Paint mPaintLine;//用於畫線
private Paint mPaintText;//用於畫文本
private Path path;//手勢劃線時需要用到它
private Map pointContainer;//存儲九個點的坐標
private List pointerSlipped;//存儲得到的九宮格密碼
public List getPointerSlipped() {
return pointerSlipped;
}
public void setPointerSlipped(List pointerSlipped) {
this.pointerSlipped = pointerSlipped;
}
public NineGridView(Context context) {
super(context);
}
public NineGridView(Context context, AttributeSet attrs) {
super(context, attrs);
mPaintBigCircle = new Paint();
mPaintBigCircle.setColor(Color.BLUE);
mPaintBigCircle.setStyle(Paint.Style.STROKE);//不充滿
mPaintBigCircle.setAntiAlias(true);//抗鋸齒打開
mPaintSmallCircle = new Paint();
mPaintSmallCircle.setColor(Color.GREEN);
mPaintSmallCircle.setStyle(Paint.Style.FILL);//充滿,即畫的幾何體為實心
mPaintSmallCircle.setAntiAlias(true);
mPaintLine = new Paint();
mPaintLine.setColor(Color.GREEN);
mPaintLine.setStyle(Paint.Style.STROKE);
mPaintLine.setStrokeWidth(20);
mPaintLine.setAntiAlias(true);
mPaintText = new Paint();
mPaintText.setColor(Color.WHITE);
mPaintText.setTextAlign(Paint.Align.CENTER);//向中央對齊
mPaintText.setTextSize(50);
mPaintText.setAntiAlias(true);
path = new Path();
pointContainer = new HashMap<>();
pointerSlipped = new ArrayList<>();
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
width = getDefaultSize(getSuggestedMinimumWidth(), widthMeasureSpec);
height = getDefaultSize(getSuggestedMinimumHeight(), heightMeasureSpec);
}
private float pivotX;//觸屏得到的x坐標
private float pivotY;//觸屏得到的y坐標
private float selectedX;//當前選中的圓點的x坐標
private float selectedY;//當前選中的圓點的y坐標
private float selectedXOld;//從前選中的圓點的x坐標
private float selectedYOld;//從前選中的圓點的y坐標
private boolean isHasMoved = false;//用於判斷path是否調用過moveTo()方法
@Override
public boolean onTouchEvent(MotionEvent event) {
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
pivotX = event.getX();
pivotY = event.getY();
//每次觸屏時需要清空一下pointerSlipped,即重置密碼
pointerSlipped.clear();
Log.d(pointTouched, pivotX + , + pivotY);
getSelectedPointIndex(pivotX, pivotY);
invalidate();//重繪
break;
case MotionEvent.ACTION_MOVE:
pivotX = event.getX();
pivotY = event.getY();
getSelectedPointIndex(pivotX, pivotY);
invalidate();
break;
case MotionEvent.ACTION_UP:
/**
* 當手指離開屏幕時,重置path
*/
path.reset();
isHasMoved = false;
String indexSequence = ;
//打印出上一次手勢密碼的值
for(int index:pointerSlipped){
indexSequence += /+index;
}
Log.d(index,indexSequence);
break;
}
invalidate();
return true;
}
/**
* 得到並存儲經過的圓點的序號
* @param pivotX
* @param pivotY
*/
private void getSelectedPointIndex(float pivotX, float pivotY) {
int index = 0;
if (pivotX > patternMargin && pivotX < patternMargin + bigCircleRadius * 2) {
if (pivotY > height / 2 && pivotY < height / 2 + bigCircleRadius * 2) {
selectedX = pointContainer.get(1)[0];
selectedY = pointContainer.get(1)[1];
index = 1;
Log.d(selectedPoint, selectedX + , + selectedY);
} else if (pivotY > height / 2 + added && pivotY < height / 2 + added + bigCircleRadius * 2) {
selectedX = pointContainer.get(4)[0];
selectedY = pointContainer.get(4)[1];
index = 4;
} else if (pivotY > height / 2 + added * 2 && pivotY < height / 2 + added * 2 + bigCircleRadius * 2) {
selectedX = pointContainer.get(7)[0];
selectedY = pointContainer.get(7)[1];
index = 7;
}
} else if (pivotX > patternMargin + added && pivotX < patternMargin + added + bigCircleRadius * 2) {
if (pivotY > height / 2 && pivotY < height / 2 + bigCircleRadius * 2) {
selectedX = pointContainer.get(2)[0];
selectedY = pointContainer.get(2)[1];
index = 2;
} else if (pivotY > height / 2 + added && pivotY < height / 2 + added + bigCircleRadius * 2) {
selectedX = pointContainer.get(5)[0];
selectedY = pointContainer.get(5)[1];
index = 5;
} else if (pivotY > height / 2 + added * 2 && pivotY patternMargin + added * 2 && pivotX < patternMargin + added * 2 + bigCircleRadius * 2) {
if (pivotY > height / 2 && pivotY < height / 2 + bigCircleRadius * 2) {
selectedX = pointContainer.get(3)[0];
selectedY = pointContainer.get(3)[1];
index = 3;
} else if (pivotY > height / 2 + added && pivotY < height / 2 + added + bigCircleRadius * 2) {
selectedX = pointContainer.get(6)[0];
selectedY = pointContainer.get(6)[1];
index = 6;
} else if (pivotY > height / 2 + added * 2 && pivotY < height / 2 + added * 2 + bigCircleRadius * 2) {
selectedX = pointContainer.get(9)[0];
selectedY = pointContainer.get(9)[1];
index = 9;
}
}
if (selectedX!=selectedXOld||selectedY!=selectedYOld){
//當這次的坐標與上次的坐標不同時存儲這次點序號
pointerSlipped.add(index);
selectedXOld = selectedX;
selectedYOld = selectedY;
if (!isHasMoved){
//當第一次觸碰到九個點之一時,path調用moveTo;
path.moveTo(selectedX,selectedY);
isHasMoved = true;
}else{
//path移動至當前圓點坐標
path.lineTo(selectedX,selectedY);
}
}
}
private String text = 請繪制解鎖圖案;
private float x;//繪制的圓形的x坐標
private float y;//繪制圓形的縱坐標
private float added;//水平豎直方向每個圓點中心間距
private float patternMargin = 100;//九宮格距離邊界距離
private float bigCircleRadius = 90;//外圓半徑
private float smallCircleRadius = 25;//內圓半徑
private int index;//圓點的序號
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
added = (width - patternMargin * 2) / 3;
x = patternMargin + added / 2;
y = added / 2 + height / 2;
index = 1;
canvas.drawColor(Color.BLACK);
canvas.drawText(text, width / 2, height / 4, mPaintText);
/**
* 繪制九個圓點圖案
*/
for (int column = 0; column < 3; column++) {
for (int row = 0; row < 3; row++) {
canvas.drawCircle(x, y, bigCircleRadius, mPaintBigCircle);
canvas.drawCircle(x, y, smallCircleRadius, mPaintSmallCircle);
pointContainer.put(index, new Float[]{x, y});
index++;
x += added;
}
y += added;
x = patternMargin + added / 2;
}
x = patternMargin + added / 2;
y = added / 2 + height / 2;
canvas.drawPath(path, mPaintLine);
}
}
為什麼要規避重復?
因為在觸屏時,會調用很多次onTouchEvent()方法,這樣存儲的手勢密碼肯定會不准確,我在以上代碼中作出了處理,已經避免了重復,看打印信息:
顯然,密碼沒有相鄰數重復,當然還有一種情況就是手指在兩個點之間來回等問題,這種狀況也需要避免,這裡沒有作處理。當然,我做得還不夠。。。
自定義view中用到的dp和px互相轉換的工具類:<喎?/kf/ware/vc/" target="_blank" class="keylink">vc3Ryb25nPjwvcD4NCjxwcmUgY2xhc3M9"brush:java;">
主活動: layout中的布局文件view_nine_grid: 我寫的只是最基本的九宮格滑動解密項目,實際用的九宮格解密比這個要復雜,有許多特效和其他更嚴謹的處理,事件的處理也不是這樣草草了事,如果想寫得漂亮,還得多花工夫。public class SizeConvert {
/**
* 將dp轉換為sp
*/
public static int dip2px(Context context, float dipValue){
final float scale = context.getResources().getDisplayMetrics().density;
return (int)(dipValue * scale + 0.5f);
}
/**
* sp轉dp
*/
public static int px2dip(Context context, float pxValue){
final float scale = context.getResources().getDisplayMetrics().density;
return (int)(pxValue / scale + 0.5f);
}
}
public class NineGridActivity extends BaseActivity{
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.view_nine_grid);
}
}
總結
今天寫這篇文章的緣由是前一段時間一個網友在我的博客上面留言,想要實現在GridLayout(相當於九宮格)中點擊每項可左右滑動顯示該宮格的圖片,當該宮格的圖
一、前言好久沒有更新過博客了,趁今天有空分享一個導航欄的自定義控件。有關此控件的demo相信在網上已經爛大街了,一搜一大把。我現在只著重分享一些我認為比較難理解的知識點。
一、前言作為一個安卓開發者,我們一般把焦點放在app的功能上。但是僅僅有功能是不夠的,界面和功能一樣重要。有兩種方法可以改變app的外觀。第一種就是直接在xml中直接修改
Win10系統下配JDK環境變量問題電腦系統win10jdk版本jdk1.8.0_102Jdk安裝在了c盤下 配的環境變量為JAVA_HOME CLA