Android--Implementation of the Custom dropdown menu

Source: Internet
Author: User

Reprint Please specify source: http://blog.csdn.net/l1028386804/article/details/48101651

Android development of children's shoes, general will encounter such a situation, is the Android has a drop-down control spinner too monotonous and simple, can not meet our actual development needs, this time we need to customize the drop-down menu to achieve the corresponding function, then, How do I implement a custom drop-down menu? I'll come along with you to implement this function.

First, the principle

The content of our drop-down menu is mainly implemented in a ListView, where a text box is placed on the right side of the text box, and a downward arrow icon is placed to the left of the textbox to indicate that you can click the dropdown. Then create a item.xml layout file, this layout file is the ListView of the entry information, the entry has a picture, an avatar, a series of numbers to indicate QQ number (temporarily to display QQ number as an example), the following a delete button. All data is encapsulated in the ListView. We then display the ListView below the text box in the form of a popupwindow.

When the ListView is not displayed, click the drop-down icon to the right of the text box, and the popup Popupwindow displays the ListView

When the ListView is displayed, click the drop-down icon to the right of the text box to hide the Popupwindow to hide the ListView

When you click on each entry in the ListView and delete the icon, the corresponding entry disappears from the ListView.

II. realization of 1, mainactivity

The program is very simple, I wrote all the Java code in the mainactivity, we still decomposition to see this class.

1) Attribute fields

Each field represents the meaning shown in the code comment

The specific code is implemented as follows:

Interface Controls Private ImageButton spinner;private EditText et_name;//Constructs a collection of QQ numbers private list<string> names = new ArrayList <String> ();//Layout loader private Layoutinflater minflater;//Custom adapter Private Myadapter Madapter;//popupwindowprivate Popupwindow pop;//Whether the Popupwindow is displayed, the private Boolean ispopshow = False is not displayed by default;

2) Custom Adapter

Similarly, in order to better display the data in the ListView, we used the custom adapter

The specific code is implemented as follows:

