hildegard hildegard - 1 month ago 10
Android Question

Android: actions showing on the right edge when setting action view instead of icon

I am adding action menu items to the action bar dynamically and because I want a "badge" effect, I am setting views to the items instead of just drawable icons. My problem is that when I have items which have their views set, they are also aligned to the right edge of the action bar. I want to have some sort of inset, but nothing seems to achieve that. I tried setting margins on the action view layouts, setting insets in the XML and programmatically, but nothing is changing. Does anyone know how I can make it so that the actions don't appear right at the edge?

This is what I see now:

enter image description here

And I want to have some sort of padding/margin between the icon and the right edge of the action bar, like on the left side between the left edge and the title.

Here is some code:

View of the action menu items (res/layout/navbar_action.xml):

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="53dp"
android:layout_height="53dp"
android:layout_gravity="center_vertical"
android:layout_marginRight="12dp">

<ImageView
android:id="@+id/navbar_icon"
android:layout_width="44dp"
android:layout_height="44dp"
android:layout_gravity="bottom|left"/>

<TextView
android:id="@+id/navbar_badge"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="top|right"
android:background="@drawable/navbar_badge_circle"
android:gravity="center"
android:textSize="@dimen/textsize_caption"
android:visibility="gone"
/>
</FrameLayout>


Setting up the action bar and the action menu in the base activity:

public abstract class BaseActivity extends AppCompatActivity {

public static final int MENU_PRIMARY = 0;
public static final int MENU_SECONDARY = 1;

protected ActionBar actionBar;

boolean hasPrimaryAction = false;
String primaryActionTitle;
MenuItem.OnMenuItemClickListener primaryActionListener;
View primaryActionView;
boolean hasSecondaryAction = false;
String secondaryActionTitle;
MenuItem.OnMenuItemClickListener secondaryActionListener;
View secondaryActionView;

...

protected boolean initToolbar() {
if (getSupportActionBar() != null) {
actionBar = getSupportActionBar();
return true;
}
Toolbar toolbar = (Toolbar) findViewById(R.id.action_bar);
if (toolbar != null) {
toolbar.setVisibility(View.VISIBLE);
setSupportActionBar(toolbar);
actionBar = getSupportActionBar();
return true;
}
return false;
}

...

public void setAction(String title, Drawable icon, int actionNumber) {
if (actionNumber == MENU_PRIMARY) {
hasPrimaryAction = true;
primaryActionTitle = title;
primaryActionView = LayoutInflater.from(this).inflate(R.layout.navbar_action, null);
ImageView iconView = (ImageView) primaryActionView.findViewById(R.id.navbar_icon);
iconView.setImageDrawable(icon);
primaryIcon = icon;
} else if (actionNumber == MENU_SECONDARY) {
hasSecondaryAction = true;
secondaryActionTitle = title;
secondaryActionIcon = icon;
secondaryActionView = LayoutInflater.from(this).inflate(R.layout.navbar_action, null);
ImageView iconView = (ImageView) secondaryActionView.findViewById(R.id.navbar_icon);
iconView.setImageDrawable(icon);
}
supportInvalidateOptionsMenu();
}

public void setActionBadge(int actionNumber, int badgeCount) {
if (actionNumber == MENU_PRIMARY) {
if (primaryActionView != null) {
TextView badgeView = (TextView) primaryActionView.findViewById(R.id.navbar_badge);
if (badgeCount > 0){
badgeView.setVisibility(View.VISIBLE);
badgeView.setText(String.valueOf(badgeCount));
} else {
badgeView.setVisibility(View.INVISIBLE);
}
}
} else if (actionNumber == MENU_SECONDARY) {
if (secondaryActionView != null) {
TextView badgeView = (TextView) secondaryActionView.findViewById(R.id.navbar_badge);
if (badgeCount > 0) {
badgeView.setVisibility(View.VISIBLE);
badgeView.setText(String.valueOf(badgeCount));
} else {
badgeView.setVisibility(View.INVISIBLE);
}
}
}
supportInvalidateOptionsMenu();
}

public void removeAction(int actionNumber) {
if (actionNumber == MENU_PRIMARY) {
hasPrimaryAction = false;
} else if (actionNumber == MENU_SECONDARY) {
hasSecondaryAction = false;
}
supportInvalidateOptionsMenu();
}

@Override
public boolean onCreateOptionsMenu(Menu menu) {
if (hasPrimaryAction) {
menu.add(Menu.NONE, 0, Menu.NONE, primaryActionTitle).setActionView(primaryActionView).setOnMenuItemClickListener(primaryActionListener).setShowAsAction(MenuItem.SHOW_AS_ACTION_ALWAYS);
}
if (hasSecondaryAction) {
menu.add(Menu.NONE, 1, Menu.NONE, secondaryActionTitle).setActionView(secondaryActionView).setOnMenuItemClickListener(secondaryActionListener).setShowAsAction(MenuItem.SHOW_AS_ACTION_ALWAYS);
}
return true;
}
}


Layout of the action bar:

<android.support.design.widget.AppBarLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/app_bar_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/actionBarBg"
android:fitsSystemWindows="true"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

<android.support.design.widget.CollapsingToolbarLayout
android:id="@+id/collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:elevation="4dp"
android:fitsSystemWindows="true"
app:contentScrim="?attr/actionBarBg"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:titleEnabled="false">

<FrameLayout
android:id="@+id/content"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@android:color/transparent"
android:fitsSystemWindows="true"
app:layout_collapseMode="parallax" />

<android.support.v7.widget.Toolbar
android:id="@+id/action_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="?attr/actionBarSize"
android:elevation="4dp"
app:layout_collapseMode="pin"
android:visibility="gone">

<TextView
android:id="@+id/action_bar_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
style="@style/TextAppearance.Widget.AppCompat.Toolbar.Title"
android:layout_gravity="left"
android:visibility="gone"/>

<ImageView
android:id="@+id/search_icon"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="right"
android:layout_marginLeft="@dimen/navigation_icons_margin_left"
android:layout_marginRight="@dimen/navigation_icons_margin_right"
android:background="@drawable/search_icon_dark_bg"
android:visibility="gone" />

</android.support.v7.widget.Toolbar>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>

Answer

Try this :

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/parent_cart"
    android:layout_width="55dp"
    android:layout_height="wrap_content"
    android:minHeight="?attr/actionBarSize"
    android:paddingRight="5dp"
    android:layout_gravity="right">
  <ImageView
        android:id="@+id/navbar_icon"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/home"
        android:paddingBottom="10dp"
        android:paddingLeft="5dp"
        android:layout_marginTop="20dp"
        android:paddingTop="15dp"
        android:layout_marginLeft="10dp"
        android:layout_marginRight="10dp"
        android:layout_marginBottom="10dp" />

<TextView
        android:id="@+id/nom_product"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="top"
        android:background="@drawable/red_circle"
        android:gravity="center"
        android:layout_margin="10dp"
        android:text="0"
        android:textColor="@color/white"
        android:layout_centerHorizontal="true" />

    </RelativeLayout>

Red Circle :

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval" >

    <solid android:color="@color/colorPrimaryDark" />

    <size
        android:height="20dp"
        android:width="20dp" />



</shape>