页面重新加载js无限loading

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了页面重新加载js无限loading相关的知识,希望对你有一定的参考价值。

参考技术A 把top勾选去掉。
把top勾选去掉,页面就不会一直loading,可以用JS代码再巩固一下。

Loading加载页面

一般页面有四种情况

加载中 :就是滚动页面,后台获取加载的数据,每个页面的数据不同所以就让子类来实现,直接抽象abstract了。

加载失败 :一般都需要点击后重新加载

空页面 :也需要点击后重新加载

加载成功 :显示成功的页面,每个页面都不同所以让子类实现,那必须是抽象的 abstract了

我采取的是每个页面都是framelayout来显示 加载的页面。一共有四个页面。通过加载的数据返回来的 状态 进而让页面显示相应的动画

先屡一下思路

1 先加载三个页面,开始都执行loading页面

2 加载数据, 用到了线程池处理耗时炒作,具体如何访问网络让子类来实现判断数据是否可用

3 数据可用显示 成功界面

数据不可用显示 加载失败页面

数据的list比如为0 加载空页面

  1 package com.example.every_text.view;
  2  
  3 import com.wang.cn.manager.ThreadManager;
  4 import com.wang.cn.utils.UIUtils;
  5  
  6 import android.content.Context;
  7 import android.os.SystemClock;
  8 import android.util.AttributeSet;
  9 import android.view.View;
 10 import android.widget.FrameLayout;
 11  
 12 /**
 13  * 先加顺序 load -->showPagerView-->createSuccessView
 14  *在子类中 耗时操作放到 load中,然后load返回一个状态,在showPagerView中根据状态选择 显示的页面
 15  *如果装在是成功的。那么久显示 createSuccessView
 16  */
 17 public abstract class LoadingPager extends FrameLayout {
 18  
 19     // 加载默认的状态
 20     private static final int STATE_UNLOADED = 1;
 21     // 加载的状态
 22     private static final int STATE_LOADING = 2;
 23     // 加载失败的状态
 24     private static final int STATE_ERROR = 3;
 25     // 加载空的状态
 26     private static final int STATE_EMPTY = 4;
 27     // 加载成功的状态
 28     private static final int STATE_SUCCEED = 5;
 29  
 30     private View mLoadingView;// 转圈的view
 31     private View mErrorView;// 错误的view
 32     private View mEmptyView;// 空的view
 33     private View mSucceedView;// 成功的view
 34  
 35     private int mState;// 默认的状态
 36  
 37     private int loadpage_empty;
 38     private int loadpage_error;
 39     private int loadpage_loading;
 40  
 41     public LoadingPager(Context context, int loading, int error, int empty) {
 42         super(context);
 43         loadpage_empty = empty;
 44         loadpage_error = error;
 45         loadpage_loading = loading;
 46         init();
 47     }
 48  
 49     public LoadingPager(Context context, AttributeSet attrs, int defStyle,
 50             int loading, int error, int empty) {
 51         super(context, attrs, defStyle);
 52         loadpage_empty = empty;
 53         loadpage_error = error;
 54         loadpage_loading = loading;
 55         init();
 56     }
 57  
 58     public LoadingPager(Context context, AttributeSet attrs, int loading,
 59             int error, int empty) {
 60         super(context, attrs);
 61  
 62         init();
 63     }
 64     private void init() {
 65         // 初始化状态
 66         mState = STATE_UNLOADED;
 67         // 初始化三个 状态的view 这个时候 三个状态的view叠加在一起了
 68         mLoadingView = createLoadingView();
 69         if (null != mLoadingView) {
 70             addView(mLoadingView, new LayoutParams(LayoutParams.MATCH_PARENT,
 71                     LayoutParams.MATCH_PARENT));
 72         }
 73         mErrorView = createErrorView();
 74         if (null != mErrorView) {
 75             addView(mErrorView, new LayoutParams(LayoutParams.MATCH_PARENT,
 76                     LayoutParams.MATCH_PARENT));
 77         }
 78         mEmptyView = createEmptyView();
 79         if (null != mEmptyView) {
 80             addView(mEmptyView, new LayoutParams(LayoutParams.MATCH_PARENT,
 81                     LayoutParams.MATCH_PARENT));
 82         }
 83         showSafePagerView();
 84     }
 85     private void showSafePagerView() {
 86         // 直接运行到主线程
 87         UIUtils.runInMainThread(new Runnable() {
 88             @Override
 89             public void run() {
 90                 showPagerView();
 91             }
 92         });
 93     }
 94     private void showPagerView() {
 95  
 96         // 這個時候 都不為空 mState默認是STATE_UNLOADED狀態所以只顯示 lodaing 下面的 error
 97         // 和empty暂时不显示
 98         if (null != mLoadingView) {
 99             mLoadingView.setVisibility(mState == STATE_UNLOADED
100                     || mState == STATE_LOADING ? View.VISIBLE :
101  
102             View.INVISIBLE);
103         }
104         if (null != mErrorView) {
105             mErrorView.setVisibility(mState == STATE_ERROR ? View.VISIBLE
106                     : View.INVISIBLE);
107         }
108         if (null != mEmptyView) {
109             mEmptyView.setVisibility(mState == STATE_EMPTY ? View.VISIBLE
110                     : View.INVISIBLE);
111         }
112  
113         if (mState == STATE_SUCCEED && mSucceedView == null) {
114             mSucceedView = createSuccessView();
115             addView(mSucceedView, new LayoutParams
116  
117             (LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT));
118         }
119         if (null != mSucceedView) {
120             mSucceedView.setVisibility(mState == STATE_SUCCEED ?
121  
122             View.VISIBLE : View.INVISIBLE);
123         }
124     }
125     public void show() {
126         // 第一次进来肯定要 转圈的 所以就算是 error和empty 也要让状态是 unload
127         if (mState == STATE_ERROR || mState == STATE_EMPTY) {
128             mState = STATE_UNLOADED;
129         }
130         // 如果是unload 就把状态 变为 loading了 这时候从服务器拿数据
131         if (mState == STATE_UNLOADED) {
132             mState = STATE_LOADING;
133  
134             TaskRunnable task = new TaskRunnable();
135             ThreadManager.getLongPool().execute(task);
136         }
137         showSafePagerView();
138     }
139     /**
140      * 制作界面
141      *
142      * @return
143      */
144     protected abstract View createSuccessView();
145  
146     /**
147      * 处理下载 耗时操作
148      *
149      * @return
150      */
151     protected abstract LoadResult load();
152  
153     /**
154      * 空界面
155      *
156      * @return
157      */
158     public View createEmptyView() {
159         if (loadpage_empty != 0) {
160             return UIUtils.inflate(loadpage_empty);
161         }
162         return null;
163  
164     }
165  
166     /**
167      * 失败的页面
168      *
169      * @return
170      */
171     public View createErrorView() {
172         if (loadpage_empty != 0) {
173             return UIUtils.inflate(loadpage_error);
174         }
175         return null;
176     }
177  
178     /**
179      * 正在旋转的页面
180      *
181      * @return
182      */
183     public View createLoadingView() {
184         if (loadpage_empty != 0) {
185             return UIUtils.inflate(loadpage_loading);
186         }
187         return null;
188     }
189  
190     class TaskRunnable implements Runnable {
191         @Override
192         public void run() {
193             final LoadResult loadResult = load();
194             SystemClock.sleep(500);
195             UIUtils.runInMainThread(new Runnable() {
196                 @Override
197                 public void run() {
198                     mState = loadResult.getValue();
199                     showPagerView();
200                 }
201             });
202         }
203     }
204     public enum LoadResult {
205         ERROR(3), EMPTY(4), SUCCESS(5);
206         int value;
207  
208         LoadResult(int value) {
209             this.value = value;
210         }
211  
212         public int getValue() {
213             return value;
214         }
215     }
216 }

 

 1 package com.wang.cn.base;
 2  
 3 import com.example.every_text.view.LoadingPager;
 4 import com.example.every_text.view.LoadingPager.LoadResult;
 5 import com.wang.cn.R;
 6 import com.wang.cn.utils.UIUtils;
 7  
 8 import android.app.Activity;
 9 import android.os.Bundle;
