目的
在AndroidStudio里实现图案解锁
要实现的基本功能
添加背景图片,添加一些线,在界面上显示出来的是已经画好了的图案
具体实现
1.在xml文件中设置背景图片和9个点的图片
<?xml version="1.0" encoding="utf-8"?>
<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:src="@drawable/main_bg"
android:scaleType="fitXY"/>
<!--九个点的背景图片-->
<ImageView
android:id="@+id/opView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="@drawable/op_bg"
android:layout_centerInParent="true"
/>
</RelativeLayout>
2.重写onWindowFocusChanged方法,获取背景图片,创建横竖线和斜线并设置他们的xy值,可以根据所需设置
public class MainActivity extends AppCompatActivity {
@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();
for (int i = 0; i < 3; i++) {
for (int j = 0; j < 3; j++) {
//创建用于显示点的视图
ImageView dotView=new ImageView(this);
//显示对应的图片
dotView.setBackgroundResource(R.drawable.selected_dot);
//创建控件的尺寸
RelativeLayout.LayoutParams params=new RelativeLayout.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT,ViewGroup.LayoutParams.WRAP_CONTENT);
float scale=getResources().getDisplayMetrics().density;
params.leftMargin=(int)(x+42*scale)+(int)(112*scale*i);
params.topMargin=(int)(y+279*scale)+(int)(112*scale*j);
System.out.println("zyx"+scale);
//背景视图的尺寸
//将控件添加到容器
rl.addView(dotView,params);
}
}
//创建六条横线
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);
//创建布局参数
RelativeLayout.LayoutParams params=new RelativeLayout.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT,ViewGroup.LayoutParams.WRAP_CONTENT);
//设置x,y
float scale=getResources().getDisplayMetrics().density;
params.leftMargin = (int) ((int) (x + 54* scale) + (114 * scale * j));
params.topMargin = (int) ((int) (y + 282* scale) + (114 * scale * i));
rl.addView(lineView,params);
}
}
//创建竖线
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);
//创建布局参数
RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT);
//设置下,x,y
float scale = getResources().getDisplayMetrics().density;
params.leftMargin = (int) ((int) (x + 50* scale) + (114 * scale * j));
params.topMargin = (int) ((int) (y + 292* scale) + (114 * scale * I));
rl.addView(lineView,params);
}
}
//创建右斜线
for (int I = 0; I < 2; I++) {
for (int j = 0; j < 2; j++) {
//创建一个视图用于显示线
ImageView lineView = new ImageView(this);
//设置图片
lineView.setBackgroundResource(R.drawable.normal_highlight3);
//创建布局参数
RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT);
//设置x,y
float scale = getResources().getDisplayMetrics().density;
params.leftMargin = (int) ((int) (x + 40 * scale) + (110 * scale * j));
params.topMargin = (int) ((int) (y + 282 * scale) + (110 * scale * I));
rl.addView(lineView, params);
//创建一个视图用于显示线
ImageView lineView2 = new ImageView(this);
//设置图片
lineView2.setBackgroundResource(R.drawable.normal_highlight4);
params.leftMargin = (int) ((int) (x + 80 * scale) + (114 * scale * j));
params.topMargin = (int) ((int) (y + 282 * scale) + (114 * scale * I));
rl.addView(lineView2, params);
}
}
}
}
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
小结
今天所学确实有些复杂,要设置很多东西,但是很多其实都差不多,就像x和y的设置,后面还会设置触摸,能用手实现图案解锁,而不是这样已经固定好了的图案,期待这个功能完整之后的app