是男人就下100层【第一层】——高仿微信界面（8）

上一篇《是男人就下100层【第一层】——高仿微信界面（7）》中我们实现了下弹式菜单，这一篇我们来看看如何实现微信中的摇一摇功能。

首先我们来布局我们的摇一摇界面

布局文件如下：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="fill_parent"android:layout_height="fill_parent"android:orientation="vertical"android:background="#111"><RelativeLayoutandroid:layout_width="fill_parent"android:layout_height="fill_parent"android:layout_centerInParent="true" ><ImageViewandroid:id="@+id/shakeBg"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_centerInParent="true"        android:src="@drawable/shakehideimg_man2" /><LinearLayoutandroid:layout_width="fill_parent"android:layout_height="wrap_content"android:layout_centerInParent="true"android:orientation="vertical" ><RelativeLayoutandroid:id="@+id/shakeImgUp"   android:layout_width="fill_parent"android:layout_height="190dp"             android:background="#111">                <ImageView                   android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_alignParentBottom="true"android:layout_centerHorizontal="true"                                android:src="@drawable/shake_logo_up"/>                </RelativeLayout><RelativeLayoutandroid:id="@+id/shakeImgDown"android:layout_width="fill_parent"android:layout_height="190dp"             android:background="#111">                <ImageView                   android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_centerHorizontal="true"                              android:src="@drawable/shake_logo_down"/>                </RelativeLayout> </LinearLayout></RelativeLayout><RelativeLayout android:id="@+id/shake_title_bar" android:layout_width="fill_parent"android:layout_height="45dp"android:background="@drawable/title_bar"android:gravity="center_vertical"  ><Buttonandroid:layout_width="70dp"android:layout_height="wrap_content"android:layout_centerVertical="true"android:text="返回"android:textSize="14sp"android:textColor="#fff"android:onClick="shake_activity_back"android:background="@drawable/title_btn_back"/>  <TextViewandroid:layout_width="wrap_content" android:layout_height="wrap_content" android:text="摇一摇"android:layout_centerInParent="true"android:textSize="20sp"        android:textColor="#ffffff" /> <ImageButton android:layout_width="67dp" android:layout_height="wrap_content"android:layout_alignParentRight="true" android:layout_centerVertical="true"android:layout_marginRight="5dp"android:src="@drawable/mm_title_btn_menu"android:background="@drawable/title_btn_right"android:onClick="linshi" />      </RelativeLayout><SlidingDrawerandroid:id="@+id/slidingDrawer1"android:layout_width="match_parent"android:layout_height="match_parent"android:content="@+id/content"android:handle="@+id/handle" ><Buttonandroid:id="@+id/handle"android:layout_width="wrap_content"android:layout_height="wrap_content"     android:background="@drawable/shake_report_dragger_up" /><LinearLayoutandroid:id="@+id/content"android:layout_width="match_parent"android:layout_height="match_parent"android:background="#f9f9f9" >            <ImageViewandroid:layout_width="match_parent"android:layout_height="wrap_content"android:scaleType="fitXY"android:src="@drawable/shake_line_up" /></LinearLayout></SlidingDrawer></RelativeLayout>

这个布局里面用到了很多相对布局，最外面是一个相对布局（我们先称为R1），R1内是两个相对布局（分别称为R2、R3）和一个抽屉组件，R3是上部标题栏，R2中有一个ImageView和一个线性布局，这两个组件都位于R2的中心，所以上面的线性布局会将下面的ImageView遮住，为什么要遮住，玩过微信摇一摇的朋友应该明白。

SlidingDrawer隐藏屏外的内容，并允许用户通过handle以显示隐藏内容。它可以垂直或水平滑动，它有俩个View组成，其一是可以拖动的handle,其二是隐藏内容的View.它里面的控件必须设置布局，在布局文件中必须指定handle和content.

接下来我们看看如何检查手机摇晃，摇一摇让手机震动

