首页 > 安全资讯 >

spinner自定义,效果如腾讯QQ账号选择时候的下拉列表

13-10-30

下拉列表在android中自带spinner的有时候不太适合我们的界面,我们希望有自己的一种显示方法,那怎么办?自定义Spinner 效果如QQ账号选择一样。如图所以。这种效果,如果你喜欢,你可以往下接着看。这里我们使用

 下拉列表在android中自带spinner的有时候不太适合我们的界面,我们希望有自己的一种显示方法,那怎么办?自定义Spinner.效果如QQ账
号选择一样。如图所以。
 
这种效果,如果你喜欢,你可以往下接着看。
这里我们使用listView配合TextView实现的。
1 布局文件                                                     
activity_main.xml
[java]  
<?xml version="1.0" encoding="UTF-8"?>  
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
    android:id="@+id/main"  
    android:layout_width="fill_parent"  
    android:layout_height="fill_parent" >  
  
    <RelativeLayout  
        android:layout_width="fill_parent"  
        android:layout_height="50dp"  
        android:gravity="clip_vertical" >  
  
        <LinearLayout  
            android:id="@+id/spinnerid"  
            android:layout_width="fill_parent"  
            android:layout_height="50dp"  
            android:layout_marginLeft="30dp"  
            android:layout_marginRight="30dp"  
            android:layout_marginTop="10dp"  
            android:background="@drawable/preference_single_item"  
            android:gravity="right" >  
  
            <TextView  
                android:id="@+id/textView2"  
                android:layout_width="wrap_content"  
                android:layout_height="match_parent"  
                android:gravity="center"  
                android:text="1234"  
                android:textAppearance="?android:attr/textAppearanceLarge" />  
  
            <TextView  
                android:id="@+id/textView1"  
                android:layout_width="wrap_content"  
                android:layout_height="wrap_content"  
                android:layout_weight="1"  
                android:textAppearance="?android:attr/textAppearanceLarge" />  
  
            <ImageView  
                android:id="@+id/imageView1"  
                android:layout_width="wrap_content"  
                android:layout_height="match_parent"  
                android:src="@drawable/mm_submenu_dropdown" />  
  
        </LinearLayout>  
    </RelativeLayout>  
  
</LinearLayout>  
 
myspinner_dropdown.xml这里面只有一个listView
[java] 
<?xml version="1.0" encoding="UTF-8"?>  
<LinearLayout   
    android:layout_width="fill_parent"  
    android:layout_height="fill_parent"  
    android:orientation="vertical"  
     xmlns:android="http://schemas.android.com/apk/res/android">  
    <ListView   
        android:id="@+id/listView"  
        android:layout_width="fill_parent"  
        android:layout_height="fill_parent"  
        android:divider="@null"  
        android:dividerHeight="1px"></ListView>  
</LinearLayout>  
myspinner_dropdown_item.xml这里就是每个item布局
[java]  
<?xml version="1.0" encoding="UTF-8"?>  
<LinearLayout   
    android:layout_width="fill_parent"  
    android:layout_height="fill_parent"  
     xmlns:android="http://schemas.android.com/apk/res/android">  
     <RelativeLayout  
         android:id="@+id/myspinner_dropdown_layout"  
         android:layout_width="fill_parent"  
         android:layout_height="35dp"  
         android:background="@drawable/preference_item"  
         android:gravity="left|center" >  
         <TextView  
             android:id="@+id/myspinner_dropdown_txt"  
             android:layout_width="wrap_content"  
             android:layout_height="wrap_content"  
             android:layout_alignParentLeft="true"  
             android:layout_centerVertical="true"  
             android:text="TextView"  
             android:textSize="20sp" />  
    </RelativeLayout>  
</LinearLayout>  
2程序代码实现                                                                         
 
MyspinnerAdapter.java文件是listview的适配文件
[java]  
package com.example.testspinner2;  
  
import java.util.ArrayList;  
import java.util.List;  
  
import android.content.Context;  
import android.view.LayoutInflater;  
import android.view.View;  
import android.view.ViewGroup;  
import android.widget.BaseAdapter;  
import android.widget.RelativeLayout;  
import android.widget.TextView;  
  
  
public class MyspinnerAdapter extends BaseAdapter {  
    LayoutInflater inflater;  
    Context context;  
    ArrayList<String> list;  
  
    public MyspinnerAdapter(Context context, ArrayList<String> list) {  
        super();  
        this.context = context;  
        this.list = list;  
        inflater = LayoutInflater.from(context);  
    }  
  
    @Override  
    public int getCount() {  
        // TODO Auto-generated method stub  
        return list.size();  
    }  
  
    @Override  
    public Object getItem(int position) {  
        // TODO Auto-generated method stub  
        return list.get(position);  
    }  
  
    @Override  
    public long getItemId(int position) {  
        // TODO Auto-generated method stub  
        return position;  
    }  
  
    @Override  
    public View getView(int position, View convertView, ViewGroup parent) {  
        ViewHolder viewHolder = null;  
        if (convertView == null) {  
            convertView = inflater.inflate(R.layout.myspinner_dropdown_items, null);  
            viewHolder = new ViewHolder();  
            viewHolder.layout = (RelativeLayout) convertView.findViewById(R.id.myspinner_dropdown_layout);  
            viewHolder.textView = (TextView) convertView.findViewById(R.id.myspinner_dropdown_txt);  
            convertView.setTag(viewHolder);  
        } else {  
            viewHolder = (ViewHolder) convertView.getTag();  
        }  
        if(list.size() == position+1){  
            viewHolder.layout.setBackgroundResource(R.drawable.preference_last_item);  
        }else{  
            viewHolder.layout.setBackgroundResource(R.drawable.preference_item);  
        }  
        viewHolder.textView.setText(list.get(position));  
        return convertView;  
    }  
  
