Android 微信搖一搖功能實(shí)現(xiàn)詳細(xì)介紹
Android 微信搖一搖功能實(shí)現(xiàn),最近學(xué)習(xí)傳感器,就想實(shí)現(xiàn)搖一搖的功能,上網(wǎng)查了些資料,就整理下。如有錯(cuò)誤,還請(qǐng)指正。
開發(fā)環(huán)境
- Android Studio 2.2.1
- JDK1.7
- API 24
- Gradle 2.2.1
相關(guān)知識(shí)點(diǎn)
- 加速度傳感器
- 補(bǔ)間動(dòng)畫
- 手機(jī)震動(dòng) (Vibrator)
- 較短 聲音/音效 的播放 (SoundPool)
案例:
我們接下來分析一下這個(gè)案例, 當(dāng)用戶晃動(dòng)手機(jī)時(shí), 會(huì)觸發(fā)加速傳感器, 此時(shí)加速傳感器會(huì)調(diào)用相應(yīng)接口供我們使用, 此時(shí)我們可以做一些相應(yīng)的動(dòng)畫效果, 震動(dòng)效果和聲音效果. 大致思路就是這樣. 具體功能點(diǎn):
用戶晃動(dòng)后兩張圖片分開, 顯示后面圖片
晃動(dòng)后伴隨震動(dòng)效果, 聲音效果
根據(jù)以上的簡(jiǎn)單分析, 我們就知道該怎么做了, Just now
先搭建布局
布局沒啥可說的, 大家直接看代碼吧
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ff222222"
android:orientation="vertical"
tools:context="com.lulu.weichatshake.MainActivity">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<!--搖一搖中心圖片-->
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:src="@mipmap/weichat_icon"/>
<LinearLayout
android:gravity="center"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true">
<!--頂部的橫線和圖片-->
<LinearLayout
android:gravity="center_horizontal|bottom"
android:id="@+id/main_linear_top"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageView
android:src="@mipmap/shake_top"
android:id="@+id/main_shake_top"
android:layout_width="wrap_content"
android:layout_height="100dp"/>
<ImageView
android:background="@mipmap/shake_top_line"
android:id="@+id/main_shake_top_line"
android:layout_width="match_parent"
android:layout_height="5dp"/>
</LinearLayout>
<!--底部的橫線和圖片-->
<LinearLayout
android:gravity="center_horizontal|bottom"
android:id="@+id/main_linear_bottom"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageView
android:background="@mipmap/shake_bottom_line"
android:id="@+id/main_shake_bottom_line"
android:layout_width="match_parent"
android:layout_height="5dp"/>
<ImageView
android:src="@mipmap/shake_bottom"
android:id="@+id/main_shake_bottom"
android:layout_width="wrap_content"
android:layout_height="100dp"/>
</LinearLayout>
</LinearLayout>
</RelativeLayout>
</LinearLayout>
得到加速度傳感器的回調(diào)接口
step1: 在onStart() 方法中獲取傳感器的SensorManager
@Override
protected void onStart() {
super.onStart();
//獲取 SensorManager 負(fù)責(zé)管理傳感器
mSensorManager = ((SensorManager) getSystemService(SENSOR_SERVICE));
if (mSensorManager != null) {
//獲取加速度傳感器
mAccelerometerSensor = mSensorManager.getDefaultSensor(Sensor.TYPE_ACCELEROMETER);
if (mAccelerometerSensor != null) {
mSensorManager.registerListener(this, mAccelerometerSensor, SensorManager.SENSOR_DELAY_UI);
}
}
}
step2: 緊接著我們就要在Pause中注銷傳感器
@Override
protected void onPause() {
// 務(wù)必要在pause中注銷 mSensorManager
// 否則會(huì)造成界面退出后搖一搖依舊生效的bug
if (mSensorManager != null) {
mSensorManager.unregisterListener(this);
}
super.onPause();
}
Note: 至于為什么我們要在onStart和onPause中就行SensorManager的注冊(cè)和注銷, 就是因?yàn)? 防止在界面退出(包括按Home鍵)時(shí), 搖一搖依舊生效(代碼中有注釋)
step3: 在step1中的注冊(cè)監(jiān)聽事件方法中, 我們傳入了當(dāng)前Activity對(duì)象, 故讓其實(shí)現(xiàn)回調(diào)接口, 得到以下方法
///////////////////////////////////////////////////////////////////////////
// SensorEventListener回調(diào)方法
///////////////////////////////////////////////////////////////////////////
@Override
public void onSensorChanged(SensorEvent event) {
int type = event.sensor.getType();
if (type == Sensor.TYPE_ACCELEROMETER) {
//獲取三個(gè)方向值
float[] values = event.values;
float x = values[0];
float y = values[1];
float z = values[2];
if ((Math.abs(x) > 17 || Math.abs(y) > 17 || Math
.abs(z) > 17) && !isShake) {
isShake = true;
// TODO: 2016/10/19 實(shí)現(xiàn)搖動(dòng)邏輯, 搖動(dòng)后進(jìn)行震動(dòng)
Thread thread = new Thread() {
@Override
public void run() {
super.run();
try {
Log.d(TAG, "onSensorChanged: 搖動(dòng)");
//開始震動(dòng) 發(fā)出提示音 展示動(dòng)畫效果
mHandler.obtainMessage(START_SHAKE).sendToTarget();
Thread.sleep(500);
//再來一次震動(dòng)提示
mHandler.obtainMessage(AGAIN_SHAKE).sendToTarget();
Thread.sleep(500);
mHandler.obtainMessage(END_SHAKE).sendToTarget();
} catch (InterruptedException e) {
e.printStackTrace();
}
}
};
thread.start();
}
}
}
@Override
public void onAccuracyChanged(Sensor sensor, int accuracy) {
}
Note: 當(dāng)用戶晃動(dòng)手機(jī)會(huì)調(diào)用onSensorChanged方法, 可以做一些相應(yīng)的操作
為解決動(dòng)畫和震動(dòng)延遲, 我們開啟了一個(gè)子線程來實(shí)現(xiàn).
子線程中會(huì)通過發(fā)送Handler消息, 先開始動(dòng)畫效果, 并伴隨震動(dòng)和聲音 ,先把Handler的實(shí)現(xiàn)放一放, 我們?cè)賮砜匆幌抡饎?dòng)和聲音初始化動(dòng)畫, 震動(dòng)和音效實(shí)現(xiàn)
step 1: 先獲取到震動(dòng)相關(guān)的服務(wù),注意要加權(quán)限. 至于音效, 我們采用SoundPool來播放, 在這里非常感謝Vincent 的貼子, 好初始化SoundPool
震動(dòng)權(quán)限
<uses-permission android:name="android.permission.VIBRATE"/>
//初始化SoundPool mSoundPool = new SoundPool(1, AudioManager.STREAM_SYSTEM, 5); mWeiChatAudio = mSoundPool.load(this, R.raw.weichat_audio, 1); //獲取Vibrator震動(dòng)服務(wù) mVibrator = (Vibrator) getSystemService(VIBRATOR_SERVICE);
Note: 大家可能發(fā)現(xiàn)SoundPool的構(gòu)造方法已經(jīng)過時(shí), 不過不用擔(dān)心這是Api21之后過時(shí)的, 所以也不算太”過時(shí)”吧
step2: 接下來我們就要介紹Handler中的實(shí)現(xiàn)了, 為避免Activity內(nèi)存泄漏, 采用了軟引用方式
private static class MyHandler extends Handler {
private WeakReference<MainActivity> mReference;
private MainActivity mActivity;
public MyHandler(MainActivity activity) {
mReference = new WeakReference<MainActivity>(activity);
if (mReference != null) {
mActivity = mReference.get();
}
}
@Override
public void handleMessage(Message msg) {
super.handleMessage(msg);
switch (msg.what) {
case START_SHAKE:
//This method requires the caller to hold the permission VIBRATE.
mActivity.mVibrator.vibrate(300);
//發(fā)出提示音
mActivity.mSoundPool.play(mActivity.mWeiChatAudio, 1, 1, 0, 0, 1);
mActivity.mTopLine.setVisibility(View.VISIBLE);
mActivity.mBottomLine.setVisibility(View.VISIBLE);
mActivity.startAnimation(false);//參數(shù)含義: (不是回來) 也就是說兩張圖片分散開的動(dòng)畫
break;
case AGAIN_SHAKE:
mActivity.mVibrator.vibrate(300);
break;
case END_SHAKE:
//整體效果結(jié)束, 將震動(dòng)設(shè)置為false
mActivity.isShake = false;
// 展示上下兩種圖片回來的效果
mActivity.startAnimation(true);
break;
}
}
}
Note: 內(nèi)容不多說了, 代碼注釋中很詳細(xì), 還有一個(gè)startAnimation方法
我先來說一下它的參數(shù), true表示布局中兩張圖片從打開到關(guān)閉的動(dòng)畫, 反之, false是從關(guān)閉到打開狀態(tài), 上代碼
step3: startAnimaion方法上的實(shí)現(xiàn)
/**
* 開啟 搖一搖動(dòng)畫
*
* @param isBack 是否是返回初識(shí)狀態(tài)
*/
private void startAnimation(boolean isBack) {
//動(dòng)畫坐標(biāo)移動(dòng)的位置的類型是相對(duì)自己的
int type = Animation.RELATIVE_TO_SELF;
float topFromY;
float topToY;
float bottomFromY;
float bottomToY;
if (isBack) {
topFromY = -0.5f;
topToY = 0;
bottomFromY = 0.5f;
bottomToY = 0;
} else {
topFromY = 0;
topToY = -0.5f;
bottomFromY = 0;
bottomToY = 0.5f;
}
//上面圖片的動(dòng)畫效果
TranslateAnimation topAnim = new TranslateAnimation(
type, 0, type, 0, type, topFromY, type, topToY
);
topAnim.setDuration(200);
//動(dòng)畫終止時(shí)停留在最后一幀~不然會(huì)回到?jīng)]有執(zhí)行之前的狀態(tài)
topAnim.setFillAfter(true);
//底部的動(dòng)畫效果
TranslateAnimation bottomAnim = new TranslateAnimation(
type, 0, type, 0, type, bottomFromY, type, bottomToY
);
bottomAnim.setDuration(200);
bottomAnim.setFillAfter(true);
//大家一定不要忘記, 當(dāng)要回來時(shí), 我們中間的兩根線需要GONE掉
if (isBack) {
bottomAnim.setAnimationListener(new Animation.AnimationListener() {
@Override
public void onAnimationStart(Animation animation) {}
@Override
public void onAnimationRepeat(Animation animation) {}
@Override
public void onAnimationEnd(Animation animation) {
//當(dāng)動(dòng)畫結(jié)束后 , 將中間兩條線GONE掉, 不讓其占位
mTopLine.setVisibility(View.GONE);
mBottomLine.setVisibility(View.GONE);
}
});
}
//設(shè)置動(dòng)畫
mTopLayout.startAnimation(topAnim);
mBottomLayout.startAnimation(bottomAnim);
}
至此 核心代碼已經(jīng)介紹完畢 , 但是還有部分小細(xì)節(jié)不得不提一下
細(xì)枝末節(jié)
大家要在初始化View之前將上下兩條橫線GONE掉, 用GONE是不占位的
mTopLine.setVisibility(View.GONE);
mBottomLine.setVisibility(View.GONE);
2.咱們的搖一搖最好是只豎屏 (畢竟我也沒見過橫屏的搖一搖), 加上下面代碼
//設(shè)置只豎屏
setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_PORTRAIT);
完整代碼
源碼我已經(jīng)發(fā)在了github上, 希望大家多多支持!
感謝閱讀,希望能幫助到大家,謝謝大家對(duì)本站的支持!
- Android實(shí)現(xiàn)微信搖一搖功能
- android重力感應(yīng)開發(fā)之微信搖一搖功能
- Android編程使用加速度傳感器實(shí)現(xiàn)搖一搖功能及優(yōu)化的方法詳解
- Android實(shí)現(xiàn)iPhone晃動(dòng)撤銷輸入功能 Android仿微信搖一搖功能
- Android利用傳感器仿微信搖一搖功能
- Android實(shí)現(xiàn)搖一搖功能
- Android利用傳感器實(shí)現(xiàn)微信搖一搖功能
- android 類似微信的搖一搖功能實(shí)現(xiàn)思路及代碼
- Android實(shí)現(xiàn)搖一搖簡(jiǎn)單功能
相關(guān)文章
Flutter在項(xiàng)目中使用動(dòng)畫不使用包實(shí)現(xiàn)詳解
這篇文章主要為大家介紹了Flutter在項(xiàng)目中使用動(dòng)畫不使用包實(shí)現(xiàn)詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2022-11-11
Android 圓角邊框的實(shí)現(xiàn)方式匯總
這篇文章主要介紹了Android 圓角邊框的實(shí)現(xiàn)方式匯總的相關(guān)資料,需要的朋友可以參考下2016-03-03
教你一步步實(shí)現(xiàn)Android微信自動(dòng)搶紅包
自從微信添加搶紅包的功能,微信的電商之旅算是正式開始正式火爆起來。但是作為Android開發(fā)者來說,我們首先考慮的是如何實(shí)現(xiàn)Android微信自動(dòng)搶紅包呢,下面我們來一起看看吧。2016-08-08
Android使用phonegap從相冊(cè)里面獲取照片(代碼分享)
本文主要介紹了使用phonegap從相冊(cè)里面獲取照片的實(shí)現(xiàn)方法代碼。具有很好的參考價(jià)值,下面跟著小編一起來看下吧2017-03-03
深入理解與運(yùn)行Android Jetpack組件之ViewModel
ViewModel是Android Jetpack組件之一,是一種用于管理UI相關(guān)數(shù)據(jù)的架構(gòu)組件,它能夠幫助開發(fā)者實(shí)現(xiàn)優(yōu)雅的數(shù)據(jù)驅(qū)動(dòng)和生命周期管理,本文將深入淺出地介紹ViewModel的使用和原理,帶你一步步掌握這個(gè)強(qiáng)大的組件2023-08-08
Android動(dòng)態(tài)添加設(shè)置布局與控件的方法
這篇文章主要介紹了Android動(dòng)態(tài)添加設(shè)置布局與控件的方法,涉及Android中布局與控件的相關(guān)操作技巧,需要的朋友可以參考下2016-01-01
Android實(shí)現(xiàn)狀態(tài)欄白底黑字效果示例代碼
這篇文章主要介紹了Android實(shí)現(xiàn)狀態(tài)欄白底黑字效果的相關(guān)資料,實(shí)現(xiàn)后的效果非常適合日常開發(fā)中使用,文中給出了詳細(xì)的示例代碼供大家參考學(xué)習(xí),需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧。2017-10-10
詳解AndroidStudio JNI +Gradle3.0以上JNI爬坑之旅
這篇文章主要介紹了詳解AndroidStudio JNI +Gradle3.0以上JNI爬坑之旅,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-12-12

