Android (项目一)xListView 的使用及ProgressBar样式修改

  
  前几天做项目有个下拉刷新,效果是上面图片展示的,一开始感觉应该挺难做的因为下拉刷新的时候有个图片会进行180度旋转,而且松手后是一个ProgressBar,感觉很纠结,是要自己写吗?自己写出也太麻烦了。后来才发现原来这个下拉刷新是有开源项目可以利用的,那就是xListView。所有的新东西都是一样的,由于我们对它的不熟悉会感觉使用起来特别的困难,而xListView的使用上,在GitHub上面介绍的也不很详细,这样就需要去仔细研究它给出的Demo。
  了解它的第一步就是去官网下载Demo。
Android (项目一)xListView 的使用及ProgressBar样式修改_第1张图片
可以看到xListView现在已经停止维护了,但是停止维护并不代表我们不能再继续使用了。
点击xListView下载连接

xListViewDemo分析

1、使用步骤
先去官网下载Demo
2、将在Android Studio你的工程下面新建一个package,package下面放置Demo中的三个java文件,并将相应的需要的文件与布局都复制到自己的project下面。
Android (项目一)xListView 的使用及ProgressBar样式修改_第2张图片
3、实际上就按照Demo中所给的代码使用即可,先来看下Demo是怎么使用的。
这里只是简单介绍它的使用注意点和几个方法。
(1)注意继承IXListViewListener,实现里面的两个方法。
(2)上拉刷新与下拉加载的使能与监听的设置

        //下拉加载使能
        mListView.setPullLoadEnable(true);
        //上拉刷新使能
    mListView.setPullRefreshEnable(true);
    //上拉刷新与下拉加载监听
    mListView.setXListViewListener(this);
    //设置单个点击事件的监听
    mXListView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> parent, View view, int position, long id) {

            }
        });

(3)关于方法
下拉刷新的方法,这里使用handler的原因是UI线程不允许对其他线程对他进行操作,因此使用handler。

@Override
    public void onRefresh() {
        mHandler.postDelayed(new Runnable() {
            @Override
            public void run() {
                start = ++refreshCnt;
                items.clear();
                //对items进行了重新赋值
                geneItems();
                 //重新设置adapter
                mAdapter = new ArrayAdapter<String>(XListViewActivity.this, R.layout.list_item, items);
                mListView.setAdapter(mAdapter);
                onLoad();
            }
        }, 2000);
    }

停止刷新

private void onLoad() {
        mListView.stopRefresh();
        mListView.stopLoadMore();
        mListView.setRefreshTime("刚刚");
    }

上拉加载

@Override
    public void onLoadMore() {
        mHandler.postDelayed(new Runnable() {
            @Override
            public void run() {
                geneItems();
                mAdapter.notifyDataSetChanged();
                onLoad();
            }
        }, 2000);
    }

xListView使用实例

1、布局调用

<com.example.daydayup.xlistview.XListView
        android:id="@+id/xlistview_promotionrequest_data"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp"
        android:background="@color/white"
        >
    </com.example.daydayup.xlistview.XListView>
</LinearLayout>

2、xListView的Adapter(布局就是按照上面图片展示的xLisView的item布局的)

public class SimpleListAdapter extends BaseAdapter {
   private List<PromotionReqTable> mData;
    private LayoutInflater mInflater;

    public SimpleListAdapter(LayoutInflater mInflater, List<PromotionReqTable> mData) {
        this.mInflater = mInflater;
        this.mData = mData;
    }

    @Override
    public int getCount() {
        return mData.size();
    }

    @Override
    public Object getItem(int position) {
        return position;
    }

    @Override
    public long getItemId(int position) {
        return position;
    }

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        ViewHolder vh=null;
        PromotionReqTable data=mData.get(position);
        if(convertView==null){
            vh=new ViewHolder();
            convertView=mInflater.inflate(R.layout.activity_prmotionrequest_listview_item,null,false);

            vh.mTextViewCusName= (TextView) convertView.findViewById(R.id.textview_promotionrequest_cusname);
            vh.mTextViewCusBumber= (TextView) convertView.findViewById(R.id.textview_promotionrequest_number);
            vh.mTextViewIsPass= (TextView) convertView.findViewById(R.id.textview_promotionrequest_ispass);
            vh.mTextViewTime= (TextView) convertView.findViewById(R.id.textview_promotionrequest_time);
            convertView.setTag(vh);
        }else{

            vh= (ViewHolder) convertView.getTag();
        }
         vh.mTextViewCusName.setText(data.getCusname());
         vh.mTextViewCusBumber.setText(data.getPromotionnum());
         vh.mTextViewTime.setText(data.getTime());
         vh.mTextViewIsPass.setText(data.getIspass());
        return convertView;
    }
    class ViewHolder{
        TextView mTextViewCusName;
        TextView mTextViewIsPass;
        TextView mTextViewTime;
        TextView mTextViewCusBumber;
    }
}

