仿百度壁纸客户端(五)——实现搜索动画GestureDetector手势识别,动态更新搜索关键字
仿百度壁纸客户端(五)——实现搜索动画GestureDetector手势识别,动态更新搜索关键字
百度壁纸系列
仿百度壁纸客户端(一)——主框架搭建,自定义Tab + ViewPager + Fragment
仿百度壁纸客户端(二)——主页自定义ViewPager广告定时轮播图
仿百度壁纸客户端(三)——首页单向,双向事件冲突处理,壁纸列表的实现
仿百度壁纸客户端(四)——自定义上拉加载实现精选壁纸墙
仿百度壁纸客户端(五)——实现搜索动画GestureDetector手势识别,动态更新搜索关键字
仿百度壁纸客户端(六)——完结篇之Gallery画廊实现壁纸预览已经项目细节优化
我们重新来看看这个效果
想实现这个逻辑,其实就是监听两个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++) {//实际开发中数据还是得从服务器获取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 {@Overridepublic boolean onTouch(View v, MotionEvent event) {//触摸事件传递给手势return gest.onTouchEvent(event);}}
接着我们来处理滑产生的操作
/*** 手势监听*/private class MyGest implements GestureDetector.OnGestureListener {//按下@Overridepublic boolean onDown(MotionEvent e) {return false;}@Overridepublic void onShowPress(MotionEvent e) {}@Overridepublic boolean onSingleTapUp(MotionEvent e) {return false;}@Overridepublic boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX, float distanceY) {return false;}@Overridepublic void onLongPress(MotionEvent e) {}//滑动@Overridepublic 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()) {//VISIBLEcase 0://动画并且显示,消失setState(VISIBLE);setState(GONE);break;//INVISIBLEcase 4://GONEcase 8://动画并且显示,消失setState(VISIBLE1);setState(GONE1);break;}}return false;}}
我们只要去动态的改变他的UI,所以,这里我们写了这样一个方法
/*** 动态改变状态** @param i*/private void setState(final int i) {//UI刷新new Thread(new Runnable() {@Overridepublic void run() {handler.sendEmptyMessage(i);}}).start();}
当接收到handler的时候
/*** 子线程*/private Handler handler = new Handler() {@Overridepublic 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() {@Overridepublic 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);}@Overridepublic 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);}@Overridepublic 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++) {//实际开发中数据还是得从服务器获取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 {@Overridepublic boolean onTouch(View v, MotionEvent event) {//触摸事件传递给手势return gest.onTouchEvent(event);}}/*** 手势监听*/private class MyGest implements GestureDetector.OnGestureListener {//按下@Overridepublic boolean onDown(MotionEvent e) {return false;}@Overridepublic void onShowPress(MotionEvent e) {}@Overridepublic boolean onSingleTapUp(MotionEvent e) {return false;}@Overridepublic boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX, float distanceY) {return false;}@Overridepublic void onLongPress(MotionEvent e) {}//滑动@Overridepublic 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()) {//VISIBLEcase 0://动画并且显示,消失setState(VISIBLE);setState(GONE);break;//INVISIBLEcase 4://GONEcase 8://动画并且显示,消失setState(VISIBLE1);setState(GONE1);break;}}return false;}}/*** 动态改变状态** @param i*/private void setState(final int i) {//UI刷新new Thread(new Runnable() {@Overridepublic void run() {handler.sendEmptyMessage(i);}}).start();}
}
我们来运行一下
这里有个隐藏小bug,不知各位看官可否发现了其中的小失误,哈哈
仿百度壁纸客户端(五)——实现搜索动画GestureDetector手势识别,动态更新搜索关键字相关推荐
- 仿百度壁纸客户端(五)——实现搜索动画GestureDetector手势识别,动态更新搜索关键字...
仿百度壁纸客户端(五)--实现搜索动画GestureDetector手势识别,动态更新搜索关键字 百度壁纸系列 仿百度壁纸客户端(一)--主框架搭建,自定义Tab + ViewPager + Frag ...
- 仿百度壁纸client(五)——实现搜索动画GestureDetector手势识别,动态更新搜索keyword...
仿百度壁纸client(五)--实现搜索动画GestureDetector手势识别,动态更新搜索关键字 百度壁纸系列 仿百度壁纸client(一)--主框架搭建,自己定义Tab + ViewPager ...
- 仿百度壁纸客户端(四)——自定义上拉加载实现精选壁纸墙
仿百度壁纸客户端(四)--自定义上拉加载实现精选壁纸墙 百度壁纸系列 仿百度壁纸客户端(一)--主框架搭建,自定义Tab + ViewPager + Fragment 仿百度壁纸客户端(二)--主页自 ...
- 仿百度壁纸客户端(三)——首页单向,双向事件冲突处理,壁纸列表的实现
仿百度壁纸客户端(三)--首页单向,双向事件冲突处理,壁纸列表的实现 百度壁纸系列 仿百度壁纸客户端(一)--主框架搭建,自定义Tab + ViewPager + Fragment 仿百度壁纸客户端( ...
- 仿百度壁纸客户端(三)——首页单向,双向事件冲突处理,壁纸列表的实现...
仿百度壁纸客户端(三)--首页单向,双向事件冲突处理,壁纸列表的实现 百度壁纸系列 仿百度壁纸客户端(一)--主框架搭建,自定义Tab + ViewPager + Fragment 仿百度壁纸客户端( ...
- 仿百度壁纸客户端(一)——主框架搭建,自定义Tab+ViewPager+Fragment
仿百度壁纸客户端(一)--主框架搭建,自定义Tab+ViewPager+Fragment 百度壁纸系列 仿百度壁纸客户端(一)--主框架搭建,自定义Tab + ViewPager + Fragment ...
- 仿百度壁纸客户端(六)——完结篇之Gallery画廊实现壁纸预览已经项目细节优化
仿百度壁纸客户端(六)--完结篇之Gallery画廊实现壁纸预览已经项目细节优化 百度壁纸系列 仿百度壁纸客户端(一)--主框架搭建,自定义Tab + ViewPager + Fragment 仿百度 ...
- 仿百度壁纸客户端(二)——主页自定义ViewPager广告定时轮播图
仿百度壁纸客户端(二)--主页自定义ViewPager广告定时轮播图 百度壁纸系列 仿百度壁纸客户端(一)--主框架搭建,自定义Tab + ViewPager + Fragment 仿百度壁纸客户端( ...
- 仿百度壁纸客户端(六)——完结篇之Gallery画廊实现壁纸预览已经项目细节优化...
仿百度壁纸客户端(六)--完结篇之Gallery画廊实现壁纸预览已经项目细节优化 百度壁纸系列 仿百度壁纸客户端(一)--主框架搭建,自定义Tab + ViewPager + Fragment 仿百度 ...
最新文章
- python【数据结构与算法】选数问题(选不相连最大值——DP)
- 我所遇到的C++连接问题汇总
- Python基础(list和tuple)可变集合和‘不可变’集合
- C:#define用法
- 计算机性能在线测评,关于电脑性能测试的常见的几大方法
- scala命令行运行spark代码
- python序列类型tuple_Python常用的序列类型包括列表、元组和字典三种。
- [蓝桥杯2017决赛]分考场、OpenJudge:分成互质数
- js 带笔锋 签字版_年轻人的第一支签字笔? ——米家签字笔评测
- linux 修改ldap密码,Linux-ldap密码修改程序,如何加密ssha
- java导入项目存在,如何将预先存在的Java项目导入Eclipse并启动并运行?
- [机器学习-Sklearn]K-means(K均值)学习与总结
- Linux shell实例精讲 (一)
- 西北师范大学知行学院计算机科学与技术,西北师范大学知行学院电子信息工程专业...
- Hadoop核心之HDFS 架构设计
- 云创大数据荣获“南京实体经济十大优秀企业”
- php滑动门效果,js实现简洁的TAB滑动门效果代码
- ITU-R BT.709
- StarUML画用例图
- 服务器版系统和w7区别,小编告诉大家W7精简版和旗舰版啥区别