package com.example.weixin.listener;import android.content.Context;
import android.hardware.Sensor;
import android.hardware.SensorEvent;
import android.hardware.SensorEventListener;
import android.hardware.SensorManager;
import android.util.Log;/*** 一个检测手机摇晃的监听器*/
public class ShakeListener implements SensorEventListener {// 速度阈值，当摇晃速度达到这值后产生作用private static final int SPEED_SHRESHOLD = 3000;// 两次检测的时间间隔private static final int UPTATE_INTERVAL_TIME = 70;// 传感器管理器private SensorManager sensorManager;// 传感器private Sensor sensor;// 重力感应监听器private OnShakeListener onShakeListener;// 上下文private Context mContext;// 手机上一个位置时重力感应坐标private float lastX;private float lastY;private float lastZ;// 上次检测时间private long lastUpdateTime;// 构造器public ShakeListener(Context c) {// 获得监听对象mContext = c;start();}// 开始public void start() {// 获得传感器管理器sensorManager = (SensorManager) mContext.getSystemService(Context.SENSOR_SERVICE);if (sensorManager != null) {// 获得重力传感器sensor = sensorManager.getDefaultSensor(Sensor.TYPE_ACCELEROMETER);}// 注册if (sensor != null) {sensorManager.registerListener(this, sensor,SensorManager.SENSOR_DELAY_GAME);}}// 停止检测public void stop() {sensorManager.unregisterListener(this);}// 设置重力感应监听器public void setOnShakeListener(OnShakeListener listener) {onShakeListener = listener;}// 重力感应器感应获得变化数据public void onSensorChanged(SensorEvent event) {// 现在检测时间long currentUpdateTime = System.currentTimeMillis();// 两次检测的时间间隔long timeInterval = currentUpdateTime - lastUpdateTime;// 判断是否达到了检测时间间隔if (timeInterval < UPTATE_INTERVAL_TIME)return;// 现在的时间变成last时间lastUpdateTime = currentUpdateTime;// 获得x,y,z坐标float x = event.values[0];float y = event.values[1];float z = event.values[2];// 获得x,y,z的变化值float deltaX = x - lastX;float deltaY = y - lastY;float deltaZ = z - lastZ;// 将现在的坐标变成last坐标lastX = x;lastY = y;lastZ = z;double speed = Math.sqrt(deltaX * deltaX + deltaY * deltaY + deltaZ* deltaZ)/ timeInterval * 10000;//Log.v("thelog", "===========log===================");// 达到速度阀值，发出提示if (speed >= SPEED_SHRESHOLD) {onShakeListener.onShake();}}public void onAccuracyChanged(Sensor sensor, int accuracy) {}// 摇晃监听接口public interface OnShakeListener {public void onShake();}}

SensorManager是一个系统提供来管理传感器的服务。

SensorManager通过getDefaultSensor(int type)方法来获取指定类型的传感器。

// 获得重力传感器
sensor = sensorManager.getDefaultSensor(Sensor.TYPE_ACCELEROMETER);

SensorManager提供了一个注册传感器的方法：registerListener

sensorManager.registerListener(this, sensor,SensorManager.SENSOR_DELAY_GAME);

SensorEventListener接口定义了两个方法需要实现

onSensorChanged()方法，当传感器的值发生改变时触发该方法。

onAccuracyChanged()方法，当传感器的精度发生改变时触发该方法。

 // 重力感应器感应获得变化数据public void onSensorChanged(SensorEvent event) {// 现在检测时间long currentUpdateTime = System.currentTimeMillis();// 两次检测的时间间隔long timeInterval = currentUpdateTime - lastUpdateTime;// 判断是否达到了检测时间间隔if (timeInterval < UPTATE_INTERVAL_TIME)return;// 现在的时间变成last时间lastUpdateTime = currentUpdateTime;// 获得x,y,z坐标float x = event.values[0];float y = event.values[1];float z = event.values[2];// 获得x,y,z的变化值float deltaX = x - lastX;float deltaY = y - lastY;float deltaZ = z - lastZ;// 将现在的坐标变成last坐标lastX = x;lastY = y;lastZ = z;double speed = Math.sqrt(deltaX * deltaX + deltaY * deltaY + deltaZ* deltaZ)/ timeInterval * 10000;//Log.v("thelog", "===========log===================");// 达到速度阀值，发出提示if (speed >= SPEED_SHRESHOLD) {onShakeListener.onShake();}}

坐标对应的关系看下图可知

这里计算速度的公式是高中学过的知识v=s/t=(a^2+b^2+c^2)/t

double speed = Math.sqrt(deltaX * deltaX + deltaY * deltaY + deltaZ* deltaZ)/ timeInterval * 10000;

在Activity中创建摇动监听实例并设置监听

