Android仿微信文章懸浮窗效果
序言
前些日子跟朋友聊天，朋友Z果粉，前些天更新了微信，說微信出了個好方便的功能啊，我問是啥功能啊，看看我大Android有沒有，他說現在閱讀公眾號文章如果有人給你發微信你可以把這篇文章當作懸浮窗懸浮起來，方便你聊完天不用找繼續閱讀，聽完是不是覺得這叫啥啊，我大Android微信版不是早就有這個功能了嗎，我看文章的時候看到過有這個懸浮按鈕，但是我一直沒有使用過，試了一下還是挺方便的，就想著自己實現一下這個功能，下面看圖，大家都習慣了無圖言X
image
原理
看完動圖我們來分析一下，如何在每個頁面上都存在一個 View 呢，有些人可能會說，寫在base裡面，這樣每次啟動一個新的 Activity 都要往頁面上 addView 一次，效能不好，再說了，我們作為一個優秀的程式員能幹這種重複的事嗎，這種方案果斷打回去；既然這樣的話那我們肯定要在全域性加了，那麼全域性是哪呢？相信瞭解過 Activity 原始碼的朋友肯定知道，全域性可以在 Window 層加啊，這樣既能一次性搞定，又不影響效能，說幹就幹。
實現
1、許可權
首先我們要考慮的一個問題就是許可權問題，因為要適配 Android 7.0 8.0 ，新增懸浮窗是需要申請許可權的，這裡參考了 ofollow,noindex">Android 懸浮窗許可權各機型各系統適配大全 這篇文章，適配的比較全，可以直接拿來用。這裡需要注意的是，為了適配 Android 8.0 ， Window 的型別需要配置一下：
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.O) { //Android 8.0 mLayoutParams.type = WindowManager.LayoutParams.TYPE_APPLICATION_OVERLAY; } else { //其他版本 mLayoutParams.type = WindowManager.LayoutParams.TYPE_PHONE; }
2、新增ViewGroup到Window
判斷好許可權之後，直接新增就可以了
@SuppressLint("CheckResult")
private void showWindow(Context context) {
mWindowManager = (WindowManager) context.getSystemService(WINDOW_SERVICE);
mView = LayoutInflater.from(context).inflate(R.layout.article_window, null);
ImageView ivImage = mView.findViewById(R.id.aw_iv_image);
String imageUrl = SPUtil.getStringDefault(ARTICLE_IMAGE_URL, "");
RequestOptions requestOptions = RequestOptions.circleCropTransform();
requestOptions.placeholder(R.mipmap.ic_launcher_round).error(R.mipmap.ic_launcher_round);
Glide.with(context).load(imageUrl).apply(requestOptions).into(ivImage);
initListener(context);
mLayoutParams = new WindowManager.LayoutParams();
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.O) {
mLayoutParams.type = WindowManager.LayoutParams.TYPE_APPLICATION_OVERLAY;
} else {
mLayoutParams.type = WindowManager.LayoutParams.TYPE_SYSTEM_ALERT;
}
mLayoutParams.format = PixelFormat.RGBA_8888;//視窗透明
mLayoutParams.gravity = Gravity.LEFT | Gravity.TOP;//視窗位置
mLayoutParams.flags = WindowManager.LayoutParams.FLAG_NOT_TOUCH_MODAL | WindowManager.LayoutParams.FLAG_NOT_FOCUSABLE;
mLayoutParams.width = 200;
mLayoutParams.height = 200;
mLayoutParams.x = mWindowManager.getDefaultDisplay().getWidth() - 200;
mLayoutParams.y = 0;
mWindowManager.addView(mView, mLayoutParams);
}
3、View的拖拽實現
藉助 WindowManager.LayoutParams 來實現， mLayoutParams.x 和 mLayoutParams.y 分別表示 mView 左上角的橫縱座標，所以我們只需要改動這兩個值就行了，當 ACTION_UP 時，計算當前 mView 的中心點相對視窗的位置，然後將 mView 動態滑動到視窗左邊或者右邊：
//設定觸控滑動事件
mView.setOnTouchListener(new View.OnTouchListener() {
int startX, startY;//起始點
boolean isMove;//是否在移動
long startTime;
int finalMoveX;//最後通過動畫將mView的X軸座標移動到finalMoveX
@Override
public boolean onTouch(View v, MotionEvent event) {
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
startX = (int) event.getX();
startY = (int) event.getY();
startTime = System.currentTimeMillis();
isMove = false;
return false;
case MotionEvent.ACTION_MOVE:
mLayoutParams.x = (int) (event.getRawX() - startX);
mLayoutParams.y = (int) (event.getRawY() - startY);
updateViewLayout();//更新mView 的位置
return true;
case MotionEvent.ACTION_UP:
long curTime = System.currentTimeMillis();
isMove = curTime - startTime > 100;
//判斷mView是在Window中的位置，以中間為界
if (mLayoutParams.x + mView.getMeasuredWidth() / 2 >= mWindowManager.getDefaultDisplay().getWidth() / 2) {
finalMoveX = mWindowManager.getDefaultDisplay().getWidth() - mView.getMeasuredWidth();
} else {
finalMoveX = 0;
}
//使用動畫移動mView
ValueAnimator animator = ValueAnimator.ofInt(mLayoutParams.x, finalMoveX).setDuration(Math.abs(mLayoutParams.x - finalMoveX));
animator.addUpdateListener((ValueAnimator animation) -> {
mLayoutParams.x = (int) animation.getAnimatedValue();
updateViewLayout();
});
animator.start();
return isMove;
}
return false;
}
});
4、注意
為了讓 Window 與 Activity 脫離，這裡我們採用 Service 來做，通過 Service 來新增和移除 View ；在許可權申請成功之後我們需要通知Service（其實是Activity，可能會有儲存資料等操作）作相應改變（提供一個介面給Service），然後在Service中使用廣播來通知Activity；最後一個需要注意的地方就是我們需要判斷應用程式是否在前臺還是後臺來新增或移除Window，這裡通過使用ActivityLifecycleCallbacks來監聽Activity在前臺的數量來判斷應用程式是在前臺還是後臺
class ApplicationLifecycle : Application.ActivityLifecycleCallbacks {
private var started: Int = 0
override fun onActivityPaused(activity: Activity?) {
}
override fun onActivityResumed(activity: Activity?) {
}
override fun onActivityStarted(activity: Activity?) {
started++
if (started == 1) {
Log.e("TAG", "應用在前臺了！！！")
}
}
override fun onActivityDestroyed(activity: Activity?) {
}
override fun onActivitySaveInstanceState(activity: Activity?, outState: Bundle?) {
}
override fun onActivityStopped(activity: Activity?) {
started--
if (started == 0) {
Log.e("TAG", "應用在後臺了！！！")
}
}
override fun onActivityCreated(activity: Activity?, savedInstanceState: Bundle?) {
}
}
本文程式碼已傳至 Github ，有需要的朋友可以下載下來看看。
參考
公眾號：IT先森養成記