1. 概述與分析

在實(shí)際項(xiàng)目中，我們不可避免的需要網(wǎng)絡(luò)請求數(shù)據(jù)，由于網(wǎng)絡(luò)或請求方式等主觀或客觀原因，導(dǎo)致我們請求的結(jié)果有時(shí)會(huì)出現(xiàn)一些偏差，從而導(dǎo)致我們UI界面顯示也會(huì)有所不同。一般情況下，網(wǎng)絡(luò)請求后我們的界面一般呈現(xiàn)三種頁面狀態(tài)：“正在加載中”、“加載失敗”和“加載成功”。那么就可以通過網(wǎng)絡(luò)請求后結(jié)果讓UI界面自動(dòng)切換，

創(chuàng)新互聯(lián)是一家專注于網(wǎng)站建設(shè)、成都做網(wǎng)站與策劃設(shè)計(jì),魏都網(wǎng)站建設(shè)哪家好?創(chuàng)新互聯(lián)做網(wǎng)站,專注于網(wǎng)站建設(shè)10余年,網(wǎng)設(shè)計(jì)領(lǐng)域的專業(yè)建站公司;建站業(yè)務(wù)涵蓋:魏都等地區(qū)。魏都做網(wǎng)站價(jià)格咨詢:18980820575

2. 設(shè)計(jì)思路

通常情況下，正在加載和加載失敗的界面都是相同的，只有加載成功后的界面不同。為了能讓UI界面隨著網(wǎng)絡(luò)請求結(jié)果自動(dòng)切換，那我們可以按照如下思路去設(shè)計(jì)：

1: 將三種狀態(tài)的界面疊加在一起

2: 定義三種狀態(tài)

3: 定義一個(gè)當(dāng)前狀態(tài)

4: 定義一個(gè)根據(jù)當(dāng)前狀態(tài)來切換界面的方法

5: 定義一個(gè)根據(jù)網(wǎng)絡(luò)請求返回結(jié)果自動(dòng)切換界面的方法

綜上分析，我們可以得出如下框架原理圖：

3. 代碼實(shí)現(xiàn)

原理上面已經(jīng)分析清楚了，下面我們就將原理用代碼來實(shí)現(xiàn)：

/**
* author:salmonzhang
* Description:UI切換框架
 * Date:2017/8/6 0018 10:05
 */

