Android Spinner with Dialog Box

Why this post?

 Sometimes for visual effect, we need to show the spinner item in a dialog box which is most customizable and designable. UX engineers also try to make the more complex situation. That's why I made a spinner where spinners item will be shown in the dialogue box.

 Techniques which I used:

 For this purpose, I used Dialog, RecyclerView and EditText.
1. When clicked on EditText a Dialog Box will appear.
2. Dialog box holds a RecyclerView with an adapter where adapter holds a TextView.
3. Then implement a OnItemClick listener in RecyclerView.
4. Then item text will set on EditText.
Codes with Description:

 Dialog layout:
dialog.xml

 
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
 xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <android.support.v7.widget.RecyclerView
        android:id="@+id/rvSpinnerList"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>
</LinearLayout>







My custom dialog class:




 


package com.bs23.aliahmed.dialogspinner;

import android.app.Dialog;
import android.content.Context;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.widget.EditText;
import android.widget.TextView;

import java.util.List;

/** * Created by Name : Ali Ahmed * Email: aliahmedaiub@gmail.com * on 4/20/2017. */
public class AliSpinnerDialog {
    public Context context;
    public String dialogueName;
    MyRecyclerViewAdapter myRecyclerViewAdapter;
    RecyclerView recyclerView;
    Dialog openDialog;
    String selectedText;
    EditText editText;

    AliSpinnerDialog(Context context, String dialogueName, List<Model> models, EditText editText){
        this.context = context;
        this.dialogueName = dialogueName;
        myRecyclerViewAdapter = new MyRecyclerViewAdapter(context,models);
        this.editText = editText;
    }

    public void openDialogue(){
        openDialog = new Dialog(context);
        openDialog.setContentView(R.layout.dialoag);
        openDialog.setTitle(dialogueName);
        recyclerView = (RecyclerView)openDialog.findViewById(R.id.rvSpinnerList);
        recyclerView.setLayoutManager(new LinearLayoutManager(context));
        recyclerView.setAdapter(myRecyclerViewAdapter);
        openDialog.show();
        getSelectedText();
    }

    public void getSelectedText(){
        myRecyclerViewAdapter.setOnItemClickListener(new OnItemClickListener() {
            @Override


            public void onItemClick(Model item) {
                selectedText = item.getText1();
                editText.setText(selectedText);
                openDialog.dismiss();
            }
            @Override


            public void onChildItemClick(Model item) {

            }
        });
    }
}









RecyclerView item layout:



item.xml





<LinearLayout




 xmlns:android="http://schemas.android.com/apk/res/android"




    xmlns:cardview="http://schemas.android.com/apk/res-auto"




    android:id="@+id/card_view"




    android:layout_width="match_parent"




    android:layout_height="wrap_content"




    android:orientation="vertical">






    <LinearLayout



        android:layout_width="match_parent"



        android:layout_height="wrap_content"



        android:orientation="vertical"



        android:padding="10sp">





        <RelativeLayout



            android:layout_width="match_parent"



            android:layout_height="wrap_content">




            <TextView



                android:id="@+id/text1"



                android:layout_width="match_parent"



                android:layout_height="wrap_content"



                android:text="text1"



                android:textColor="#000000" />




            <TextView



                android:id="@+id/text2"



                android:layout_width="match_parent"



                android:layout_height="wrap_content"



                android:layout_below="@+id/text1"



                android:text="text2"



                android:textStyle="



        </RelativeLayout>



    </LinearLayout>




    <View



        android:layout_width="match_parent"



        android:layout_height="0.5sp"



        android:layout_gravity="bottom"



        android:background="#E2E2E2" />



</LinearLayout>







Adapter for Recycler Activity:






package com.bs23.aliahmed.dialogspinner;

import android.content.Context;
import android.support.v7.widget.RecyclerView;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

import android.widget.TextView;


import java.util.HashMap;
import java.util.List;

public class MyRecyclerViewAdapter extends 


       RecyclerView.Adapter<MyRecyclerViewAdapter.CustomViewHolder> {

    private List<Model> models;
    private Context mContext;

    private OnItemClickListener onItemClickListener;
    private HashMap<String, Integer> mCompanyNameToDrawableResIdMap;

    //private OnRecyclerViewItemChildClickListener    public OnItemClickListener getOnItemClickListener() {
        return onItemClickListener;
    }

    public void setOnItemClickListener(OnItemClickListener onItemClickListener) {
        this.onItemClickListener = onItemClickListener;
    }

    public MyRecyclerViewAdapter(Context context, List<Model> models) {
        this.models = models;
        this.mContext = context;
    }

    @Override


    public CustomViewHolder onCreateViewHolder(ViewGroup viewGroup, int i) {
        View view = LayoutInflater.from(mContext).inflate(R.layout.item,null);
        RecyclerView.LayoutParams lp = new RecyclerView.LayoutParams


               (ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT);
        view.setLayoutParams(lp);
        CustomViewHolder viewHolder = new CustomViewHolder(view);
        return viewHolder;
    }

    @Override


    public void onBindViewHolder(final CustomViewHolder customViewHolder, int i) {
        final Model model = models.get(i);

        //Setting text view title        customViewHolder.text1.setText(model.getText1());
        customViewHolder.text2.setText(model.getText2());
        customViewHolder.bind(model, onItemClickListener);

    }

    @Override


    public int getItemCount() {
        return (null != models ? models.size() : 0);
    }

    class CustomViewHolder extends RecyclerView.ViewHolder {
        TextView text1;
        TextView text2;

        CustomViewHolder(View view) {
            super(view);
            this.text1 = (TextView) view.findViewById(R.id.text1);
            this.text2 = (TextView) view.findViewById(R.id.text2);

        }

        public void bind(final Model item, final OnItemClickListener listener) {
            itemView.setOnClickListener(new View.OnClickListener() {
                @Override                public void onClick(View v) {
                    listener.onItemClick(item);
                }
            });
        }
    }
}




 Interface for click listener:






