下拉列表在android中自带spinner的有时候不太适合我们的界面,我们希望有自己的一种显示方法,那怎么办?自定义Spinner.效果如QQ账号选择一样。如图所以。
这种效果,如果你喜欢,你可以往下接着看。
这里我们使用listView配合TextView实现的。
1 布局文件
activity_main.xml
<?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
<?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布局
<?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的适配文件
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
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消失的时候,背景变回没有弹出下拉菜单的背景样式。
资源下载地址:http://download.csdn.net/detail/feiyangxiaomi/6470605