Positioning of actionLayout in navigation drawer

Question

I have the following setup:

<android.support.design.widget.NavigationView
    style="@style/NavigationView"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:layout_gravity="start"
    app:itemTextAppearance="@style/DrawerTextAppearance"
    app:menu="@menu/drawer"/>

menu/drawer.xml

<menu>    
    <item
        android:id="@+id/messages_item"
        android:icon="@drawable/ic_notifications_neg"
        app:actionLayout="@layout/counter"
        android:title="@string/message_center"/>

    <item
        android:id="@+id/search_item"
        android:icon="@drawable/ic_search_neg"
        android:title="@string/search"/>
</menu>

layout/counter.xml

<TextView
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="26dp"
    android:layout_height="26dp"
    android:text="55"
    style="@style/Bubble"/>

style:

<style name="Bubble" parent="android:Widget.TextView">
    <item name="android:gravity">center</item>
    <item name="android:layout_gravity">center_vertical</item>
    <item name="android:textColor">@android:color/white</item>
    <item name="android:background">@drawable/bubble</item>
</style>

this produces the following result:

the bubble is shown at the top despite style's gravity setting.

How can I position the actionLayout in the middle of a menu item?

check https://stackoverflow.com/a/69376157/16840503 and change gravity as per your need — Avinash Tilekar, Sep 29 '21 at 12:17

score 29 · Accepted Answer · edited Jan 29 '17 at 04:05

29

I managed to solve the problem by accident.

I had to put the TextView inside a container:

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:gravity="center"
    android:orientation="horizontal">

    <TextView
        android:id="@+id/counterView"
        style="@style/Bubble"
        android:layout_width="26dp"
        android:layout_height="26dp"
        android:text="55"/>
</LinearLayout>

Now the counter is shown right in the middle of the menu item!

UPDATE

Counter changing code:

TextView view = (TextView) drawer.getMenu().findItem(R.id.counter_item).getActionView().findViewById(R.id.counterView);
view.setText("" + count);

edited Jan 29 '17 at 04:05

amouly

453
4
10

answered Jun 03 '16 at 12:05

injecteer

20,038
4
45
89

It casting an LinearLayout exception in my case, when adding counter value programmatically. How may i set counter value programmatically by your code. – Mahmudul Jul 31 '16 at 05:14
I have added your xml code in menu_counter.xml , but can not change counter programmatically. I don't know , if i only use TextView then it works but when wrap it into a linearlayout it can not set counter. Got it? – Mahmudul Aug 03 '16 at 04:44
@Mahmudul what code do you use for your "programmatical" counter change? compare it with mine - I updated my answer – injecteer Aug 03 '16 at 08:20
Thank you. I was talking about this. Sorry for my english mistake. I'll try it soon and give you feedback. – Mahmudul Aug 03 '16 at 16:20

score -2 · Answer 2 · answered Jun 03 '16 at 10:02

-2

Try below:

In layout/counter.xml use

android:gravity="right|center_vertical"

<TextView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="26dp"
android:layout_height="26dp"
android:text="55"
android:gravity="right|center_vertical"
style="@style/Bubble"/>

answered Jun 03 '16 at 10:02

Sagar Zala

4,854
9
34
62

that will only move the text inside the bubble (which is a round shape) to the right, but the bubble itself remains top-aligned – injecteer Jun 03 '16 at 10:04
@injecteer. please try "android:layout_gravity" property – Sagar Zala Jun 03 '16 at 10:06
I tried even `android:layout_gravity="bottom"` but it didn't change a thing – injecteer Jun 03 '16 at 10:09
Another way is you can add android:layout_marginTop in counter.xml – Sagar Zala Jun 03 '16 at 10:15
This solution doesn't work. The container is not taking in consideration gravity attributes. – amouly Jan 29 '17 at 03:12

Positioning of actionLayout in navigation drawer

2 Answers2

Linked