如何在加载数据的时候给一个等待动画

有时候我们的数据是比较大的,在查询的时候加载很慢,那么为了友好的提示,于是想到了给一个等待的界面,让用户知道这个正在加载中。话不多说了,直接上代码:

js代码:

<script type="text/javascript">
        jQuery(window).load(function () {
            //            "use strict";
            //            // Page Preloader
            jQuery('#preloader').delay(350).fadeOut(function () {
                jQuery('body').delay(350).css({ 'overflow': 'visible' });
            });
        });

</script>

样式:

<style type="text/css">
        /* preloader */
        #preloader
        {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: #e4e7ea;
            z-index: 10000;
        }
        
        #status
        {
            width: 120px;
            height: 40px;
            line-height: 40px;
            position: absolute;
            left: 47%;
            top: 40%;
            font-size: 12pt;
            font-family: 宋体;
        }
        #status span
        {
            float: right;
        }
    </style>

HTML代码如下:

<%--加载时的提示图片--%>
    <div id="preloader">
        <div id="status">
            <img src="../../dong.gif" width="40" height="40" /><span>数据加载中...</span>
        </div>
    </div>
    <%----%>

<div>

<%--这里放的时候你的数据,比如你用的GridView啊,或者DataList啊绑定数据的控件--%>

</div>

转载于:https://www.cnblogs.com/LoveQin/p/4675394.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
实现这种下拉加载的方式可以使用 Android 中的 SwipeRefreshLayout 和 ListView,具体步骤如下: 1. 在布局文件中添加 SwipeRefreshLayout 和 ListView。 ``` <android.support.v4.widget.SwipeRefreshLayout android:id="@+id/swipeRefreshLayout" android:layout_width="match_parent" android:layout_height="match_parent"> <ListView android:id="@+id/listView" android:layout_width="match_parent" android:layout_height="match_parent" /> </android.support.v4.widget.SwipeRefreshLayout> ``` 2. 在 Activity 或 Fragment 中获取 SwipeRefreshLayout 和 ListView 对象,并为 SwipeRefreshLayout 设置下拉刷新监听器。 ``` SwipeRefreshLayout swipeRefreshLayout = (SwipeRefreshLayout) findViewById(R.id.swipeRefreshLayout); ListView listView = (ListView) findViewById(R.id.listView); swipeRefreshLayout.setOnRefreshListener(new SwipeRefreshLayout.OnRefreshListener() { @Override public void onRefresh() { // 下拉刷新时触发的操作 // 加载数据,更新 ListView // 停止刷新动画 swipeRefreshLayout.setRefreshing(false); } }); ``` 3. 当用户下拉 SwipeRefreshLayout 后,触发 onRefresh 方法,此时可以进行数据加载的操作。加载完成后,更新 ListView,并停止 SwipeRefreshLayout 的刷新动画。 需要注意的是,在数据加载时,可能会有等待时间,可以使用 AsyncTask 或 ThreadPoolExecutor 等方式进行异步加载,避免阻塞 UI 线程。同时,为了避免用户重复下拉刷新,最好在加载数据时禁用 SwipeRefreshLayout 的下拉刷新功能。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值