Android 自定义 SpinnerButton(转)

Android 自定义 SpinnerButton

模仿Android4.0的Spinner Button写的一个MySpinnerButton。这样在1.6~4.0.4版本都可以实现这种下拉框的效果了。

实现效果：点击屏幕上的Spinner Button，在按钮的下方会滑出一个下拉列表，滑动选择下拉列表中其中一个选项，则下拉列表收回，按钮上的文字显示为选项的内容。点击返回键或下拉列表外部区域，下拉列表收回。反复点击按钮，下拉列表反复执行滑出和收回动作。

运行图：

  

实现原理：使用PopupWindow和Button相关联（showAsDropDown）。在PopupWindow上放ListView。于是就有了下拉框的效果。

以下是代码：

入口_04MySpinnerDemo2Activity:

public class _04MySpinnerDemo2Activity extends Activity {

private MySpinnerButton mSpinnerBtn;

@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);

this.mSpinnerBtn = (MySpinnerButton) this.findViewById(R.id.spinner_btn);
}
}

布局文件main.xml

<?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:gravity="top|center_horizontal"
android:orientation="vertical" >

<com.haozi.demo.myspinner2.wiget.MySpinnerButton
android:id="@+id/spinner_btn"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:text="spinner button"
/>

</LinearLayout>

封装好的MySpinnerButton:

/**
* 我的SpinnerButton
* @author haozi
*
*/
public class MySpinnerButton extends Button {

private Context context;

public MySpinnerButton(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
this.context = context;
// 设置监听事件
setOnClickListener(new MySpinnerButtonOnClickListener());
}

public MySpinnerButton(Context context, AttributeSet attrs) {
super(context, attrs);
this.context = context;
// 设置监听事件
setOnClickListener(new MySpinnerButtonOnClickListener());
}

public MySpinnerButton(Context context) {
super(context);
this.context = context;
// 设置监听事件
setOnClickListener(new MySpinnerButtonOnClickListener());
}

/**
* MySpinnerButton的点击事件
* @author haozi
*
*/
class MySpinnerButtonOnClickListener implements View.OnClickListener{

@Override
public void onClick(View v) {

final MySpinnerDropDownItems mSpinnerDropDrownItems = new MySpinnerDropDownItems(context);
if (!mSpinnerDropDrownItems.isShowing()) {
mSpinnerDropDrownItems.showAsDropDown(MySpinnerButton.this);
}
}
}

/**
* MySpinnerButton的下拉列表
* @author haozi
*
*/
class MySpinnerDropDownItems extends PopupWindow{

private Context context;
private LinearLayout mLayout; // 下拉列表的布局
private ListView mListView; // 下拉列表控件
private ArrayList<HashMap<String, String>> mData;

public MySpinnerDropDownItems(Context context){
super(context);

this.context = context;
// 下拉列表的布局
mLayout = new LinearLayout(context);
mLayout.setOrientation(LinearLayout.VERTICAL);
// 下拉列表控件
mListView = new ListView(context);
mListView.setLayoutParams(new LayoutParams(MySpinnerButton.this.getLayoutParams().width, LayoutParams.WRAP_CONTENT));
mListView.setCacheColorHint(Color.TRANSPARENT);
mData = new ArrayList<HashMap<String,String>>();
for(int i=0; i<50; i++){
HashMap<String, String> mHashmap = new HashMap<String, String>();
mHashmap.put("spinner_dropdown_item_textview", "textView " + i);
mData.add(mHashmap);
}
// 为listView设置适配器
mListView.setAdapter(new MyAdapter(context,
mData, R.layout.spinner_dropdown_item,
new String[]{"spinner_dropdown_item_textview"}, new int[]{R.id.spinner_dropdown_item_textview}));
// 设置listView的点击事件
mListView.setOnItemClickListener(new MyListViewOnItemClickedListener());
// 把下拉列表添加到layout中。
mLayout.addView(mListView);

setWidth(LayoutParams.WRAP_CONTENT);
setHeight(LayoutParams.WRAP_CONTENT);
setContentView(mLayout);
setFocusable(true);

mLayout.setFocusableInTouchMode(true);
}

/**
* 我的适配器
* @author haozi
*
*/
public class MyAdapter extends BaseAdapter {

private Context context;
private List<? extends Map<String, ?>> mData;
private int mResource;
private String[] mFrom;
private int[] mTo;
private LayoutInflater mLayoutInflater;

/**
* 我的适配器的构造方法
* @param context 调用方的上下文
* @param data 数据
* @param resource
* @param from
* @param to
*/
public MyAdapter(Context context, List<? extends Map<String, ?>> data, int resource, String[] from, int[] to){

this.context = context;
this.mData = data;
this.mResource = resource;
this.mFrom = from;
this.mTo = to;
this.mLayoutInflater = (LayoutInflater) context.getSystemService(context.LAYOUT_INFLATER_SERVICE);
}

/**
* 系统在绘制ListView之前，将会先调用getCount方法来获取Item的个数
*/
public int getCount() {

return this.mData.size();
}

public Object getItem(int position) {

return this.mData.get(position);
}

public long getItemId(int position) {

return position;
}

/**
* 每绘制一个 Item就会调用一次getView方法，
* 在此方法内就可以引用事先定义好的xml来确定显示的效果并返回一个View对象作为一个Item显示出来。
* 也 正是在这个过程中完成了适配器的主要转换功能，把数据和资源以开发者想要的效果显示出来。
* 也正是getView的重复调用，使得ListView的使用更 为简单和灵活。
* 这两个方法是自定ListView显示效果中最为重要的，同时只要重写好了就两个方法，ListView就能完全按开发者的要求显示。
* 而 getItem和getItemId方法将会在调用ListView的响应方法的时候被调用到。
* 所以要保证ListView的各个方法有效的话，这两个方法也得重写。
*/
public View getView(int position, View contentView, ViewGroup parent) {

contentView = this.mLayoutInflater.inflate(this.mResource, parent, false);

// 设置contentView的内容和样式，这里重点是设置contentView中文字的大小
for(int index=0; index<this.mTo.length; index++){
TextView textView = (TextView) contentView.findViewById(this.mTo[index]);
textView.setText(this.mData.get(position).get(this.mFrom[index]).toString());
}

return contentView;
}
}

/**
* listView的点击事件
* @author haozi
*
*/
class MyListViewOnItemClickedListener implements AdapterView.OnItemClickListener{

@Override
public void onItemClick(AdapterView<?> parent, View view, int position,
long id) {

TextView mTextView = (TextView) view.findViewById(R.id.spinner_dropdown_item_textview);
String content = mTextView.getText().toString();
MySpinnerButton.this.setText(content);
MySpinnerDropDownItems.this.dismiss();
}
}
}
}

