高仿微博等待動畫loading——等待動畫的實現

一個等待時加載Loading動畫效果git

背景

  • 你們都知道,當咱們在app開發的時候,通常少不了,好比當請求網絡數據時,確定網速很差的時候。github

  • 在這種狀況下,加載的時候比較慢,因此若是此時已經進入了新的界面,那麼確定很差看。bash

因此通常都會有一個loading等待提示框,告訴用戶正在加載中,給用戶更好的體驗。所以這就是我教你們實現的效果,先看一下效果圖吧:微信

等待加載動畫
等待加載動畫

我這裏使用了一個handler延遲兩秒鐘讓它消失不見。固然項目中你們能夠監聽本身所須要的方法,使加載框消失。網絡

這只是簡單的兩種實現方式,固然還有更好的其餘效果,具體能夠本身實現如下,也能夠去網上搜索一下。app

說主題吧,我這裏只是講一下思路,具體代碼能夠試着寫一下,固然我在最後會給你們放源代碼下載地址。ide

第一步,先寫一個自定義dialog,代碼也比較詳細。就是建立一個dialog,如:佈局

public static Dialog createLoadingDialog(Context context, String msg) {
        LayoutInflater inflater = LayoutInflater.from(context);
        View v = inflater.inflate(R.layout.dialog_loading, null);// 獲得加載view
        LinearLayout layout = (LinearLayout) v
                .findViewById(R.id.dialog_loading_view);// 加載佈局
        TextView tipTextView = (TextView) v.findViewById(R.id.tipTextView);// 提示文字
        tipTextView.setText(msg);// 設置加載信息

        Dialog loadingDialog = new Dialog(context, R.style.MyDialogStyle);// 建立自定義樣式dialog
        loadingDialog.setCancelable(true); // 是否能夠按「返回鍵」消失
        loadingDialog.setCanceledOnTouchOutside(false); // 點擊加載框之外的區域
        loadingDialog.setContentView(layout, new LinearLayout.LayoutParams(
                LinearLayout.LayoutParams.MATCH_PARENT,
                LinearLayout.LayoutParams.MATCH_PARENT));// 設置佈局
        /**
         *將顯示Dialog的方法封裝在這裏面
         */
        Window window = loadingDialog.getWindow();
        WindowManager.LayoutParams lp = window.getAttributes();
        lp.width = WindowManager.LayoutParams.MATCH_PARENT;
        lp.height = WindowManager.LayoutParams.WRAP_CONTENT;
        window.setGravity(Gravity.CENTER);
        window.setAttributes(lp);
        window.setWindowAnimations(R.style.PopWindowAnimStyle);
        loadingDialog.show();

        return loadingDialog;
    }複製代碼

而後咱們就能夠看到返回的是dialog對象,咱們在咱們的類中調用便可。固然,有顯示,就有關閉,咱們直接將關閉的方法,也封裝在自定義dialog中。動畫

/**
     * 關閉dialog
     *
     * @param mDialogUtils
     */
    public static void closeDialog(Dialog mDialogUtils) {
        if (mDialogUtils != null && mDialogUtils.isShowing()) {
            mDialogUtils.dismiss();
        }
    }複製代碼

而後咱們進行調用便可。咱們這裏只是告訴你們實現的思路,由於涉及到了一些圖片素材,ui

因此,我在這裏提供一下這兩種實現方式的源代碼,因此你們能夠參考一下.

github項目:

github.com/QQ986945193…

相信本身,沒有作不到的,只有想不到的

若是你以爲此文對您有所幫助,歡迎入羣 QQ交流羣 :644196190
微信公衆號:終端研發部

技術+職場
技術+職場
相關文章
相關標籤/搜索