/** * Custom Adapter * @author Liuyazhuang * */private class Myadapter extends baseadapter{@Overridepublic int GetCount () {// TODO auto-generated Method Stubreturn names.size ();} @Overridepublic Object getItem (int position) {//TODO auto-generated method Stubreturn names.get (position);} @Overridepublic long Getitemid (int position) {//TODO auto-generated method Stubreturn position;} @Overridepublic View GetView (final int position, view Convertview, ViewGroup parent) {View view = Minflater.inflate (R.layo Ut.item, NULL), final TextView tv_name = (TextView) View.findviewbyid (r.id.tv_name); Tv_name.settext (Names.get ( position)); ImageButton delete = (ImageButton) View.findviewbyid (r.id.delete);//Set the button's Listener event Delete.setonclicklistener ( New View.onclicklistener () {@Overridepublic void OnClick (View v) {//TODO auto-generated method Stubnames.remove ( position); ispopshow = True;madapter.notifydatasetchanged ();}}); /Set Button listener event Tv_name.setonclicklistener (new View.onclicklistener () {@Overridepublic void OnClick (ViewV) {//TODO auto-generated method Stubet_name.settext (Names.get (position));p Op.dismiss ();});  return view;}}

3) OnCreate method

The main function of this method is to initialize the interface layout, assign values to the attribute fields, construct the data to be displayed in the ListView, set the click events for the corresponding buttons, and control the display and hiding of the Popupwindow.

The specific implementation code is as follows:

@Overrideprotected void OnCreate (Bundle savedinstancestate) {super.oncreate (savedinstancestate); Setcontentview ( R.layout.activity_main);//construct QQ account for (int i = 10000; i < 10030; i++) {Names.add (string.valueof (i));} Spinner = (ImageButton) Findviewbyid (r.id.spinner); et_name = (EditText) Findviewbyid (r.id.et_name); minflater = Layoutinflater.from (mainactivity.this); madapter = new Myadapter (); Spinner.setonclicklistener (new View.onclicklistener () {@Overridepublic void OnClick (View v) {//TODO auto-generated method stubif (pop = = null) {ListView L Istview = new ListView (mainactivity.this); Listview.setcachecolorhint (0x00000000); Listview.setadapter (Madapter); Pop = new Popupwindow (ListView, Et_name.getwidth (), layoutparams.wrap_content, True);p op.setbackgrounddrawable (new Colordrawable (0x00000000)); ispopshow = true;} if (ispopshow) {pop.showasdropdown (et_name, 0, 0); ispopshow = false;} Else{pop.dismiss (); ispopshow = True;}});}

4) The complete code is as follows:

Package Com.lyz.spiner.activity;import Java.util.arraylist;import Java.util.list;import android.os.Bundle;import Android.app.activity;import Android.graphics.drawable.colordrawable;import Android.view.layoutinflater;import Android.view.menu;import Android.view.view;import Android.view.viewgroup;import Android.view.viewgroup.layoutparams;import Android.widget.baseadapter;import Android.widget.EditText;import Android.widget.imagebutton;import Android.widget.listview;import Android.widget.popupwindow;import android.widget.textview;/** * Program Main entrance * @author Liuyazhuang * */public class Mainactivity extends Activity {//interface control private Im Agebutton spinner;private EditText et_name;//constructs the set of QQ number to private list<string> names = new Arraylist<string> ( )///Layout loader private Layoutinflater minflater;//Custom Adapter Private myadapter madapter;//popupwindowprivate Popupwindow pop;// If Popupwindow is displayed, the private Boolean ispopshow = False is not displayed by default, @Overrideprotected void OnCreate (Bundle savedinstancestate) { Super.oncreate (savEdinstancestate); Setcontentview (r.layout.activity_main);//construct QQ account for (int i = 10000; i < 10030; i++) {Names.add ( String.valueof (i));} Spinner = (ImageButton) Findviewbyid (r.id.spinner); et_name = (EditText) Findviewbyid (r.id.et_name); minflater = Layoutinflater.from (mainactivity.this); madapter = new Myadapter (); Spinner.setonclicklistener (new View.onclicklistener () {@Overridepublic void OnClick (View v) {//TODO auto-generated method stubif (pop = = null) {ListView L Istview = new ListView (mainactivity.this); Listview.setcachecolorhint (0x00000000); Listview.setadapter (Madapter); Pop = new Popupwindow (ListView, Et_name.getwidth (), layoutparams.wrap_content, True);p op.setbackgrounddrawable (new Colordrawable (0x00000000)); ispopshow = true;} if (ispopshow) {pop.showasdropdown (et_name, 0, 0); ispopshow = false;} Else{pop.dismiss (); ispopshow = True;}});} /** * Custom Adapter * @author Liuyazhuang * */private class Myadapter extends baseadapter{@Overridepublic int GetCount () {// TODO auto-generated Method Stubreturn Names.size ();} @Overridepublic Object getItem (int position) {//TODO auto-generated method Stubreturn names.get (position);} @Overridepublic long Getitemid (int position) {//TODO auto-generated method Stubreturn position;} @Overridepublic View GetView (final int position, view Convertview, ViewGroup parent) {View view = Minflater.inflate (R.layo Ut.item, NULL), final TextView tv_name = (TextView) View.findviewbyid (r.id.tv_name); Tv_name.settext (Names.get ( position)); ImageButton delete = (ImageButton) View.findviewbyid (r.id.delete);//Set the button's Listener event Delete.setonclicklistener ( New View.onclicklistener () {@Overridepublic void OnClick (View v) {//TODO auto-generated method Stubnames.remove ( position); ispopshow = True;madapter.notifydatasetchanged ();}}); /Set Button listener event Tv_name.setonclicklistener (new View.onclicklistener () {@Overridepublic void OnClick (View v) {//TODO Auto-generated Method Stubet_name.settext (Names.get (position));p Op.dismiss ();}); return view;}} @Overridepublic 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;}}

2. Main layout file Activity_main.xml

The specific implementation code is as follows:

<relativelayout xmlns:android= "http://schemas.android.com/apk/res/android"    xmlns:tools= "http// Schemas.android.com/tools "    android:layout_width=" match_parent "    android:layout_height=" Match_parent "     android:background= "@android: Color/black" >    <edittext        android:id= "@+id/et_name"        android: Layout_width= "200dip"        android:layout_height= "Wrap_content" android:layout_centerhorizontal= "true" Android: Hint= "Please enter account"/>    <imagebutton     android:id= "@+id/spinner" android:layout_width= "Wrap_content"    android:layout_height= "wrap_content"    android:background= "@drawable/button"    android:layout_ aligntop= "@id/et_name"    android:layout_alignright= "@id/et_name"    android:layout_alignbottom= "@id/et_ Name "/></relativelayout>

3. Article layout file Item.xml

The specific implementation code is as follows:

<?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:o rientation= "Horizontal"     android:gravity= "center_vertical" >    <imageview android:id=         "@+id/ Header "        android:layout_width=" wrap_content "        android:layout_height=" Wrap_content "        android: background= "@drawable/user"/>        <textview         android:id= "@+id/tv_name" android:layout_width= "        Wrap_content "        android:layout_height=" wrap_content "        android:layout_weight=" 1 "/>        < ImageButton         android:id= "@+id/delete"        android:layout_width= "wrap_content"        android:layout_height= "Wrap_content"        android:background= "@drawable/delete"/></linearlayout>

4, Androidmanifest.xml

Finally, post the Androidmanifest.xml code.

<?xml version= "1.0" encoding= "Utf-8"? ><manifest xmlns:android= "http://schemas.android.com/apk/res/ Android "    package=" com.lyz.spiner.activity "    android:versioncode=" 1 "    android:versionname=" 1.0 ">    <uses-sdk        android:minsdkversion= "8"        android:targetsdkversion= "/>    <application"        android:allowbackup= "true"        android:icon= "@drawable/ic_launcher"        android:label= "@string/app_name"        android:theme= "@style/apptheme" >        <activity            android:name= " Com.lyz.spiner.activity.MainActivity "            android:label=" @string/app_name ">            <intent-filter>                <action android:name= "Android.intent.action.MAIN"/>                <category android:name= " Android.intent.category.LAUNCHER "/>            </intent-filter>        </activity>    </ Application></manifest>

Third, the Operation effect


Four, warm tips

You can go to link http://download.csdn.net/detail/l1028386804/9062795 download Android custom drop-down menu sample full source code

In this example, for the sake of the aspect, I write some text directly in the layout file and the related class, Everyone in the real project to write these words in the String.xml file, in the external reference to these resources, remember, this is the most basic development knowledge and specifications as an Android programmer, I am here just to facilitate directly written in the class and layout files.

Copyright NOTICE: This article for Bo Master original article, without Bo Master permission not reproduced.

Android--Implementation of the Custom dropdown menu

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.