因為趕專案本人停更兩個月 從今天開始又可以更新了 今天說一下這個可隨意拖動的view 簡單說一下這個view效果 和 發展 一開始這種效果是使用在網頁端的特別是購物類 例如某寶 某東 購物車和客服視窗 都有使用這個懸浮可拖動的設計效果 後來才發展到的移動端 還有手機桌面也是用到了這種效果 例如某族手機的訊息中心 手機桌面的懸浮球 某訊 和 某榮耀手遊 某吃雞遊戲 某視訊軟體等等也都是這種效果 這種方式的好處就是是可以隨時隨地的快速進去到你需要的頁面 目前來說 有很多的大型app選擇了這種互動方式 服務使用者 ；
下面說一下android 端的使用及實現

先看一下效果圖

編碼思路

首先實現這種效果的方式有兩種 一是自定義viewgroup 自定義容器 需要獲取手機懸浮窗許可權和處理各種事件 二 使用自定義view 第一種方式相對簡單一些 但是使用效果不好 所以我也就放棄掉了
今天主要說一下通過自定義view 的方式實現

自定義的主要思路 : 以ImageView為例

建立FreeView 繼承 ImageView

首先 獲取最大高度和寬度 設定view 的活動範圍 （主要考慮是否支援螢幕外 具體細節下面再說）

第二 通過onTouchEvent 觸控事件進行 位移計算 重置FreeView 的四角座標

第三 就是完成顯示

主要思路就這麼多 我的重點是第一步和第二步

注意
第一步 獲取最大高度和寬度 就是給定FreeView的活動範圍 最大寬度很容易獲取 需要注意的是最大高度 我們螢幕組成

window = statusbar + layout + navigationbar (從上倒下的順序)

受android碎片化影響 andorid手機的高度具有很多種不確定性 所以要做好高度的適配

還有第二個要注意的地方 這裡跟你的需求有關係 就是是否允許FreeView 出現在螢幕外 這種需求例如魅族手機的訊息中心 顆拖到螢幕邊緣 留下一個小尾巴 點選或者拖動時在展現給使用者

第二步 這裡主要是實現計算 和 實現方式 首先 onTouchEvent 通過觸控監聽MotionEvent.ACTION_DOWN 我可以得到點選時的座標 通過MotionEvent.ACTION_MOVE 可以得到離開時的座標 然後通過給FreeView設定layout 實現 位置重置 在這裡還要注意點選事件和拖動時間的衝突處理 程式碼中會有體現

import android.annotation.SuppressLint;
import android.content.Context;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.widget.ImageView;

import com.nade.commenlib.util.UiUtils;

/**
 *Created by Nade on 2018/10/2.
 *隨意拖動的view
 */

@SuppressLint("AppCompatCustomView")
public class FreeView extends ImageView {

    private int width; //  測量寬度 FreeView的寬度
    private int height; // 測量高度 FreeView的高度
    private int maxWidth; // 最大寬度 window 的寬度
    private int maxHeight; // 最大高度 window 的高度
    private Context context;
    private float downX; //點選時的x座標
    private float downY;  // 點選時的y座標
    //是否拖動標識
    private boolean isDrag=false;

    // 處理點選事件和滑動時間衝突時使用 返回是否拖動標識
    public boolean isDrag() {
        return isDrag;
    }

