学编程前的样子
学编程后的样子
图片来源于网络,联系,侵删。
一、目的
1.学习如何控制控件的移动:动作:点击、滑动:控制点:左上角、中心、右下角
2.继续写图案解锁。目标:实现移动和点击点亮图标
二、知识点
1.在屏幕上点击,控件的移动到点击位置
@Override
public boolean onTouchEvent(MotionEvent event) {
//获取事件对应类型
int action = event.getAction();
//解决触摸点和移动点不对应
//获取屏幕的大小
Point p = new Point();
getWindowManager().getDefaultDisplay().getSize(p);//则屏幕高度:p.y
//获取容器宽高
RelativeLayout rl = findViewById(R.id.root);//则屏幕高度:rl.getHeight
//屏幕和容器差值(状态栏和标题栏的高度)
float padding = p.y-rl.getHeight();
按下
if(action == MotionEvent.ACTION_DOWN){
//获取触摸点坐标
float x = event.getX();
float y = event.getY()-padding;
//改变控件的位置
redview.setX(x-(float)redview.getWidth()/2);
redview.setY(y-(float)redview.getHeight()/2);
}
滑动
float x = event.getX();
float y = event.getY()-padding;
//改变控件的位置
redview.setX(x-(float)redview.getWidth());
redview.setY(y-(float)redview.getHeight());
}else if(action == MotionEvent.ACTION_UP){
//离开屏幕
}else{
//被打断了
}
return true;
}
对应的xml文件
xml
控制中心点
//改变控件的位置
redview.setX(x-(float)redview.getWidth()/2);
redview.setY(y-(float)redview.getHeight()/2);
控制左上角
//改变控件的位置
redview.setX(x);
redview.setY(y);
控制右下角
//改变控件的位置
redview.setX(x-(float)redview.getWidth());
redview.setY(y-(float)redview.getHeight());
2.解决点击点坐标于控件移动坐标不一致的问题
- 让触摸点切换到控件的父视图中
Point p = new Point();
getWindowManager().getDefaultDisplay().getSize(p);
//获取容器器本身的宽高
RelativeLayout rl = findViewById(R.id.root_layout);
//计算状态栏或者标题栏的距离
float padding = p.y - rl.getHeight();
2.让控件切换到屏幕坐标系
ImageView firt = dotsList.get(0);
int[] loc = new int[2];
firt.getLocationOnScreen(loc);
System.out.println("相对屏幕y:"+loc[1]);
System.out.println("相对容器y:"+firt.getY());
System.out.println("原本宽度:"+firt.getWidth());
3.事件处理之 回调
(1.监听处理事件
1.事件源:图片、按钮、滚动视图
2.监听者:监听事件是否发送
3.事件:点击、长按、旋转
2.回调处理事件)
重写触摸回调的事件(onTouchEvent)
- 返回值 true-已处理不会继续传递 false-自己不消费,事件继续传
- 系统自动将事件包装为MotionEvent类
- 用户可以获取事件的行为 ——getAction
- ACTION_DOWN、ACTION_MOVE、ACTION_UP、ACTION_CANCEL
- 获取触摸点坐标——getX getY
4.使用tag查找子控件
查找一个控件可以是加id可以是使用tag值
但是对于一些不在xml文件里添加的就不能用id了
注意:用tag值查找某个控件之前要先获取该控件的父容器,然后再在父容器下用**findViewWithTag(); **方法去查找。
就像你去到一个学校你要找一个人,你得先找到他所在的班级
@Override
public boolean onTouchEvent(MotionEvent event) {
//更改控件的颜色
//redview.setBackgroundColor(Color.BLACK);
//找到父容器
RelativeLayout rl = findViewById(R.id.root);
//通过tag值找到父容器下的子控件
View iv = rl.findViewWithTag("1");
iv.setBackgroundColor(Color.BLUE);
return true;
}
对应的xml文件
xml
三、实际应用:图片解锁2 | 点亮图标
与昨天内容的区别:
QQ2.png
与昨天内容的区别2
与昨天内容的区别2
1.监听触摸事件
@Override
public boolean onTouchEvent(MotionEvent event) {
//获取事件的类型
int action = event.getAction();
ImageView selected;
float x;
float y;
//判断是什什么事件
switch (action){
case MotionEvent.ACTION_DOWN:
//点击
//获取触摸点的坐标
x = event.getX();
y = event.getY();
//判断x y是不不是在某个点的范围内
selected = dotOfTouch(x, y);
if (selected != null) {
selected.setVisibility(View.VISIBLE);
}
break;
case MotionEvent.ACTION_MOVE:
//滑动
//获取触摸点的坐标
x = event.getX();
y = event.getY();
//判断x y是不是在某个点的范围内
selected = dotOfTouch(x, y);
if (selected != null) {
selected.setVisibility(View.VISIBLE);
}
break;
case MotionEvent.ACTION_UP:
break;
default:
break;
}
return true;
}
2.写⼀个方法 处理 判断触摸点是否在控件内部
public ImageView dotOfTouch(float x, float y){
for (ImageView dot:dotsList){
//获取这个dot相对于屏幕的x y
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;
}
实现效果:
四、心得
点的点亮很容易,接下来就要思考线的点亮怎么实现了,因为线多且范围有重复,所以不能用点亮点的方式,今天学了用tag值来找控件,我们可以给每个控件赋tag值,通过tag值判断是否该点亮线,那么要怎样赋值才你很好的表示线呢?先思考一下吧,明天继续实现点亮线。