CODEWITHSUNDEEP
android
Yriuns
Yriuns

Reputation: 775

How to add an customized button on the actionbar?

I want to make an action bar with a button on the right with a margin_right. like this picture1 And I use the action button to do it. But the button was on the right without margin_right. picture2 android:layout_marginRight doesn't work here.

here is my styles.xml:

<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="android:Theme.Holo.Light.DarkActionBar">
    <item name="android:actionBarSize">50dp</item>
    <item name="android:actionBarStyle">@style/my_actionbar_style</item>
    <item name="android:actionButtonStyle">@style/my_action_button</item>

</style>
<style name="my_actionbar_style" parent="android:Widget.ActionBar">
    <item name="android:background">@color/actionbar_backgroud</item>
    <item name="android:titleTextStyle">@style/myTitleStyle</item>
    <item name="android:displayOptions">showTitle</item>
</style>
<style name="myTitleStyle">
    <item name="android:textColor">#ffffff</item>
    <item name="android:textSize">20sp</item>
</style>

<style name="my_action_button">
    <item name="android:background">@drawable/button_selector</item>
    <item name="android:width">70dp</item>
    <item name="android:textSize">13sp</item>
    <item name="android:layout_marginTop">10dp</item>
    <item name="android:layout_marginBottom">10dp</item>
    <item name="android:layout_marginRight">10dp</item>
</style>

and this is my menu.xml:

<menu xmlns:tools="http://schemas.android.com/tools"
xmlns:android="http://schemas.android.com/apk/res/android"
tools:ignore="AppCompatResource">

<item
    android:id="@+id/action_search"
    android:title="submit"
    android:showAsAction="always" /></menu>

Upvotes: 6

Views: 5459

Answers (2)

Kevin Constantine
Kevin Constantine

Reputation: 262

Another quick and clean way to go about this is specifying your own layout for that menu button. something like this

<menu xmlns:android="http://schemas.android.com/apk/res/android"
      xmlns:app="http://schemas.android.com/apk/res-auto"
      xmlns:tools="http://schemas.android.com/tools"
      tools:context="com.example.MainActivity">

    <item
        android:id="@+id/action_custom_button"
        android:title="Custom Button"
        android:icon="@drawable/ic_custom_button"
        app:actionLayout="@layout/layout_to_custom_button"
        app:showAsAction="always" />

</menu>

there should be

layout_to_custom_button.xml

layout file which contains the padding and style you wanted.

and also do this in your activity for the click event

@Override
public boolean onCreateOptionsMenu(Menu menu) {
  getMenuInflater().inflate(R.menu.menu_product_detail, menu);
  final Menu mMenu = menu;
  final MenuItem item = menu.findItem(R.id.action_custom_button);
  item.getActionView().setOnClickListener(new View.OnClickListener(){

    @Override
    public void onClick(View v) {
      mMenu.performIdentifierAction(item.getItemId(), 0);
    }
   });
        return true;
}

Upvotes: 6

Jim
Jim

Reputation: 833

I found the easiest way to do this was to just create your own action bar in a layout file. You can then use it by having your activities inherit from a common activity that overrides setContentView, where you just stick the view you're given into a parent view containing that and your action bar. You can mimick the overflowing menu behavior by using ActionMenuView (5.0+). For example, assume you have an action_bar.xml with an ActionMenuView in it named menuView:

class BaseActivity extends Activity {

    ...
    ActionMenuView mMenuView;
    ...

    @Override
    protected void setContentView(int resId) {
        LayoutInflater inflater = getLayoutInflater();
        View actionBar = inflater.inflate(R.layout.action_bar, null);
        View contentView = inflater.inflate(resId);

        mMenuView = (ActionMenuView)actionBar.findViewById(R.id.menuView);

        RelativeLayout parentLayout = new RelativeLayout(this);
        LayoutParams actionBarLayout = new LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.WRAP_CONTENT);
        actionBar.setLayoutParams(actionBarLayout);
        parentLayout.addView(actionBar);

        actionBar.setId(R.id.actionBar);
        LayoutParams contentLayout = new LayoutParams(LayoutParams.MATCH_PARENT, 0);
        contentLayout.addRule(RelativeLayout.BELOW, actionBar.getId());          
        contentLayout.addRule(RelativeLayout.ALIGN_WITH_PARENT_BOTTOM);
        contentView.setLayoutParams(contentLayout);
        parentLayout.addView(contentView);

        setContentView(parentLayout);
    }

}

Upvotes: 1

Related Questions