10 import android.view.View;
11 import android.view.View.OnClickListener;
12  
13 /**
14  * @version 创建时间:2015年7月8日 上午11:31:11 类说明 activity的基类
15  */
16 public abstract class BaseActivity extends Activity {
17     public LoadingPager loadingPage;
18  
19     @Override
20     protected void onCreate(Bundle savedInstanceState) {
21         super.onCreate(savedInstanceState);
22  
23         loadingPage = new LoadingPager(UIUtils.getContext(),
24                 R.layout.loadpage_loading, R.layout.loadpage_error,
25                 R.layout.loadpage_empty)//加载了三个页面
26         {
27             @Override
28             protected LoadResult load() {
29                 return BaseActivity.this.load();//传递给子类
30             }
31             @Override
32             protected View createSuccessView() {
33                 return BaseActivity.this.createSuccessView();//传递给子类
34             }
35         };
36 //      可以点击
37         loadingPage.setOnClickListener(new OnClickListener() {
38             @Override
39             public void onClick(View v) {
40                 loadingPage.show();
41             }
42         });
43 //      显示 loading的页面
44         loadingPage.show();
45         setContentView(loadingPage);
46     }
47  
48     /**
49      * 刷新页面工程
50      *
51      * @return
52      */
53     protected abstract View createSuccessView();
54  
55     /**
56      * 请求服务器 获取当前状态
57      *
58      */
59     protected abstract LoadResult load();
60  
61 }

 

 1 package com.wang.cn;
 2  
 3 import android.content.Intent;
 4 import android.os.SystemClock;
 5 import android.view.View;
 6 import android.view.View.OnClickListener;
 7 import android.widget.TextView;
 8  
 9 import com.example.every_text.view.LoadingPager.LoadResult;
10 import com.wang.cn.base.BaseActivity;
11 import com.wang.cn.utils.UIUtils;
12 import com.wang.cn.utils.ViewUtils;
13  
14 /**
15  * @version 创建时间:2015年7月8日 上午11:31:11 类说明 主函数
16  */
17 public class MainActivity extends BaseActivity {
18     // 刷新页面工程
19     @Override
20     protected View createSuccessView() {
21         View inflate = UIUtils.inflate(R.layout.activity_main);
22  
23         TextView tv=ViewUtils.findViewById(inflate, R.id.textView1);
24         tv.setOnClickListener(new OnClickListener() {
25  
26             @Override
27             public void onClick(View v) {
28                 Intent intent=new Intent(UIUtils.getContext(),FragmetActivity.class);
29                 startActivity(intent);
30             }
31         });
32         return inflate;
33     }
34  
35     // 刷新页面工程
36     @Override
37     protected LoadResult load() {
38         SystemClock.sleep(2000);
39         return LoadResult.SUCCESS;
40     }
41 }

 

以上是关于页面重新加载js无限loading的主要内容,如果未能解决你的问题,请参考以下文章

JS实现-页面数据无限加载

JS实现-页面数据无限加载

贝宝用户登录页面(点击贝宝按钮后的页面)无限期重新加载,添加“&vault=true&intent=subscription”

如何在无限滚动中重新加载脚本

在 Python 中使用 PhantomJS 向下滚动到无限页面的底部

如何处理离子无限重新加载ios应用程序