仿百度壁纸client(五)——实现搜索动画GestureDetector手势识别,动态更新搜索keyword
仿百度壁纸client(五)——实现搜索动画GestureDetector手势识别,动态更新搜索关键字
百度壁纸系列
仿百度壁纸client(一)——主框架搭建,自己定义Tab + ViewPager + Fragment
仿百度壁纸client(二)——主页自己定义ViewPager广告定时轮播图
仿百度壁纸client(三)——首页单向。双向事件冲突处理,壁纸列表的实现
仿百度壁纸client(四)——自己定义上拉载入实现精选壁纸墙
我们又一次来看看这个效果
想实现这个逻辑,事实上就是监听两个View的显示隐藏加上一点小动画,所以我们在布局上是这种
search_fragment.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">
<AbsoluteLayout
android:id="@+id/myLayoutOne"
android:layout_width="match_parent"
android:layout_height="match_parent">
</AbsoluteLayout>
<AbsoluteLayout
android:id="@+id/myLayoutTwo"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:visibility="gone">
</AbsoluteLayout>
</RelativeLayout>
这两个布局我们去填充数据,首先我们把要初始化的东西都初始化好
/**
* 找控件
*
* @param view
*/
private void findView(View view) {
//设置触摸,手势
view.setLongClickable(true);
view.setOnTouchListener(new MyOnTouch());
//初始化手势
gest = new GestureDetector(getActivity(), new MyGest());
myLayoutOne = (AbsoluteLayout) view.findViewById(R.id.myLayoutOne);
myLayoutTwo = (AbsoluteLayout) view.findViewById(R.id.myLayoutTwo);
}
紧接着我们就能够去获取对应的数据了
/**
* 初始化
*/
private void init() {
//获取屏幕的像素,兴许随机分布关键字
DisplayMetrics metrics = new DisplayMetrics();
getActivity().getWindowManager().getDefaultDisplay().getMetrics(metrics);
//获取到屏幕的宽
mWidth = metrics.widthPixels;
//初始化数据
initData();
//设置默认数据
setData(myLayoutOne, index);
}**重点内容**
获取到数据之后我们就開始初始化这些数据
/**
* 初始化数据
*/
private void initData() {
//两个页面
for (int i = 0; i < 2; i++) {
switch (i) {
case 0:
ArrayList<String> newDataOne = new ArrayList<>();
//15个数据
for (int j = 0; j < 15; j++) {
//实际开发中数据还是得从server获取
newDataOne.add("海贼王");
}
//加入数据
data.add(newDataOne);
break;
case 1:
ArrayList<String> newDataTwo = new ArrayList<>();
//15个数据
for (int j = 0; j < 15; j++) {
newDataTwo.add("火影忍者");
}
//加入数据
data.add(newDataTwo);
break;
}
}
}
这样我们就能够来进行随机分布的计算
/**
* 设置默认的数据
*
* @param myLayout
* @param index
*/
private void setData(AbsoluteLayout myLayout, int index) {
//每次载入之前清除
myLayout.removeAllViews();
//有数据了之后開始随机分布了
int startY = 50;
//X动态生成,推断是第几页的数据,左右两边间距50,用户体验
for (int i = 0; i < data.get(index).size(); i++) {
int x = get(50, mWidth - 50);
int y = startY;
//文本显示
TextView tv = new TextView(getActivity());
tv.setTextSize(12);
//随机
tv.setText(data.get(index).get(i));
/**
* 高,宽,x,y
*/
AbsoluteLayout.LayoutParams layout = new AbsoluteLayout.LayoutParams(100, 50, x, y);
myLayout.addView(tv, layout);
//開始随机分布
startY += 50;
}
}
/**
* 随机生成一个坐标
*
* @param min
* @param max
* @return
*/
private int get(int min, int max) {
//从最大到最小的随机数值
return new Random().nextInt(max) % (max - min + 1) + min;
}
当我们要加入手势的时候,我们就能够把触摸事件传递给手势事件
/**
* View的触摸事件
*/
private class MyOnTouch implements View.OnTouchListener {
@Override
public boolean onTouch(View v, MotionEvent event) {
//触摸事件传递给手势
return gest.onTouchEvent(event);
}
}
接着我们来处理滑产生的操作
/**
* 手势监听
*/
private class MyGest implements GestureDetector.OnGestureListener {
//按下
@Override
public boolean onDown(MotionEvent e) {
return false;
}
@Override
public void onShowPress(MotionEvent e) {
}
@Override
public boolean onSingleTapUp(MotionEvent e) {
return false;
}
@Override
public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX, float distanceY) {
return false;
}
@Override
public void onLongPress(MotionEvent e) {
}
//滑动
@Override
public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY) {
//左边——右边滑动
if (e1.getX() < e2.getX()) {
index++;
//越界处理
if (index == data.size()) {
index = 0;
}
//推断显示内容
switch (myLayoutOne.getVisibility()) {
//VISIBLE
case 0:
//动画而且显示。消失
setState(VISIBLE);
setState(GONE);
break;
//INVISIBLE
case 4:
//GONE
case 8:
//动画而且显示,消失
setState(VISIBLE1);
setState(GONE1);
break;
}
}
return false;
}
}
我们仅仅要去动态的改变他的UI。所以。这里我们写了这样一个方法
/**
* 动态改变状态
*
* @param i
*/
private void setState(final int i) {
//UI刷新
new Thread(new Runnable() {
@Override
public void run() {
handler.sendEmptyMessage(i);
}
}).start();
}
当接收到handler的时候
/**
* 子线程
*/
private Handler handler = new Handler() {
@Override
public void handleMessage(Message msg) {
switch (msg.what) {
case VISIBLE:
setAnim(myLayoutOne, 1000, 0);
myLayoutOne.setVisibility(View.GONE);
break;
case GONE:
setData(myLayoutTwo,index);
setAnimTwo(myLayoutTwo, 2000, 0);
myLayoutTwo.setVisibility(View.VISIBLE);
break;
case VISIBLE1:
setAnimTwo(myLayoutTwo, 2000, 0);
myLayoutTwo.setVisibility(View.VISIBLE);
break;
case GONE1:
setData(myLayoutOne,index);
setAnim(myLayoutOne, 1000, 0);
myLayoutOne.setVisibility(View.GONE);
break;
}
super.handleMessage(msg);
}
};
我们就能够进行动画了。无非就是两个视图动画。他们的坐标刚好相反
* 设置Two动画
*
* @param myLayout 控件
* @param time 显示时间
* @param deLayTime 延迟时间
*/
private void setAnimTwo(AbsoluteLayout myLayout, int time, int deLayTime) {
//缩放动画
ScaleAnimation scale = new ScaleAnimation(0.0f, 1.0f, 0.0f, 1.0f, Animation.RELATIVE_TO_PARENT, 0.5f, Animation.RELATIVE_TO_PARENT, 0.5f);
scale.setDuration(time);
scale.setStartOffset(deLayTime);
//渐变
AlphaAnimation alp = new AlphaAnimation(0.0f, 1.0f);
alp.setDuration(time);
alp.setStartOffset(deLayTime);
//组合动画
AnimationSet set = new AnimationSet(true);
set.addAnimation(scale);
set.addAnimation(alp);
//開始动画
myLayout.startAnimation(set);
}
/**
* 设置One动画
*
* @param myLayout 控件
* @param time 显示时间
* @param deLayTime 延迟时间
*/
private void setAnim(AbsoluteLayout myLayout, int time, int deLayTime) {
//缩放动画
ScaleAnimation scale = new ScaleAnimation(1.0f, 1.5f, 1.0f, 1.5f, Animation.RELATIVE_TO_PARENT, 0.5f, Animation.RELATIVE_TO_PARENT, 0.5f);
scale.setDuration(time);
scale.setStartOffset(deLayTime);
//渐变
AlphaAnimation alp = new AlphaAnimation(1.0f, 0.0f);
alp.setDuration(time);
alp.setStartOffset(deLayTime);
//组合动画
AnimationSet set = new AnimationSet(true);
set.addAnimation(scale);
set.addAnimation(alp);
//開始动画
myLayout.startAnimation(set);
}
这里贴上完整代码。Demo就不上传了,xml和代码都有。直接放上去即可
SearchFragment
package com.lgl.baiduwallpaper.fragment;
import android.os.Bundle;
import android.os.Handler;
import android.os.Message;
import android.support.v4.app.Fragment;
import android.util.DisplayMetrics;
import android.view.GestureDetector;
import android.view.LayoutInflater;
import android.view.MotionEvent;
import android.view.View;
import android.view.ViewGroup;
import android.view.animation.AlphaAnimation;
import android.view.animation.Animation;
import android.view.animation.AnimationSet;
import android.view.animation.ScaleAnimation;
import android.widget.AbsoluteLayout;
import android.widget.TextView;
import com.lgl.baiduwallpaper.R;
import java.util.ArrayList;
import java.util.Random;
/**
* 搜索
* Created by lgl on 16/3/31.
*/
public class SearchFragment extends Fragment {
//显示
private static final int VISIBLE = 1;
//隐藏
private static final int GONE = 2;
//显示
private static final int VISIBLE1 = 3;
//隐藏
private static final int GONE1 = 4;
private AbsoluteLayout myLayoutOne, myLayoutTwo;
//标记
private int index = 0;
//进行数据存储
private ArrayList<ArrayList<String>> data = new ArrayList<ArrayList<String>>();
//屏幕的宽
private int mWidth;
//手势
private GestureDetector gest;
/**
* 子线程
*/
private Handler handler = new Handler() {
@Override
public void handleMessage(Message msg) {
switch (msg.what) {
case VISIBLE:
setAnim(myLayoutOne, 1000, 0);
myLayoutOne.setVisibility(View.GONE);
break;
case GONE:
setData(myLayoutTwo,index);
setAnimTwo(myLayoutTwo, 2000, 0);
myLayoutTwo.setVisibility(View.VISIBLE);
break;
case VISIBLE1:
setAnimTwo(myLayoutTwo, 2000, 0);
myLayoutTwo.setVisibility(View.VISIBLE);
break;
case GONE1:
setData(myLayoutOne,index);
setAnim(myLayoutOne, 1000, 0);
myLayoutOne.setVisibility(View.GONE);
break;
}
super.handleMessage(msg);
}
};
/**
* 设置Two动画
*
* @param myLayout 控件
* @param time 显示时间
* @param deLayTime 延迟时间
*/
private void setAnimTwo(AbsoluteLayout myLayout, int time, int deLayTime) {
//缩放动画
ScaleAnimation scale = new ScaleAnimation(0.0f, 1.0f, 0.0f, 1.0f, Animation.RELATIVE_TO_PARENT, 0.5f, Animation.RELATIVE_TO_PARENT, 0.5f);
scale.setDuration(time);
scale.setStartOffset(deLayTime);
//渐变
AlphaAnimation alp = new AlphaAnimation(0.0f, 1.0f);
alp.setDuration(time);
alp.setStartOffset(deLayTime);
//组合动画
AnimationSet set = new AnimationSet(true);
set.addAnimation(scale);
set.addAnimation(alp);
//開始动画
myLayout.startAnimation(set);
}
/**
* 设置One动画
*
* @param myLayout 控件
* @param time 显示时间
* @param deLayTime 延迟时间
*/
private void setAnim(AbsoluteLayout myLayout, int time, int deLayTime) {
//缩放动画
ScaleAnimation scale = new ScaleAnimation(1.0f, 1.5f, 1.0f, 1.5f, Animation.RELATIVE_TO_PARENT, 0.5f, Animation.RELATIVE_TO_PARENT, 0.5f);
scale.setDuration(time);
scale.setStartOffset(deLayTime);
//渐变
AlphaAnimation alp = new AlphaAnimation(1.0f, 0.0f);
alp.setDuration(time);
alp.setStartOffset(deLayTime);
//组合动画
AnimationSet set = new AnimationSet(true);
set.addAnimation(scale);
set.addAnimation(alp);
//開始动画
myLayout.startAnimation(set);
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.search_fragment, container, false);
findView(view);
return view;
}
/**
* 找控件
*
* @param view
*/
private void findView(View view) {
//设置触摸,手势
view.setLongClickable(true);
view.setOnTouchListener(new MyOnTouch());
//初始化手势
gest = new GestureDetector(getActivity(), new MyGest());
myLayoutOne = (AbsoluteLayout) view.findViewById(R.id.myLayoutOne);
myLayoutTwo = (AbsoluteLayout) view.findViewById(R.id.myLayoutTwo);
}
@Override
public void onActivityCreated(Bundle savedInstanceState) {
super.onActivityCreated(savedInstanceState);
init();
}
/**
* 初始化
*/
private void init() {
//获取屏幕的像素。兴许随机分布关键字
DisplayMetrics metrics = new DisplayMetrics();
getActivity().getWindowManager().getDefaultDisplay().getMetrics(metrics);
//获取到屏幕的宽
mWidth = metrics.widthPixels;
//初始化数据
initData();
//设置默认数据
setData(myLayoutOne, index);
}
/**
* 初始化数据
*/
private void initData() {
//两个页面
for (int i = 0; i < 2; i++) {
switch (i) {
case 0:
ArrayList<String> newDataOne = new ArrayList<>();
//15个数据
for (int j = 0; j < 15; j++) {
//实际开发中数据还是得从server获取
newDataOne.add("海贼王");
}
//加入数据
data.add(newDataOne);
break;
case 1:
ArrayList<String> newDataTwo = new ArrayList<>();
//15个数据
for (int j = 0; j < 15; j++) {
newDataTwo.add("火影忍者");
}
//加入数据
data.add(newDataTwo);
break;
}
}
}
/**
* 设置默认的数据
*
* @param myLayout
* @param index
*/
private void setData(AbsoluteLayout myLayout, int index) {
//每次载入之前清除
myLayout.removeAllViews();
//有数据了之后開始随机分布了
int startY = 50;
//X动态生成,推断是第几页的数据,左右两边间距50,用户体验
for (int i = 0; i < data.get(index).size(); i++) {
int x = get(50, mWidth - 50);
int y = startY;
//文本显示
TextView tv = new TextView(getActivity());
tv.setTextSize(12);
//随机
tv.setText(data.get(index).get(i));
/**
* 高,宽。x,y
*/
AbsoluteLayout.LayoutParams layout = new AbsoluteLayout.LayoutParams(100, 50, x, y);
myLayout.addView(tv, layout);
//開始随机分布
startY += 50;
}
}
/**
* 随机生成一个坐标
*
* @param min
* @param max
* @return
*/
private int get(int min, int max) {
//从最大到最小的随机数值
return new Random().nextInt(max) % (max - min + 1) + min;
}
/**
* View的触摸事件
*/
private class MyOnTouch implements View.OnTouchListener {
@Override
public boolean onTouch(View v, MotionEvent event) {
//触摸事件传递给手势
return gest.onTouchEvent(event);
}
}
/**
* 手势监听
*/
private class MyGest implements GestureDetector.OnGestureListener {
//按下
@Override
public boolean onDown(MotionEvent e) {
return false;
}
@Override
public void onShowPress(MotionEvent e) {
}
@Override
public boolean onSingleTapUp(MotionEvent e) {
return false;
}
@Override
public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX, float distanceY) {
return false;
}
@Override
public void onLongPress(MotionEvent e) {
}
//滑动
@Override
public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY) {
//左边——右边滑动
if (e1.getX() < e2.getX()) {
index++;
//越界处理
if (index == data.size()) {
index = 0;
}
//推断显示内容
switch (myLayoutOne.getVisibility()) {
//VISIBLE
case 0:
//动画而且显示。消失
setState(VISIBLE);
setState(GONE);
break;
//INVISIBLE
case 4:
//GONE
case 8:
//动画而且显示。消失
setState(VISIBLE1);
setState(GONE1);
break;
}
}
return false;
}
}
/**
* 动态改变状态
*
* @param i
*/
private void setState(final int i) {
//UI刷新
new Thread(new Runnable() {
@Override
public void run() {
handler.sendEmptyMessage(i);
}
}).start();
}
}
我们来执行一下
这里有个隐藏小bug,不知各位看官可否发现了当中的小失误,哈哈
仿百度壁纸client(五)——实现搜索动画GestureDetector手势识别,动态更新搜索keyword的更多相关文章
- 仿百度壁纸客户端(五)——实现搜索动画GestureDetector手势识别,动态更新搜索关键字
仿百度壁纸客户端(五)--实现搜索动画GestureDetector手势识别,动态更新搜索关键字 百度壁纸系列 仿百度壁纸客户端(一)--主框架搭建,自定义Tab + ViewPager + Frag ...
- 仿百度壁纸client(六)——完结篇之Gallery画廊实现壁纸预览已经项目细节优化
仿百度壁纸client(六)--完结篇之Gallery画廊实现壁纸预览已经项目细节优化 百度壁纸系列 仿百度壁纸client(一)--主框架搭建,自己定义Tab + ViewPager + Fragm ...
- 仿百度壁纸客户端(六)——完结篇之Gallery画廊实现壁纸预览已经项目细节优化
仿百度壁纸客户端(六)--完结篇之Gallery画廊实现壁纸预览已经项目细节优化 百度壁纸系列 仿百度壁纸客户端(一)--主框架搭建,自定义Tab + ViewPager + Fragment 仿百度 ...
- 仿百度壁纸客户端(二)——主页自定义ViewPager广告定时轮播图
仿百度壁纸客户端(二)--主页自定义ViewPager广告定时轮播图 百度壁纸系列 仿百度壁纸客户端(一)--主框架搭建,自定义Tab + ViewPager + Fragment 仿百度壁纸客户端( ...
- 仿百度壁纸客户端(一)——主框架搭建,自定义Tab+ViewPager+Fragment
仿百度壁纸客户端(一)--主框架搭建,自定义Tab+ViewPager+Fragment 百度壁纸系列 仿百度壁纸客户端(一)--主框架搭建,自定义Tab + ViewPager + Fragment ...
- c# JD快速搜索工具,2015分析JD搜索报文,模拟请求搜索数据,快速定位宝贝排行位置。
分析JD搜索报文 搜索关键字 女装 第二页,分2次加载. rt=1&stop=1&click=&psort=&page=3http://search.jd.com/Se ...
- 利用autocomplete.js实现仿百度搜索效果(ajax动态获取后端[C#]数据)
实现功能描述: 1.实现搜索框的智能提示 2.第二次浏览器缓存结果 3.实现仿百度搜索 <!DOCTYPE html> <html xmlns="http://www.w3 ...
- vue-resource使用 (vue仿百度搜索)
1.this.$http.get()方法2.this.$http.post()方法3.this.$http.jsonp()方法 (vue仿百度搜索) 在输入框中输入a, 然后在百度f12 ==> ...
- Springboot+Vue实现仿百度搜索自动提示框匹配查询功能
案例功能效果图 前端初始页面 输入搜索信息页面 点击查询结果页面 环境介绍 前端:vue 后端:springboot jdk:1.8及以上 数据库:mysql 核心代码介绍 TypeCtrler .j ...
随机推荐
- Tomcat服务器多域名配置(转载)
Tomcat服务器多域名配置 我们来讲解下如何在Tomcat服务器上进行多域名配置: 也就是一个Tomcat跑多网站,这里用真实案例举例,比如我这个云主机需要运行两个网站: pan.java1234. ...
- VirtualBox – Error In supR3HardenedWinReSpawn
Genymotion 模拟器安装好虚拟机后,启动时报错: ————————— VirtualBox – Error In supR3HardenedWinReSpawn ————————— <h ...
- thinkphp中JS文件不能写__ROOT__变量
如题 ,如果写了,就不能正确读取JS中的URL,
- 从头认识java-14.4 Java提供的数组的有用功能(2)
接着上一章节,我们继续介绍Java提供的数组的有用功能. 3.元素的对照Comparator package com.ray.ch14; import java.util.Arrays; import ...
- CountDownLatch模拟高并发测试代码
直接上代码进行验证吧 /** * 通过countdownlatch的机制,来实现并发运行 * 模拟200个并发测试 * @author ll * @date 2018年4月18日 下午3:55:59 ...
- 全栈技术经理——团队管理:每周问问你的团队这这些问题 V1.0
全栈技术经理--团队管理:每周问问你的团队这这些问题 V1.0 1.本周取得了哪些进展? 通过回答这个问题可以让员工庆祝甚至夸耀一些自己的成果,包括那些跟最高优先级不相干而被忽视的小事情.借此你也 ...
- 简谈WP,IOS,Android智能手机OS
什么是智能手机? 相信到现在这个已经是傻瓜到不能再傻瓜的问题了 智能手机都不懂? 那你活着还有什么意思= = 但是为了谈论今天的三大主角:wp,ios,android 不得不回答一下这个笨笨的问题 如 ...
- Laravel之任务调度
一.基本简介 任务调度定义在app/Console/Kernel.php 文件的schedule 方法中,该方法中已经包含了一个示例.你可以自由地添加你需要的调度任务到Schedule 对象. 二.开 ...
- 【Excle数据透视表】如何在数据透视表中使用合并单元格标志
先有数据透视表如下: 现在看着这个格式不舒服,我们希望调整成如下这种样式 步骤 单击数据透视表任意单元格→右键→数据透视表选项→布局和格式→合并且居中排列带标签的单元格 注意:如果数据透视表报表布局不 ...
- 【VBA】查看当前窗口的宽与高
打开的Excle如何使用VBA查看当前窗口的宽与高呢?代码如下: Sub 查看宽度与高度() Dim myWidth As Double Dim myHeigth As Double myWidth ...