package com.bs23.aliahmed.dialogspinner;

public interface OnItemClickListener {
    void onItemClick(Model item);
    void onChildItemClick(Model item);
}





Main Activity Layout: 







<?xml version="1.0" encoding="utf-8"?>




<android.support.constraint.ConstraintLayout




 xmlns:android="http://schemas.android.com/apk/res/android"




    xmlns:app="http://schemas.android.com/apk/res-auto"




    xmlns:tools="http://schemas.android.com/tools"




    android:layout_width="match_parent"




    android:layout_height="match_parent"




    tools:context="com.bs23.aliahmed.dialogspinner.MainActivity">





    <EditText     



   android:id="@+id/edtSpinner"



        android:layout_width="0dp" 



       android:layout_height="wrap_content"



        android:text=""



        android:drawableEnd="@mipmap/down_new"



        app:layout_constraintBottom_toBottomOf="parent"



        app:layout_constraintLeft_toLeftOf="parent"



        app:layout_constraintRight_toRightOf="parent"



        app:layout_constraintTop_toTopOf="parent"



        app:layout_constraintHorizontal_bias="0.0"



        android:layout_marginTop="8dp"



        app:layout_constraintVertical_bias="0.0"



        android:layout_marginBottom="8dp"



        android:drawableRight="@mipmap/down_new" />




</android.support.constraint.ConstraintLayout>









Main Activity class:




package com.bs23.aliahmed.dialogspinner;

import android.app.Dialog;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.view.View;
import android.widget.EditText;

import java.util.ArrayList;
import java.util.List;

public class MainActivity extends AppCompatActivity {

    EditText edtSpinner;
    List<Model> models = new ArrayList<>();
    MyRecyclerViewAdapter myRecyclerViewAdapter;
    AliSpinnerDialog aliSpinnerDialog;
    Model model;

    @Override


    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        edtSpinner = (EditText) findViewById(R.id.edtSpinner);
        edtSpinner.setFocusable(false);
        edtSpinner.setHint("Select Person");
        model = new Model("Ali", "BAS 23");
        models.add(model);
        models.add(model);
        models.add(model);
        models.add(model);
        models.add(model);
        models.add(model);
        models.add(model);
        models.add(model);
        models.add(model);
        models.add(model);
        models.add(model);
        models.add(model);

        edtSpinner.setOnClickListener(new View.OnClickListener() {
            @Override


            public void onClick(View v) {
                AliSpinnerDialog aliSpinnerDialog = new AliSpinnerDialog


                   (MainActivity.this, "Select persons", models, edtSpinner);
                aliSpinnerDialog.openDialogue();
            }
        });

    }
}











Note:



* EditText is non-focusable.







Conclusion:



This is the simplest way to see the spinner item on the Dialog box.



Source : https://github.com/aliahmedbd/Spinner-with-Dialog-Box---Android






































Comments











Post a Comment

















































Popular posts from this blog









Marquee Text Android: Using RecyclerView like Ticker




















Image







 Why this article?  Sometimes in our Android, apps need a marquee text effect, like a smooth auto scroll horizontally or vertically.  Example  For breaking news apps, there is a necessary functionality, which shows the breaking news, such as on a horizontal scroll.      In share market apps, the top app should give an auto scroll effect to show the text.  In Android, there is no perfect library for marquee text but in this blog, I will give the simplest solution for marquee text.  Procedure   Add RecyclerView, as per your desire and also add dependency.   XML  1. <android.support.v7.widget.RecyclerView    2.     android:id="@+id/rec_all_stocks"    3.     android:layout_width="match_parent"    4.     android:layout_height="match_parent"    5.     android:scrollbars="vertical"    6.     android:layout_alignParentLeft="true"    7.     android:layout_alignParentStart="true"></android.support.v7.widget.RecyclerView>    








Read more










Comparison Between SOAP and REST





















  SOAP and REST can't be compared directly since the first is a protocol (or at least tries to be) and the second is an architectural style. This is probably one of the sources of confusion around it since people tend to call REST any HTTP API that isn't SOAP.   Pushing things a little and trying to establish a comparison, the main difference between SOAP and REST is the degree of coupling between client and server implementations. A SOAP client works like a custom desktop application, tightly coupled to the server. There's a rigid contract between client and server, and everything is expected to break if either side changes anything. You need constant updates following any change, but it's easier to ascertain if the contract is being followed.   A REST client is more like a browser. It's a generic client that knows how to use a protocol and standardized methods, and an application has to fit inside that. You don't violate the protocol standards by creating extr








Read more