I want to have a small button that has a three dots icon.
I made the icon drawable :
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android"
android:width="6dp"
android:height="24dp"
android:viewportWidth="6.0"
android:viewportHeight="24.0">
<item
android:top="0dp"
android:width="6dp"
android:height="6dp">
<shape android:shape="oval">
<solid
android:color="#666666"/>
<size
android:width="6dp"
android:height="6dp"/>
</shape>
</item>
<item
android:top="9dp"
android:width="6dp"
android:height="6dp">
<shape android:shape="oval">
<solid
android:color="#666666"/>
<size
android:width="6dp"
android:height="6dp"/>
</shape>
</item>
<item
android:top="18dp"
android:width="6dp"
android:height="6dp">
<shape android:shape="oval">
<solid
android:color="#666666"/>
<size
android:width="6dp"
android:height="6dp"/>
</shape>
</item>
</layer-list>
It's a 6 per 24dp, with 3 dots of 6dp each.
When I want to show it, I'm using it like that:
<Button
android:id="@+id/mybtnId"
android:layout_width="24dp"
android:layout_height="wrap_content"
android:layout_marginStart="4dp"
app:icon="@drawable/ic_more_dots" />
I tried to add android:gravity="start"
, change android:layout_width
, android:viewportWidth
etc but this doesn't changes anything or isn't helpful.
How can I make it as a rectangle, to let it fit the button instead of going outside ?
As suggested by @CommonsWare, I change the Button
to an ImageButton
and it works fine.
Here is my new code:
<ImageButton
android:id="@+id/mybtnId"
android:layout_width="24dp"
android:layout_height="wrap_content"
android:layout_marginStart="4dp"
android:src="@drawable/ic_more_dots" />
With this, the button doesn't want to put a text in it, and so doesn't add padding to icon. The icon is well centered as it should.