    public class ViewHolder {  
        RelativeLayout layout;  
        TextView textView;  
    }  
  
    public void refresh(List<String> l) {  
        this.list.clear();  
        list.addAll(l);  
        notifyDataSetChanged();  
    }  
  
    public void add(String str) {  
        list.add(str);  
        notifyDataSetChanged();  
    }  
  
    public void add(ArrayList<String> str) {  
        list.addAll(str);  
        notifyDataSetChanged();  
  
    }  
}  
 
这里面比较关键的是判断当前item是否为最后一个item,如果是最后一个背景需要更改,毕竟中间的背景和最后一项item是不同的
MainActivity.java
[java]  
package com.example.testspinner2;  
  
import java.util.ArrayList;  
  
import android.app.Activity;  
import android.graphics.drawable.BitmapDrawable;  
import android.os.Bundle;  
import android.view.LayoutInflater;  
import android.view.Menu;  
import android.view.View;  
import android.view.View.OnClickListener;  
import android.view.ViewGroup.LayoutParams;  
import android.widget.AdapterView;  
import android.widget.AdapterView.OnItemClickListener;  
import android.widget.ImageView;  
import android.widget.LinearLayout;  
import android.widget.ListView;  
import android.widget.PopupWindow;  
import android.widget.PopupWindow.OnDismissListener;  
import android.widget.TextView;  
  
public class MainActivity extends Activity {  
    private ArrayList<String> list;  
    private ImageView imgView;  
    private TextView textView;  
    private LinearLayout layout;  
    private ListView listView;  
    private MyspinnerAdapter adapter;  
    private PopupWindow popupWindow;  
    private LinearLayout spinnerlayout;  
    int width;  
  
    @Override  
    protected void onCreate(Bundle savedInstanceState) {  
        super.onCreate(savedInstanceState);  
        setContentView(R.layout.activity_main);  
        textView = (TextView) findViewById(R.id.textView2);  
        imgView = (ImageView) findViewById(R.id.imageView1);  
        // 实例化一个List,添加数据  
        list = new ArrayList<String>();  
        list.add("第一展厅");  
        list.add("4展厅");  
        list.add("第三展厅");  
        adapter = new MyspinnerAdapter(this, list);  
        textView.setText((CharSequence) adapter.getItem(0));  
        spinnerlayout = (LinearLayout) findViewById(R.id.spinnerid);  
        // 点击右侧按钮,弹出下拉框  
        imgView.setOnClickListener(new OnClickListener() {  
  
            @Override  
            public void onClick(View v) {  
  
                if(list.size()>0){  
                    spinnerlayout.setBackgroundResource(R.drawable.preference_first_item);  
                }  
                showWindow(spinnerlayout, textView);  
  
            }  
        });  
    }  
    protected void onResume(){  
        super.onResume();  
          
    }  
    public void showWindow(View position, final TextView txt) {  
  
        layout = (LinearLayout) LayoutInflater.from(this).inflate(R.layout.mypinner_dropdown, null);  
        listView = (ListView) layout.findViewById(R.id.listView);  
        listView.setAdapter(adapter);  
        popupWindow = new PopupWindow(position);  
        // 设置弹框的宽度为布局文件的宽  
        popupWindow.setWidth(spinnerlayout.getWidth());  
        popupWindow.setHeight(LayoutParams.WRAP_CONTENT);  
        // 设置一个透明的背景,不然无法实现点击弹框外,弹框消失  
        popupWindow.setBackgroundDrawable(new BitmapDrawable());  
        // 设置点击弹框外部,弹框消失  
        popupWindow.setOutsideTouchable(true);  
        popupWindow.setFocusable(true);  
        popupWindow.setContentView(layout);  
        // 设置弹框出现的位置,在v的正下方横轴偏移textview的宽度,为了对齐~纵轴不偏移  
        popupWindow.showAsDropDown(position, 0, 0);  
        popupWindow.setOnDismissListener(new OnDismissListener(){  
            @Override  
            public void onDismiss() {  
                // TODO Auto-generated method stub  
                spinnerlayout.setBackgroundResource(R.drawable.preference_single_item);  
            }  
              
        });  
        // listView的item点击事件  
        listView.setOnItemClickListener(new OnItemClickListener() {  
  
            @Override  
            public void onItemClick(AdapterView<?> arg0, View arg1, int arg2, long arg3) {  
                // TODO Auto-generated method stub  
                txt.setText(list.get(arg2));// 设置所选的item作为下拉框的标题  
                // 弹框消失  
                popupWindow.dismiss();  
                popupWindow = null;  
            }  
        });  
  
    }  
  
    @Override  
    public boolean onCreateOptionsMenu(Menu menu) {  
        // Inflate the menu; this adds items to the action bar if it is present.  
        getMenuInflater().inflate(R.menu.main, menu);  
        return true;  
    }  
  
}  
 
这里前段和我们常用的没什么区别,只是监听imageView,关键的是showWindows做出了点击更多按钮弹出已存信息。在popupWindow消失的时候
 
,背景变回没有弹出下拉菜单的背景样式。
可能大家没有图片资源,今天我传不上去,可以留下邮箱!
 
相关文章
最新文章
热点推荐