3、设置xListView

public class PromotionRequestFragment extends BaseFragment implements XListView.IXListViewListener,View.OnClickListener,CompoundButton.OnCheckedChangeListener{
  @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
  mXListView= (XListView) view.findViewById(R.id.xlistview_promotionrequest_data);
     initelistview();  
}
private void  initelistview(){
        mHandler = new Handler();
        mAdapter=new SimpleListAdapter(mInflater,mData);
        mXListView.setAdapter(mAdapter);
        mXListView.setXListViewListener(this);
        mXListView.setPullRefreshEnable(true);
        mXListView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
                mTextViewProDetailDialogCusName.setText(mData.get(position).getCusname());
                mTextViewProDetailDialogStartTime.setText(mData.get(position).getTime());
                mTextViewProDetailDialogEndTime.setText(mData.get(position).getTime());
                mDialogProDetail.show();
            }
        });
}

4、XListView的三个方法(xListView的item的改变实际上就是对Data重新赋值,然后重新设置Adapter,之重新设置xListView)

  @Override
    public void onRefresh() {
         final SimpleDateFormat formatupdate=new SimpleDateFormat("MM-dd HH:mm");
         final Date mDateupdate=new Date();
        mHandler.postDelayed(new Runnable() {
            @Override
            public void run() {

                mData.clear();
                mData = DbXutilsOperation.findAll(PromotionReqTable.class);
                // mAdapter.notifyDataSetChanged();
                mAdapter = new SimpleListAdapter(mInflater, mData);
                mXListView.setAdapter(mAdapter);
                onLoad(formatupdate.format(mDateupdate));
            }
        }, 2000);
    }

    @Override
    public void onLoadMore() {
        final SimpleDateFormat formatupdate=new SimpleDateFormat("MM-dd HH:mm");
        final Date mDateupdate=new Date();
        mHandler.postDelayed(new Runnable() {
            @Override
            public void run() {
                mData = DbXutilsOperation.findAll(PromotionReqTable.class);

                mAdapter.notifyDataSetChanged();
                onLoad(formatupdate.format(mDateupdate));
            }
        }, 2000);
    }
    private void onLoad(String time) {
        mXListView.stopRefresh();
        mXListView.stopLoadMore();
        mXListView.setRefreshTime(time);
    }

    @Override
    public void onClick(View view) {
        switch (view.getId()){
            case R.id.textview_prmotionreq_alldata:  dialog.show();break;
            case R.id.button_promotionreq_back:getActivity().finish();break;
            case R.id.button_promotionreq_add:dialog.dismiss();
                Intent intent=new Intent(getActivity(), PromotionManagerAdd.class);
                startActivity(intent);
                break;
        }



    }

实现效果与图片展示基本一致,但是progressbar是默认的样式,灰色的,要想修改需要我们自己进行设置。

xListView修改ProgressBar样式

1、自定义圆形

<?xml version="1.0" encoding="utf-8"?>
<!-- 自定义圆形progressbar的颜色和图片 -->
<rotate xmlns:android="http://schemas.android.com/apk/res/android" android:pivotX="50%" android:pivotY="50%" android:fromDegrees="0" android:toDegrees="360">
    <shape android:shape="ring" android:innerRadiusRatio="3" android:thicknessRatio="8" android:useLevel="false" >
        <gradient android:type="sweep" android:useLevel="false" android:startColor="#bcff0000" android:endColor="#00FF0000" android:centerY="0.5" />
    </shape>

</rotate>

2、在xListView的Header布局中的ProgressBar设置属性
,将图片换成自己绘制的图片

android:indeterminateDrawable="@drawable/circle_progressbar_style"

样式设置

  <ProgressBar  android:id="@+id/xlistview_header_progressbar" android:layout_width="30dp" android:layout_height="30dp" android:layout_alignLeft="@id/xlistview_header_text" android:layout_centerVertical="true" android:layout_marginLeft="-40dp" android:indeterminate="false" android:indeterminateDrawable="@drawable/circle_progressbar_style" android:visibility="invisible" android:indeterminateDuration="700" android:indeterminateBehavior="repeat" android:indeterminateOnly="true" />
    </RelativeLayout>

这样就可以实现上面图片展示的ProgressBar的红色圈的样式了

你可能感兴趣的:(Android (项目一)xListView 的使用及ProgressBar样式修改)