android+解锁风格,Android开发实现图案解锁功能

释放双眼，带上耳机，听听看~！

学习目的

学习新的Android开发相关知识，并通过代码实现图案解锁功能

相关技术、及其使用

注意：在界面上添加控件都需要给控件指定其在界面上所处的位置 及 X ，Y ，W ，H

1、LinerLayout里面相关方法：

Margin : 控件边缘和其他控件的间距 外间距

padding :控件内部和自己边缘的间距 内间距

layout_marginTop:上边距

layout_marginStart和layout_marginLeft :左边距

layout_marginEnd 和 layout_marginRight : 右边距

2、RelativeLayout里面的相关方法：

layout_alignRight = “@id/v1” : 右边对齐

layout_alignLeft = “@id/v1” 左边对齐

layout_alignTop = “@id/v1” 上边对齐

layout_alignEnd = “@id/v1” 下边对齐

在MarginLayout的基础上添加了对齐

android:layout_marginHorizontal=”100dp”对齐并居中

注意：RelativeLayout里面必须给每个控件相应的 x , y , w ,h

android:layout_width="match_parent"

android:layout_height="match_parent"

android:src="https://www.jianshu.com/p/cb13cf9f3711/@drawable/main_bg"

android:scaleType="fitXY"

/>

3、约束布局(ConstraintLayout)

需要注意：宽高比例的方法 app:layout_constraintDimensionRatio=”w,1:2″ 宽高比 “h,1:2”高宽比

约束布局面给界面添加边距

android:layout_width="0dp"

android:layout_height="0dp"

android:background="@color/colorAccent"

android:layout_constraintStart_toStartOf="parent"

android:layout_constraintTop_toToptOf="parent"

android:layout_constraintEnd_toEndOf="parent"

android:layout_constraintBottom_toBottomOf="parent"/>

4、图案解锁开发

(1)在RelativeLayout容器里面添加图案解锁的背景

android:layout_width="match_parent"

android:layout_height="match_parent"

android:src="https://www.jianshu.com/p/cb13cf9f3711/@drawable/main_bg"

android:scaleType="fitXY"

/>

(2)在添加就有9个点的背景图片

android:id="@+id/opView"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:src="https://www.jianshu.com/p/cb13cf9f3711/@drawable/op_bg"

android:layout_centerInParent="true"/>

(3)通过Java代码对界面进一步布局和功能实现：

1.实现onWindowFocusChanged方法来监听窗口

@Override

public void onWindowFocusChanged(boolean hasFocus) {

super.onWindowFocusChanged(hasFocus);

2.在方法里面通过hasFocus来判断窗口是否已经显示并开始创建创建界面

//判断是否已经显示

if(hasFocus){

RelativeLayout rl = findViewById(R.id.root_layout);

//获取背景视图

ImageView iv = findViewById(R.id.opView);

//背景视图的尺寸

int x = iv.getLeft();

int y = iv.getTop();

3.通过使用两次for循环给界面添加视图和线条

//创建9个点

for(int i = 0 ;i < 3;i++ ) {

for (int j = 0; j < 3; j++) {

//创建用于显示点的视图

ImageView dotView = new ImageView(this);

//隐藏视图

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) + (int)(99*scale*i);

params.topMargin = (int) (y + 164 * scale) + (int)(99*scale*j);

//将控件添加到容器中

rl.addView(dotView, params);

}

}

提示，添加视图和添加线条的方式和上面类似，不同在于线条和视图中的布局参数不同，同时布局参数里面需要获取屏幕密度进行屏幕适配

//获取屏幕密度

float scale = getResources().getDisplayMetrics().density;

PS

今天学完下来给我的第一感觉就是一下子接受的知识点有点多，有点记不住，容易搞混淆。比如说ConstraintLayout里面Start—toEndOf = “ ”，和End_ toStart = ” ” 刚开始的时候有点被绕晕了，但，重写代码过后就明白了。另外，还有点就是对为什么需要用两个for循环来创建线条和视图还是有点不明白。