下拉列表item的布局文件spinner_dropdown_item.xml

<?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="wrap_content"
android:background="@android:drawable/list_selector_background"
android:orientation="vertical" >

<TextView android:id="@+id/spinner_dropdown_item_textview"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="left|bottom"
android:paddingTop="11dip"
android:paddingBottom="11dip"
android:paddingLeft="5dip"
/>
</LinearLayout>

时间： 2024-08-04 21:59:32

Android 自定义 SpinnerButton(转)的相关文章

Android 自定义Gallery浏览图片

之前写的<Android ImageSwitcher和Gallery的使用>一文中提到我在教室一下午为实现那个效果找各种资料.期间在网上找了一个个人觉得比较不错的效果,现在贴图上来: 其实这个效果使用的知识点就是图像的获取.创建.缩放.旋转.Matrix类.Canvas类等,另外就是自定义的Gallery控件. 相信大家都期待马上上代码了吧,嘻嘻.(注释比较多,相信大家都能看懂.) main.xml: <?xml version="1.0" encoding=&quo

Android自定义View探索(一)—生命周期

Activity代码: public class FiveActivity extends AppCompatActivity { private MyView myView; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); Log.e("log", "Activity生命周期:onCreate"); setConte

android自定义UI模板图文详解

不知道大家在实际开发中有没有自定义过UI模板?今天花时间研究了一下android中自定义UI模板,与大家分享一下. 每个设计良好的App都是自定义标题栏,在自定义标题栏的过程中大部分人可能都是自定义一个标题的xml文件,然后在需要的地方直接通过include来引用,这比起在每个布局文件中写标题栏已经进化很多了,但仍然不是最简单有效的方法,我们为什么不能自定义一个标题控件呢?今天就带大家自己做一个标题栏控件.效果图如下: 开始啦: 第一步:自定义xml属性 新建一个android项目,在value

Android自定义进度条样式

最近在做一个widget,上面需要一个progressbar,产品经理和设计师给出来的东西是要实现一个圆角的progress和自定义的颜色,研究一小下,分享出来给大家哦. 测试于:Android4.0+ 操作步骤: 1.创建你的layout文件引用progressbar如下,标红处引用你自定的样式: <ProgressBar android:id="@+id/progressDownload" style="?android:attr/progressBarStyleH

Android 自定义RecyclerView 实现真正的Gallery效果

转载请标明出处:http://blog.csdn.net/lmj623565791/article/details/38173061 ,本文出自:[张鸿洋的博客] 上一篇博客我使用自定义HorizontalScrollView写了一个具有HorizontalScrollView效果和ViewPager特性的横向图片轮播,详见:Android 自定义 HorizontalScrollView 打造再多图片(控件)也不怕 OOM 的横向滑动效果.其实制作横向滚动的不得不说另一个控件,就是Google

Android 自定义 HorizontalScrollView 打造再多图片（控件）也不怕 OOM 的横向滑动效果

转载请标明出处:http://blog.csdn.net/lmj623565791/article/details/38140505 自从Gallery被谷歌废弃以后,Google推荐使用ViewPager和HorizontalScrollView来实现Gallery的效果.的确HorizontalScrollView可以实现Gallery的效果,但是HorizontalScrollView存在一个很大的问题,如果你仅是用来展示少量的图片,应该是没问题的,但是如果我希望HorizontalScr

Android 自定义UI圆角按钮

Android实际开发中我们一般需要圆角的按钮,一般情况下我们可以让美工做出来相应的按钮图片,然后放上去即可,另外我们可以在布局文件中直接设置,也可以达到一样的效果.下面讲解在布局文件中自定义圆角按钮的小Demo. 代码很简单,实现效果图: 源代码: 源代码: 这里主要是xml布局文件实现: MainActivity: package com.android_drawableresource; import android.app.Activity; import android.os.Bund

Android 自定义View视图

创建全新的视图将满足我们独特的UI需求. 本文介绍在指南针开发中会用到的罗盘的界面UI,通过继承View类实现的自定义视图,以此来深刻了解自定义视图. 实现效果图: 源代码: 布局文件activity_main(其中CompassView继承View类): <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.

Android自定义进度条-带文本(文字进度)的水平进度条(ProgressBar)

/** * 带文本提示的进度条 */ public class TextProgressBar extends ProgressBar { private String text; private Paint mPaint; public TextProgressBar(Context context) { super(context); initText(); } public TextProgressBar(Context context, AttributeSet attrs, int d