展会信息港展会大全

spinner自定义,效果如腾讯QQ账号选择时候的下拉列表
来源:互联网   发布日期:2015-10-02 15:59:05   浏览:1169次  

导读:下拉列表在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消失的时候

,背景变回没有弹出下拉菜单的背景样式。

可能大家没有图片资源,今天我传不上去,可以留下邮箱!

赞助本站

人工智能实验室

相关热词: android开发 教程

相关内容
AiLab云推荐
展开

热门栏目HotCates

Copyright © 2010-2024 AiLab Team. 人工智能实验室 版权所有    关于我们 | 联系我们 | 广告服务 | 公司动态 | 免责声明 | 隐私条款 | 工作机会 | 展会港