 mShakeListener = new ShakeListener(this);mShakeListener.setOnShakeListener(new OnShakeListener() {public void onShake() {//Toast.makeText(getApplicationContext(), "抱歉，暂时没有找到在同一时刻摇一摇的人。\n再试一次吧！", Toast.LENGTH_SHORT).show();startAnim();  //开始 摇一摇手掌动画mShakeListener.stop();startVibrato(); //开始 震动new Handler().postDelayed(new Runnable(){@Overridepublic void run(){//Toast.makeText(getApplicationContext(), "抱歉，暂时没有找到\n在同一时刻摇一摇的人。\n再试一次吧！", 500).setGravity(Gravity.CENTER,0,0).show();Toast mtoast;mtoast = Toast.makeText(getApplicationContext(),"抱歉，暂时没有找到\n在同一时刻摇一摇的人。\n再试一次吧！", 10);//mtoast.setGravity(Gravity.CENTER, 0, 0);mtoast.show();mVibrator.cancel();mShakeListener.start();}}, 2000);}});

在设置监听之前，在Activity的onCreate方法中需呀获得系统提供的振动服务对象

Vibrator mVibrator = (Vibrator)getApplication().getSystemService(VIBRATOR_SERVICE);

有关Vibrator的使用请看我的另一篇博文：http://blog.csdn.net/dawanganban/article/details/17531697

public void startVibrato(){      //定义震动mVibrator.vibrate( new long[]{500,200,500,200}, -1); //第一个｛｝里面是节奏数组， 第二个参数是重复次数，-1为不重复，非-1俄日从pattern的指定下标开始重复}

摇一摇的时候还有一个图片移动的动画，设置动画代码如下：

 public void startAnim () {   //定义摇一摇动画动画AnimationSet animup = new AnimationSet(true);TranslateAnimation mytranslateanimup0 = new TranslateAnimation(Animation.RELATIVE_TO_SELF,0f,Animation.RELATIVE_TO_SELF,0f,Animation.RELATIVE_TO_SELF,0f,Animation.RELATIVE_TO_SELF,-0.5f);mytranslateanimup0.setDuration(1000);TranslateAnimation mytranslateanimup1 = new TranslateAnimation(Animation.RELATIVE_TO_SELF,0f,Animation.RELATIVE_TO_SELF,0f,Animation.RELATIVE_TO_SELF,0f,Animation.RELATIVE_TO_SELF,+0.5f);mytranslateanimup1.setDuration(1000);mytranslateanimup1.setStartOffset(1000);animup.addAnimation(mytranslateanimup0);animup.addAnimation(mytranslateanimup1);mImgUp.startAnimation(animup);AnimationSet animdn = new AnimationSet(true);TranslateAnimation mytranslateanimdn0 = new TranslateAnimation(Animation.RELATIVE_TO_SELF,0f,Animation.RELATIVE_TO_SELF,0f,Animation.RELATIVE_TO_SELF,0f,Animation.RELATIVE_TO_SELF,+0.5f);mytranslateanimdn0.setDuration(1000);TranslateAnimation mytranslateanimdn1 = new TranslateAnimation(Animation.RELATIVE_TO_SELF,0f,Animation.RELATIVE_TO_SELF,0f,Animation.RELATIVE_TO_SELF,0f,Animation.RELATIVE_TO_SELF,-0.5f);mytranslateanimdn1.setDuration(1000);mytranslateanimdn1.setStartOffset(1000);animdn.addAnimation(mytranslateanimdn0);animdn.addAnimation(mytranslateanimdn1);mImgDn.startAnimation(animdn);  }

运行效果如下：

源代码下载：http://download.csdn.net/detail/lxq_xsyu/6990129

是男人就下100层【第一层】——高仿微信界面（8）相关推荐

是男人就下100层【第一层】——高仿微信界面（4）
上一篇<是男人就下100层[第一层]--高仿微信界面(3)>中我们完成了登录,这一篇看完成登录后的一个短暂加载和引导界面. 加载界面: <RelativeLayout xmlns:a ...
是男人就下100层【第一层】——高仿微信界面（5）
前面< 是男人就下100层[第一层]--高仿微信界面(4)>中我们已经完成了基本的引导界面和登录界面,这一篇中我们来看看登录后的主界面的布局和内容,来一步一步的完成该界面. 我们先来看看主 ...
是男人就下100层【第一层】——高仿微信界面（2）
接着上一篇<是男人就下100层[第一层]--高仿微信界面(1)>,本打算实现上一篇文章中的第二个界面,这一篇先来实现一下登陆界面吧,接下来我们来开始登录界面的制作. 界面布局文件: < ...
是男人就下100层【第一层】——高仿微信界面（1）
从今天开始将进行一个特别有趣且有意义的专栏<是男人就下100层>,计划对市面上比较火的应用进行高度仿照,并将开发过程贴出来,和大家交流和分享.由于时间关系可能进度会比较缓慢,但是任何事情如 ...
是男人就下100层【第一层】——高仿微信界面（3）
上一篇<是男人就下100层[第一层]--高仿微信界面(2)>中实现了注册登录界面,这一篇来看看具体的登录界面实现,先来看看界面效果. 登录界面布局 <?xml version=&qu ...
是男人就下100层【第一层】——高仿微信界面（7）
在上一篇<是男人就下100层[第一层]--高仿微信界面(6)>中我们已经对主界面的的各个菜单进行了简单实现,接下来我们完成两个比较有趣的功能,一个是上部的下弹式菜单,另一个是摇一摇功能. ...
是男人就下100层【第一层】——高仿微信界面（9）
前面几篇文章实现的界面效果不符合4.0的HOLO主题及官方建议的设计规范,感谢"一片冰心在玉壶"给我指出,不然我可能会一直错下去,也会误导大家.接下来这几篇我计划用HOLO主题来高 ...
是男人就下100层【第一层】——高仿微信界面（10）
在上一篇中虽然实现了微信5.0的主界面框架,但是方法似乎有点牵强,官方已经为HOLO主题提供了actionBar我前面翻译过两篇文章<Android官方教程翻译(5)--设置ActionBar& ...
是男人就下100层【第五层】——2048游戏从源代码到公布市场
上一篇<是男人就下100层[第五层]--换肤版2048游戏>中阳光小强对2048游戏用自己的方式进行了实现,并分享了核心源码,这一篇阳光小强打算将该项目的全部源码公开并结合这个实例在这篇文 ...

是男人就下100层【第一层】——高仿微信界面（8）

是男人就下100层【第一层】——高仿微信界面（8）相关推荐

最新文章

热门文章