Skip to content Skip to sidebar Skip to footer

Android Make Spinner Look Like Imageview

I've seen this post with a solution to make a Spinner look like an EditText. What I want instead is the spinner to look like an ImageView (the selected Image). This way the Spinner

Solution 1:

After Nun'e Chai's comment I did made a PopupWindow that triggers on the click of an ImageButton. So thanks for that, Nun'e Chai. For those interested, below is the code:

In acitivity_main.xml:

<ImageButton
    android:id="@+id/ibtnSpinner"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginBottom="15dp"
    android:contentDescription="@string/checkbox_content_description"
    android:src="@drawable/checkbox_unchecked"
    android:background="@drawable/transparent_background" />

transparent_background.xml:

<?xml version="1.0" encoding="utf-8"?><selectorxmlns:android="http://schemas.android.com/apk/res/android"><itemandroid:state_selected="true"android:drawable="@android:color/transparent" /><itemandroid:state_pressed="true"android:drawable="@android:color/transparent" /><itemandroid:drawable="@android:color/transparent" /></selector>

spinner_popup.xml:

<?xml version="1.0" encoding="utf-8"?><LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"android:id="@+id/spinnerLayout"android:layout_width="wrap_content"android:layout_height="wrap_content"android:orientation="vertical" ><ImageButtonandroid:id="@+id/simgUnchecked"android:layout_width="wrap_content"android:layout_height="wrap_content"android:src="@drawable/checkbox_unchecked"android:contentDescription="@string/checkbox_content_description"android:background="@drawable/transparent_background" /><ImageButtonandroid:id="@+id/simgChecked"android:layout_width="wrap_content"android:layout_height="wrap_content"android:src="@drawable/checkbox_checked"android:contentDescription="@string/checkbox_content_description"android:background="@drawable/transparent_background" /><ImageButtonandroid:id="@+id/simgError"android:layout_width="wrap_content"android:layout_height="wrap_content"android:src="@drawable/checkbox_error"android:contentDescription="@string/checkbox_content_description"android:background="@drawable/transparent_background" /><ImageButtonandroid:id="@+id/simgPartly"android:layout_width="wrap_content"android:layout_height="wrap_content"android:src="@drawable/checkbox_partly"android:contentDescription="@string/checkbox_content_description"android:background="@drawable/transparent_background" /></LinearLayout>

In MainActivity.java:

private Point p;
private ImageButton spinnerButton;
private PopupWindow spinner;

protectedvoidonCreate(Bundle savedInstanceState) {
    ...

    addListenerToSpinnerButton();
}

privatevoidaddListenerToSpinnerButton(){
    spinnerButton = (ImageButton) findViewById(R.id.ibtnSpinner);
    spinnerButton.setOnClickListener(newView.OnClickListener(){
        @OverridepublicvoidonClick(View v){
            if(p != null)
                showSpinner(MainActivity.this, p);
        }
    });
}

// Get the x and y position after the button is drawn on screen// (It's important to note that we can't get the position in the onCreate(),// because at that stage most probably the view isn't drawn yet, so it will return (0, 0))@OverridepublicvoidonWindowFocusChanged(boolean hasFocus){
    int[] location = newint[2];
    ImageButtonbtn= (ImageButton) findViewById(R.id.ibtnPopup);

    // Get the x, y location and store it in the location[] array
    btn.getLocationOnScreen(location);

    // Initialize the Point with x, and y positions
    p = newPoint();
    p.x = location[0];
    p.y = location[1];
}

// The method that displays the spinnerprivatevoidshowSpinner(final ActionBarActivity context, Point p){
    // Inflate the spinner.xmlLinearLayoutviewGroup= (LinearLayout) context.findViewById(R.id.spinnerLayout);
    LayoutInflaterlayoutInflater= (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
    Viewlayout= layoutInflater.inflate(R.layout.spinner, viewGroup);

    // Creating the PopupWindow
    spinner = newPopupWindow(context);
    spinner.setContentView(layout);
    spinner.setWindowLayoutMode(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT);
    spinner.setFocusable(true);

    // Clear the default translucent background// TODO: Fix deprecated to BitmapDrawable(Resource, Bitmap)
    spinner.setBackgroundDrawable(newBitmapDrawable());

    // Displaying the spinner at the specified location, + offsets
    spinner.showAtLocation(layout, Gravity.NO_GRAVITY, p.x, p.y);

    // Getting a reference to the ImageButtons, and close the spinner when clickedImageButtonoptionUnchecked= (ImageButton) layout.findViewById(R.id.simgUnchecked);
    optionUnchecked.setOnClickListener(spinnerOnClickListener);
    optionUnchecked.setTag(R.drawable.checkbox_unchecked);

    ImageButtonoptionChecked= (ImageButton) layout.findViewById(R.id.simgChecked);
    optionChecked.setOnClickListener(spinnerOnClickListener);
    optionChecked.setTag(R.drawable.checkbox_checked);

    ImageButtonoptionError= (ImageButton) layout.findViewById(R.id.simgError);
    optionError.setOnClickListener(spinnerOnClickListener);
    optionError.setTag(R.drawable.checkbox_error);

    ImageButtonoptionPartly= (ImageButton) layout.findViewById(R.id.simgPartly);
    optionPartly.setOnClickListener(spinnerOnClickListener);
    optionPartly.setTag(R.drawable.checkbox_partly);
}
privateOnClickListenerspinnerOnClickListener=newOnClickListener(){
    @OverridepublicvoidonClick(View v){
        // Get the id of the ImageButton that is clickedImageButtonbtn= (ImageButton) v;
        intid= (Integer) btn.getTag(); // We are sure it's an Integer, so the cast from Object to int is safe// Change the ImageButton that triggered the spinner to the same Image
        spinnerButton.setImageResource(id);

        // Close the spinnerif(spinner != null)
            spinner.dismiss();
    }
};

...

Post a Comment for "Android Make Spinner Look Like Imageview"