可拖拽listview基本使用技巧(DragSortListView)
2015-06-30 12:10
399 查看
可拖拽的listview,DragSortListView这是gitHub上的一个开源项目。链接点击打开链接。这个开源控件主要是为了实现listview的 item上下拖拽效果以便达到美化界面的作用。
先来看三张效果图。
第一张为初始的DragSortListView效果图。再来看下面拖动效果的。
这张就是在点击item右端黑色按钮后的拖动效果(看起来还不错的样子。。。。。。)
最后拖动结束item位置互换。
基本用法
1 布局。
先来看主界面布局。
[html] view
plaincopy
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:dslv="http://schemas.android.com/apk/res/com.mobeta.android.demodslv"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<com.mobeta.android.dslv.DragSortListView
android:id="@+id/dslvList"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1.0"
android:layout_margin="3dp"
android:dividerHeight="1px"
android:padding="3dp"
dslv:click_remove_id="@id/click_remove"
dslv:collapsed_height="1px"
dslv:drag_enabled="true"
dslv:drag_handle_id="@id/drag_handle"
dslv:drag_scroll_start="0.33"
dslv:drag_start_mode="onDown"
dslv:float_alpha="0.6"
dslv:remove_enabled="true"
dslv:remove_mode="clickRemove"
dslv:slide_shuffle_speed="0.3" />
</LinearLayout>
这里重点讲一下 click_remove_id 和drag_handle_id 这两个属性。这两个属性的值,分别是左边红色删除按钮和最右边拖动按钮的id。
接下来是item布局
[html] view
plaincopy
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="#ffffff"
android:padding="10dp">
<ImageView
android:id="@id/click_remove"
android:background="@drawable/delete_x"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:layout_marginRight="10dp"/>
<ImageView
android:id="@+id/ivCountryLogo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="@id/click_remove"
/>
<TextView
android:id="@+id/tvTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="15dp"
android:textColor="#000000"
android:text="name"
android:layout_toRightOf="@id/ivCountryLogo"/>
<ImageView
android:id="@id/drag_handle"
android:background="#000000"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
/>
</RelativeLayout>
这里没什么好讲的。
接下来将重点内容。适配器和编写和DragSortListView的设置。
[java] view
plaincopy
package com.mobeta.android.demodslv;
import java.util.List;
import com.mobeta.android.demodslv.AMRateDragActivity.body;
import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.ImageView;
import android.widget.TextView;
public class AMDragRateAdapter extends BaseAdapter {
private Context context;
List<body> items;//适配器的数据源
public AMDragRateAdapter(Context context,List<body> list){
this.context = context;
this.items = list;
}
@Override
public int getCount() {
// TODO Auto-generated method stub
return items.size();
}
@Override
public Object getItem(int arg0) {
// TODO Auto-generated method stub
return items.get(arg0);
}
@Override
public long getItemId(int arg0) {
// TODO Auto-generated method stub
return arg0;
}
public void remove(int arg0) {//删除指定位置的item
items.remove(arg0);
this.notifyDataSetChanged();//不要忘记更改适配器对象的数据源
}
public void insert(body item, int arg0) {在指定位置插入item
items.add(arg0, item);
this.notifyDataSetChanged();
}
@Override
public View getView(int position, View convertView, ViewGroup parent) {
body item = (body)getItem(position);
ViewHolder viewHolder;
if(convertView==null){
viewHolder = new ViewHolder();
convertView = LayoutInflater.from(context).inflate(R.layout.am_rate_drag_item, null);
viewHolder.tvTitle = (TextView) convertView.findViewById(R.id.tvTitle);
viewHolder.ivCountryLogo = (ImageView) convertView.findViewById(R.id.ivCountryLogo);
viewHolder.ivDelete = (ImageView) convertView.findViewById(R.id.click_remove);
viewHolder.ivDragHandle = (ImageView) convertView.findViewById(R.id.drag_handle);
convertView.setTag(viewHolder);
}else{
viewHolder = (ViewHolder) convertView.getTag();
}
viewHolder.tvTitle.setText(item.coin);
viewHolder.ivCountryLogo.setImageResource(item.src);
return convertView;
}
class ViewHolder {
TextView tvTitle;
ImageView ivCountryLogo;
ImageView ivDelete;
ImageView ivDragHandle;
}
}
这个适配器代码有两段代码比较重要。一个是remove,这个函数是当item被移动到另一个item位置的时候,把适配器内原有的数据删除。另一个就是insert。这个是为了在item移动到另一个位置的时候,将数据插入到适配器的指定位置。(这一点可以类比 线性表的移动移动操作,将原位置的数据delete掉,然后再目的位置insert。)
2 DragSortListView在activity中的设置。
[java] view
plaincopy
import android.app.Activity;
import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;
import com.mobeta.android.dslv.DragSortListView;
import com.mobeta.android.dslv.DragSortListView.RemoveListener;
public class AMRateDragActivity extends Activity {
private DragSortListView listView;
private AMDragRateAdapter adapter;
private Button btnEdit;
List<body> l;//listview的数据源
int Src[]=new int[]{R.drawable.aa,R.drawable.bb,R.drawable.cc,R.drawable.dd};//图片数据源
//监听器在手机拖动停下的时候触发
private DragSortListView.DropListener onDrop =
new DragSortListView.DropListener() {
@Override
public void drop(int from, int to) {//from to 分别表示 被拖动控件原位置 和目标位置
if (from != to) {
body item = (body)adapter.getItem(from);//得到listview的适配器
adapter.remove(from);//在适配器中”原位置“的数据。
adapter.insert(item, to);//在目标位置中插入被拖动的控件。
}
}
};
//删除监听器,点击左边差号就触发。删除item操作。
private RemoveListener onRemove =
new DragSortListView.RemoveListener() {
@Override
public void remove(int which) {
adapter.remove(which);
}
};
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.am_rate_drag);
//取数据设置适配器类的数据源。
initData();
//得到滑动listview并且设置监听器。
listView.setDropListener(onDrop);
listView.setRemoveListener(onRemove);
adapter = new AMDragRateAdapter(AMRateDragActivity.this, l);
listView.setAdapter(adapter);
listView.setDragEnabled(true); //设置是否可拖动。
}
private void initData() {//初始化
String[] array = getResources().getStringArray(R.array.module_name);//初始化数据源
ArrayList<String> arrayList = new ArrayList<String>(Arrays.asList(array));
l=new ArrayList<body>();
for(int i=0;i<4;i++){
body b=new body();
b.coin=arrayList.get(i);
b.src=Src[i];
l.add(b);
}
listView = (DragSortListView) findViewById(R.id.dslvList);
}
public class body{//放置adapter数据的类
int src;
String coin;
public int getSrc() {
return src;
}
public void setSrc(int src) {
this.src = src;
}
public String getCoin() {
return coin;
}
public void setCoin(String coin) {
this.coin = coin;
}
}
}
先来看三张效果图。
第一张为初始的DragSortListView效果图。再来看下面拖动效果的。
这张就是在点击item右端黑色按钮后的拖动效果(看起来还不错的样子。。。。。。)
最后拖动结束item位置互换。
基本用法
1 布局。
先来看主界面布局。
[html] view
plaincopy
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:dslv="http://schemas.android.com/apk/res/com.mobeta.android.demodslv"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<com.mobeta.android.dslv.DragSortListView
android:id="@+id/dslvList"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1.0"
android:layout_margin="3dp"
android:dividerHeight="1px"
android:padding="3dp"
dslv:click_remove_id="@id/click_remove"
dslv:collapsed_height="1px"
dslv:drag_enabled="true"
dslv:drag_handle_id="@id/drag_handle"
dslv:drag_scroll_start="0.33"
dslv:drag_start_mode="onDown"
dslv:float_alpha="0.6"
dslv:remove_enabled="true"
dslv:remove_mode="clickRemove"
dslv:slide_shuffle_speed="0.3" />
</LinearLayout>
这里重点讲一下 click_remove_id 和drag_handle_id 这两个属性。这两个属性的值,分别是左边红色删除按钮和最右边拖动按钮的id。
接下来是item布局
[html] view
plaincopy
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="#ffffff"
android:padding="10dp">
<ImageView
android:id="@id/click_remove"
android:background="@drawable/delete_x"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:layout_marginRight="10dp"/>
<ImageView
android:id="@+id/ivCountryLogo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="@id/click_remove"
/>
<TextView
android:id="@+id/tvTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="15dp"
android:textColor="#000000"
android:text="name"
android:layout_toRightOf="@id/ivCountryLogo"/>
<ImageView
android:id="@id/drag_handle"
android:background="#000000"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
/>
</RelativeLayout>
这里没什么好讲的。
接下来将重点内容。适配器和编写和DragSortListView的设置。
[java] view
plaincopy
package com.mobeta.android.demodslv;
import java.util.List;
import com.mobeta.android.demodslv.AMRateDragActivity.body;
import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.ImageView;
import android.widget.TextView;
public class AMDragRateAdapter extends BaseAdapter {
private Context context;
List<body> items;//适配器的数据源
public AMDragRateAdapter(Context context,List<body> list){
this.context = context;
this.items = list;
}
@Override
public int getCount() {
// TODO Auto-generated method stub
return items.size();
}
@Override
public Object getItem(int arg0) {
// TODO Auto-generated method stub
return items.get(arg0);
}
@Override
public long getItemId(int arg0) {
// TODO Auto-generated method stub
return arg0;
}
public void remove(int arg0) {//删除指定位置的item
items.remove(arg0);
this.notifyDataSetChanged();//不要忘记更改适配器对象的数据源
}
public void insert(body item, int arg0) {在指定位置插入item
items.add(arg0, item);
this.notifyDataSetChanged();
}
@Override
public View getView(int position, View convertView, ViewGroup parent) {
body item = (body)getItem(position);
ViewHolder viewHolder;
if(convertView==null){
viewHolder = new ViewHolder();
convertView = LayoutInflater.from(context).inflate(R.layout.am_rate_drag_item, null);
viewHolder.tvTitle = (TextView) convertView.findViewById(R.id.tvTitle);
viewHolder.ivCountryLogo = (ImageView) convertView.findViewById(R.id.ivCountryLogo);
viewHolder.ivDelete = (ImageView) convertView.findViewById(R.id.click_remove);
viewHolder.ivDragHandle = (ImageView) convertView.findViewById(R.id.drag_handle);
convertView.setTag(viewHolder);
}else{
viewHolder = (ViewHolder) convertView.getTag();
}
viewHolder.tvTitle.setText(item.coin);
viewHolder.ivCountryLogo.setImageResource(item.src);
return convertView;
}
class ViewHolder {
TextView tvTitle;
ImageView ivCountryLogo;
ImageView ivDelete;
ImageView ivDragHandle;
}
}
这个适配器代码有两段代码比较重要。一个是remove,这个函数是当item被移动到另一个item位置的时候,把适配器内原有的数据删除。另一个就是insert。这个是为了在item移动到另一个位置的时候,将数据插入到适配器的指定位置。(这一点可以类比 线性表的移动移动操作,将原位置的数据delete掉,然后再目的位置insert。)
2 DragSortListView在activity中的设置。
[java] view
plaincopy
import android.app.Activity;
import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;
import com.mobeta.android.dslv.DragSortListView;
import com.mobeta.android.dslv.DragSortListView.RemoveListener;
public class AMRateDragActivity extends Activity {
private DragSortListView listView;
private AMDragRateAdapter adapter;
private Button btnEdit;
List<body> l;//listview的数据源
int Src[]=new int[]{R.drawable.aa,R.drawable.bb,R.drawable.cc,R.drawable.dd};//图片数据源
//监听器在手机拖动停下的时候触发
private DragSortListView.DropListener onDrop =
new DragSortListView.DropListener() {
@Override
public void drop(int from, int to) {//from to 分别表示 被拖动控件原位置 和目标位置
if (from != to) {
body item = (body)adapter.getItem(from);//得到listview的适配器
adapter.remove(from);//在适配器中”原位置“的数据。
adapter.insert(item, to);//在目标位置中插入被拖动的控件。
}
}
};
//删除监听器,点击左边差号就触发。删除item操作。
private RemoveListener onRemove =
new DragSortListView.RemoveListener() {
@Override
public void remove(int which) {
adapter.remove(which);
}
};
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.am_rate_drag);
//取数据设置适配器类的数据源。
initData();
//得到滑动listview并且设置监听器。
listView.setDropListener(onDrop);
listView.setRemoveListener(onRemove);
adapter = new AMDragRateAdapter(AMRateDragActivity.this, l);
listView.setAdapter(adapter);
listView.setDragEnabled(true); //设置是否可拖动。
}
private void initData() {//初始化
String[] array = getResources().getStringArray(R.array.module_name);//初始化数据源
ArrayList<String> arrayList = new ArrayList<String>(Arrays.asList(array));
l=new ArrayList<body>();
for(int i=0;i<4;i++){
body b=new body();
b.coin=arrayList.get(i);
b.src=Src[i];
l.add(b);
}
listView = (DragSortListView) findViewById(R.id.dslvList);
}
public class body{//放置adapter数据的类
int src;
String coin;
public int getSrc() {
return src;
}
public void setSrc(int src) {
this.src = src;
}
public String getCoin() {
return coin;
}
public void setCoin(String coin) {
this.coin = coin;
}
}
}
相关文章推荐
- Android Support库百分比布局
- WPF的DatePicker--日期选择器
- 【leetcode c++】67 Add Binary
- JS建造者模式基本用法实例分析
- 在Linux系统下一键重新安装WordPress的脚本示例
- SimpleAdapter
- 竞价广告系统-位置拍卖理论
- 预览时显示Failed to find style buttonStyle 报错,预览界面字体小
- 初试Cloudxns详解,智能解析如此简单
- 产品经理该如何和工程师沟通?
- Netty游戏服务器之三搭建Unity客户端
- (greedy)Best Time to Buy and Sell Stock II
- 连续最大积
- Java中使用正则表达式获取网页中所有图片的路径
- ASP.NET MVC学习笔记
- [转载]Java 反射机制(包括组成、结构、示例说明等内容)
- 关于053第470题
- JS模式之简单的订阅者和发布者模式完整实例
- UVa - 10603 - Fill
- openwrt 复位功能的实现