What's the name of the little widget with three dots inside a cardview in android? What's the name of the little widget with three dots inside a cardview in android? android android

What's the name of the little widget with three dots inside a cardview in android?


This is not a widget at all. It is an ImageButton (borderless in style) using the overflow Icon that includes a PopupMenu

For documentation tutorial visits http://developer.android.com/guide/topics/ui/menus.html#PopupMenu

This refers to a nice code snippet from the link above:

  <ImageButton       android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:src="@drawable/ic_overflow_holo_dark"       android:contentDescription="@string/descr_overflow_button"       android:onClick="showPopup" />

Then use to show popup:

 public void showPopup(View v) {     PopupMenu popup = new PopupMenu(this, v);     MenuInflater inflater = popup.getMenuInflater();     inflater.inflate(R.menu.actions, popup.getMenu());     popup.show(); }

3-Dots button is available among Assets in Android Studio:

Right click on res -> New -> Vector Assets -> Asset Type = Clip Art

-> Click on the button next to Clip Art: label -> Search for more vert

enter image description here


You may also simply use an ImageButton with the actionOverflowButtonStyle style attribute.

<ImageButton    android:layout_width="wrap_content"     android:layout_height="wrap_content"     style="?android:attr/actionOverflowButtonStyle"/>


The "original" three dot widget is the android.widget.ActionMenuPresenter.OverflowMenuButton (ActionMenuPresenter.java). Sadly it is a private class. Here a working shorter version:

public class OverflowMenuButton extends AppCompatImageView{    public OverflowMenuButton(Context context)    {        this(context, null);    }    public OverflowMenuButton(Context context, AttributeSet attrs)    {        this(context, attrs, 0);    }    public OverflowMenuButton(Context context, AttributeSet attrs, int defStyleAttr)    {        super(new ContextThemeWrapper(context, R.style.OverflowButtonTheme), attrs, R.attr.actionOverflowButtonStyle);        setClickable(true);        setFocusable(true);        setVisibility(VISIBLE);        setEnabled(true);    }}

Themes of the ContextThemeWrapper to get a dark and light version:

<!--White dots theme--><style name="OverflowButtonTheme" parent="@style/Theme.AppCompat">    <item name="actionOverflowButtonStyle">@style/Widget.AppCompat.ActionButton.Overflow</item></style><!--Dark dots theme--><style name="OverflowButtonThemeLight" parent="@style/Theme.AppCompat.Light">    <item name="actionOverflowButtonStyle">@style/Widget.AppCompat.Light.ActionButton.Overflow</item></style>