[Android应用] 仿QQHD长按好友列表显示操作条

前言:

       玩了公司的调试pad,玩了一下QQHD mini软件,哈 本人对Android QQ不感冒,不过好像写的不错,仿Iphone对话模式仿的 ... -。-  可能标题写的不清晰,唉 算了,能想到就这样了 .. 先看图(红色圈圈部分),长按然后显示操作条,包括对话,空间等!

图片:

               

思路:

        1、用 ListView (我用listView,多级菜单就没弄了)重写 Adapter 和 List Item 的显示隐藏来实现。
        2、List 中每一个 Item 都有这样的工具栏存在,长按列表项时候让它显示出来
        3、当失去焦点时候隐藏,或者长按其 Item 的时候隐藏自己,显示其他
       
 这样想想就不难实现了,下面是实现:
1、主界面很简单,就一个ListView,布局文件:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

   <ListView 
       android:id="@+id/info_list" 
       android:layout_width="fill_parent"
       android:layout_height="fill_parent" />

</LinearLayout>
2、ListView 每一项的 Item 布局文件,工具栏默认为隐藏状态:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content">
    	<TextView 
        	android:id="@+id/txt_item"
        	android:layout_width="fill_parent"
        	android:layout_height="60dip" />
    	
	</LinearLayout>
	<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
	    android:id="@+id/layout_tip_bar"
	    android:layout_width="fill_parent"
	    android:layout_height="80dip"
	    android:gravity="right"
	    android:background="@drawable/tip_background"
	    android:visibility="gone">
		<LinearLayout 
		    android:id="@+id/layout_item1"
		    android:orientation="vertical"
		    android:layout_width="wrap_content"
		    android:layout_height="60dip"
		    android:layout_marginLeft="80dip"
		    android:layout_margin="8dip">
		    <ImageView 
		        android:layout_width="50dip"
		        android:layout_height="42dip"
		        android:background="@android:drawable/ic_dialog_dialer" />
	    	<TextView 
	    	    android:layout_width="fill_parent"
	    	    android:layout_height="20dip"
	    	    android:textColor="@android:color/white"
	    	    android:textSize="12sp"
	    	    android:text="@string/item1"
	    	    android:gravity="center_horizontal"/>
		</LinearLayout>
	    <LinearLayout 
		    android:id="@+id/layout_item2"
		    android:orientation="vertical"
		    android:layout_width="wrap_content"
		    android:layout_height="60dip"
		    android:layout_toRightOf="@id/layout_item1"
		    android:layout_marginLeft="80dip"
		    android:layout_marginRight="50dip"
		    android:layout_margin="8dip">
		    <ImageView 
		        android:layout_width="50dip"
		        android:layout_height="42dip"
		        android:background="@android:drawable/ic_dialog_email" />
	    	<TextView 
	    	    android:layout_width="fill_parent"
	    	    android:layout_height="20dip"
	    	    android:textColor="@android:color/white"
	    	    android:textSize="12sp"
	    	    android:gravity="center_horizontal"
	    	    android:text="@string/item2"/>
		</LinearLayout>
	</RelativeLayout>
    
</LinearLayout>
【备注】如果 xml 代码看的有点乏味,可以直接看图片,然后根据自己思维布局
3、接下来就是 Adapter 的重写了,都烂了 相信你都知道了,^_^
public class ListAdapter extends BaseAdapter {
	
	private Context context = null;
	private LayoutInflater inflater = null;
	// 展现的信息
	private ArrayList<String> infoList = null;
	
	public ListAdapter(Context context, ArrayList<String> infoList) {
		this.context = context;
		this.infoList = infoList;
		this.inflater = (LayoutInflater) context.getSystemService(context.LAYOUT_INFLATER_SERVICE);
	}
	
	public int getCount() {
		return this.infoList.size();
	}

	public Object getItem(int position) {
		return this.infoList.get(position);
	}

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

	public View getView(int position, View convertView, ViewGroup parent) {
		// 防止内存泄漏
		if(convertView == null) {
			convertView = (View)this.inflater.inflate(R.layout.item, null);
		}
		TextView textView = (TextView)convertView.findViewById(R.id.txt_item);
		textView.setText(this.infoList.get(position));
		return convertView;
	}
}
4、下面是Activitiy,主要数据都在这里处理,包括单击,长按事件
public class ListItemBarShowActivity extends Activity implements 
			OnItemClickListener, OnItemLongClickListener {
	/** Called when the activity is first created. */
	private ListView listView = null;
	private ListAdapter listAdapter = null;
	private ArrayList<String> infoList = null;
	// 工具栏 【备注1】
	private RelativeLayout tipLayout = null;
	private ObjectClickListener oListener = null;
	
	
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        // 初始化
        init();
    }
    
    @Override
	public void onItemClick(AdapterView<?> parent, View view, int position,
			long id) {
    	// 如果当前有显示,隐藏起来 【备注2】
    	if(this.tipLayout != null) {
    		this.tipLayout.setVisibility(View.GONE);
    	}
    }
    
    @Override
	public boolean onItemLongClick(AdapterView<?> parent, View view,
			int position, long id) {
    	// 先让之前显示的隐藏掉 【备注2】
    	if(tipLayout != null) {
    		tipLayout.setVisibility(View.GONE);
    	}
    	tipLayout = (RelativeLayout)view.findViewById(R.id.layout_tip_bar);
		tipLayout.setVisibility(View.VISIBLE);
		// 要设置聚焦,不然怎么点击都是listView的单击事件
		tipLayout.setFocusable(true);
		tipLayout.findViewById(R.id.layout_item1).setOnClickListener(this.oListener);
		tipLayout.findViewById(R.id.layout_item2).setOnClickListener(this.oListener);
		return true;
	}
    
    /** 工具栏工具单击事件 */
    private class ObjectClickListener implements OnClickListener {
		@Override
		public void onClick(View v) {
			switch (v.getId()) {
			case R.id.layout_item1: // 【备注3】
				Toast.makeText(ListItemBarShowActivity.this, "item1 Click", Toast.LENGTH_SHORT).show();
				break;
			case R.id.layout_item2:
				Toast.makeText(ListItemBarShowActivity.this, "item2 Click", Toast.LENGTH_SHORT).show();
				break;
			}
		}
    	
    }
    
    /** 初始化 */
    private void init() {
    	 this.infoList = new ArrayList<String>();
    	 this.oListener = new ObjectClickListener();
    	 infoList.add("第一个");
    	 infoList.add("第二个");
    	 infoList.add("第三个");
    	 infoList.add("第四个");
    	 this.listAdapter = new ListAdapter(this, this.infoList);
         this.listView = (ListView)this.findViewById(R.id.info_list);
         this.listView.setOnItemClickListener(this);
         this.listView.setOnItemLongClickListener(this);
         this.listView.setAdapter(this.listAdapter);
    }

}
【备注1】:用成员变量来保存工具栏整个 layout 是为了显示和隐藏只操作一个对象
【备注2】:先判断不为空,不然在变量未初始时候会报错,里面有2种,
                   第一种是随便点击任意非本身 item 就消失掉工具栏(看QQHD)
                   第二种是长按其他 Item 项本身消失,长按那个显示
【备注3】:这里 layout 按下无动态反馈,可以动态显示,或者设置 view.setBackgroundDrawable(**) 给用户反馈

这个只是初步,仅仅实现了思路,如果要做的好还要包括布局,美化等等 ..,好了 看看效果图吧 !

     

想要整个工程的,可以留下邮箱.. 或者下载 这里

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值