    // 初始化屬性
    public FreeView(Context context, AttributeSet attrs) {
        super(context, attrs);
        this.context=context;


    }
    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        // 獲取屏寬高 和 可是適用範圍 （我的需求是可在螢幕內拖動 不超出範圍 也不需要隱藏）
        width=getMeasuredWidth();
        height=getMeasuredHeight();
        maxWidth = UiUtils.getMaxWidth(context);
        //   maxHeight = UiUtils.getMaxHeight(context)-getStatusBarHeight();// 此時減去狀態列高度 注意如果有狀態列 要減去狀態列 如下行 得到的是可活動的高度
       maxHeight = UiUtils.getMaxHeight(context)-getStatusBarHeight() - getNavigationBarHeight();
    }
    // 獲取狀態列高度
    public int getStatusBarHeight(){
        int resourceId = getResources().getIdentifier("status_bar_height", "dimen", "android");
        return getResources().getDimensionPixelSize(resourceId);
    }
    // 獲取導航欄高度
    public int getNavigationBarHeight() {
        int rid = getResources().getIdentifier("config_showNavigationBar", "bool", "android");
        if (rid!=0){
            int resourceId = context.getResources().getIdentifier("navigation_bar_height", "dimen", "android");
            return context.getResources().getDimensionPixelSize(resourceId);
        }else
            return 0;

    }


    /**
     * 處理事件分發
     * @param event
     * @return
     */

    @Override
    public boolean onTouchEvent(MotionEvent event) {
        super.onTouchEvent(event);
        if (this.isEnabled()) {
            switch (event.getAction()) {
                case MotionEvent.ACTION_DOWN: // 點選動作處理 每次點選時將拖動狀態改為 false 並且記錄下點選時的座標 downX downY
                    isDrag=false;
                    downX = event.getX(); // 點選觸屏時的x座標 用於離開螢幕時的x座標作計算
                    downY = event.getY(); // 點選觸屏時的y座標 用於離開螢幕時的y座標作計算
                    break;
                case MotionEvent.ACTION_MOVE: // 滑動動作處理 記錄離開螢幕時的 moveX  moveY 用於計算距離 和 判斷滑動事件和點選事件 並作出響應
                    final float moveX = event.getX() - downX;
                    final float moveY = event.getY() - downY;
                    int l,r,t,b; // 上下左右四點移動後的偏移量
                    //計算偏移量 設定偏移量 = 3 時 為判斷點選事件和滑動事件的峰值
                    if (Math.abs(moveX) > 3 ||Math.abs(moveY) > 3) { // 偏移量的絕對值大於 3 為 滑動時間 並根據偏移量計算四點移動後的位置
                        l = (int) (getLeft() + moveX);
                        r = l+width;
                        t = (int) (getTop() + moveY);
                        b = t+height;
                        //不劃出邊界判斷,最大值為邊界值
                        // 如果你的需求是可以劃出邊界 此時你要計算可以劃出邊界的偏移量 最大不能超過自身寬度或者是高度  如果超過自身的寬度和高度 view 劃出邊界後 就無法再拖動到介面內了 注意
                        if(l<0){ // left 小於 0 就是滑出邊界 賦值為 0 ; right 右邊的座標就是自身寬度 如果可以劃出邊界 left right top bottom 最小值的絕對值 不能大於自身的寬高
                            l=0;
                            r=l+width;
                        }else if(r> maxWidth){ // 判斷 right 並賦值
                            r= maxWidth;
                            l=r-width;
                        }
                        if(t<0){ // top
                            t=0;
                            b=t+height;
                        }else if(b> maxHeight){ // bottom
                            b= maxHeight;
                            t=b-height;
                        }
                        this.layout(l, t, r, b); // 重置view在layout 中位置
                        isDrag=true;  // 重置 拖動為 true
                    }else {
                        isDrag=false; // 小於峰值3時 為點選事件
                    }
                    break;
                case MotionEvent.ACTION_UP: // 不處理
                    setPressed(false);
                    break;
                case MotionEvent.ACTION_CANCEL: // 不處理
                    setPressed(false);
                    break;
            }
            return true;
        }
        return false;
    }
}
 

註釋寫的很清晰了 不懂得可以看程式碼 我說一下點選事件的處理 我暴漏了一個方法
public boolean isDrag() {
return isDrag;
}
這個方法返回一個boolean 適用於標識是否滑動 我們利用這個值進行區分點選事件和滑動事件
好 看一下使用

freeview = findViewById(R.id.main_freeview);
freeview.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
if (!freeview.isDrag()) {
Toast.makeText(MainActivity.this, “點選了freeview”, Toast.LENGTH_SHORT).show();
}
}
});

此時只要處理點選事件即可
好了 本文到此完結 如有疑問歡迎私信和留言 原始碼在這裡就不上傳了 有需要可以加我的群 675234574 或加我微信

下面是工具類

import android.content.Context;
import android.util.DisplayMetrics;
import android.view.WindowManager;

public class UiUtil {
// 獲取最大寬度
public static int getMaxWidth(Context context) {
WindowManager wm = (WindowManager) context.getSystemService( Context.WINDOW_SERVICE );
DisplayMetrics dm = new DisplayMetrics();
wm.getDefaultDisplay().getMetrics( dm );
return dm.widthPixels;
}
// 獲取最大高度
public static int getMaxHeight(Context context) {
WindowManager wm = (WindowManager) context.getSystemService( Context.WINDOW_SERVICE );
DisplayMetrics dm = new DisplayMetrics();
wm.getDefaultDisplay().getMetrics( dm );
return dm.heightPixels;
}
}