public abstract class LoadPager extends FrameLayout {

private View mLoadingView;
private View mSuccessView;
private View mErrorView;

public LoadPager(@NonNull Context context) {
    this(context, null);
}

public LoadPager(@NonNull Context context, @Nullable AttributeSet attrs) {
    this(context, attrs, 0);
}

public LoadPager(@NonNull Context context, @Nullable AttributeSet attrs, @AttrRes int defStyleAttr) {
    super(context, attrs, defStyleAttr);
    init();
}

//初始化UI框架三個(gè)界面
private void init() {
    //正在加載界面
    if (mLoadingView == null) {
        //此處正在加載界面的布局需要手動(dòng)加入
        mLoadingView = View.inflate(getContext(), R.layout.page_loading, null);
    }

    //加載成功界面
    if (mSuccessView == null) {
        //成功的布局誰用誰傳
        mSuccessView = createSuccessView();
        if (mSuccessView == null) {
            throw new RuntimeException("親，請?zhí)砑右粋€(gè)布局");
        }
    }

    //加載失敗的界面
    if (mErrorView == null) {
        //此處加載失敗界面的布局需要手動(dòng)加入
        mErrorView = View.inflate(getContext(), R.layout.page_error, null);
    }

    //將三個(gè)布局添加在一起
    addView(mLoadingView);
    addView(mSuccessView);
    addView(mErrorView);

    //頁面切換的方法
    changeView();

    //根據(jù)網(wǎng)絡(luò)數(shù)據(jù)，自動(dòng)切換頁面
    autoShowPager();

}

//自動(dòng)切換頁面
private void autoShowPager() {
    new Thread(new Runnable() {
        @Override
        public void run() {
            //獲取網(wǎng)絡(luò)數(shù)據(jù)
            Object obj = getNetData();
            //校驗(yàn)數(shù)據(jù)，根據(jù)返回狀態(tài)自動(dòng)切換狀態(tài)
            mCurrentState = checkData(obj);
            //主線程去修改界面（注：這里我調(diào)用的是我工具類中的runOnUIThread方法）
            Utils.runOnUIThread(new Runnable() {
                @Override
                public void run() {
                    changeView();
                }
            });
        }
    }).start();
}

//校驗(yàn)數(shù)據(jù)
private STATE checkData(Object obj) {
    if (obj == null) {//如果數(shù)據(jù)為空，則失敗
        return STATE.ERROR;
    } else {
        if (obj instanceof List) {//如果返回的是數(shù)組
            List list = (List) obj;
            if (list.size() > 0) {
                return STATE.SUCCESS;
            } else {
                return STATE.ERROR;
            }
        } else {//如果是對象
            return STATE.SUCCESS;
        }
    }
}

//頁面切換方法
private void changeView() {
    //先將三個(gè)頁面都隱藏
    mLoadingView.setVisibility(GONE);
    mSuccessView.setVisibility(GONE);
    mErrorView.setVisibility(GONE);

    //根據(jù)當(dāng)前狀態(tài)切換
    switch (mCurrentState) {
        case LOADING:
            mLoadingView.setVisibility(VISIBLE);
            break;
        case SUCCESS:
            mSuccessView.setVisibility(VISIBLE);
            break;
        case ERROR:
            mErrorView.setVisibility(VISIBLE);
            break;
    }
}

//定義三個(gè)狀態(tài)
public enum STATE {
    LOADING,//正在加載中
    SUCCESS,//加載成功
    ERROR;//加載失敗
}

//定義一個(gè)當(dāng)前狀態(tài)（默認(rèn)正在加載中）
private STATE mCurrentState = STATE.LOADING;

//創(chuàng)建一個(gè)加載成功的界面
public abstract View createSuccessView();

//請求網(wǎng)絡(luò)數(shù)據(jù)
public abstract Object getNetData();
}

4. UI框架的使用

在開發(fā)中我們一般都會(huì)定義一個(gè)BaseFragment,當(dāng)涉及到網(wǎng)絡(luò)請求數(shù)據(jù)時(shí)，此時(shí)就可以在onCreateView方法中使用UI自動(dòng)切換框架來加載布局。示例代碼如下：

public abstract class BaseFragment extends Fragment {
public LoadPager mLoadPager;
@Nullable
@Override
public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
    //使用UI自動(dòng)切換框架加載頁面
    if (mLoadPager == null) {
        mLoadPager = new LoadPager(getContext()) {
            @Override
            public Object getNetData() {
                return questData();
            }

            @Override
            public View createSuccessView() {
                return createItemView();
            }
        };
    }
    return mLoadPager;
}

//子類創(chuàng)建布局
public abstract View createItemView();

//子類實(shí)現(xiàn)數(shù)據(jù)請求
public abstract Object questData();
}

好了，上面就是網(wǎng)絡(luò)請求UI自動(dòng)切換框架的分析、實(shí)現(xiàn)和使用。希望對你有所幫助，不足之處，望指正，多謝！

分享標(biāo)題：網(wǎng)絡(luò)請求UI自動(dòng)切換框架
轉(zhuǎn)載源于：http://jinyejixie.com/article10/jjhsdo.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供靜態(tài)網(wǎng)站、網(wǎng)頁設(shè)計(jì)公司、網(wǎng)站排名、軟件開發(fā)、企業(yè)網(wǎng)站制作、全網(wǎng)營銷推廣

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源： 創(chuàng)新互聯(lián)