Positioning menu items to the left of the ActionBar in Honeycomb - android

I want to position some menu items to the left of Honycomb's ActionBar, but have found no documentation showing how to do this. It looks like it should be possible since the Contacts app has search to the immediate left of the navigation bar. Any idea as to how to set menu items to the left side?

The ActionBar has support for a custom layout between the application icon and the regular ActionBar icons. Example:
// Set the custom section of the ActionBar with Browse and Search.
ActionBar actionBar = getActionBar();
mActionBarView = getLayoutInflater().inflate(R.layout.action_bar_custom, null);
actionBar.setCustomView(mActionBarView);
actionBar.setDisplayOptions(ActionBar.DISPLAY_SHOW_CUSTOM);

here is what works for me like a dream: in the Activity I have this:
//hiding default app icon
ActionBar actionBar = getActionBar();
actionBar.setDisplayShowHomeEnabled(false);
//displaying custom ActionBar
View mActionBarView = getLayoutInflater().inflate(R.layout.my_action_bar, null);
actionBar.setCustomView(mActionBarView);
actionBar.setDisplayOptions(ActionBar.DISPLAY_SHOW_CUSTOM)
my_action_bar.xml:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/turquoise">
<ImageButton
android:id="#+id/btn_slide"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:background="#null"
android:scaleType="centerInside"
android:src="#drawable/btn_slide"
android:paddingRight="50dp"
android:onClick="toggleMenu"
android:paddingTop="4dp"/>
</RelativeLayout>

Related

How to make custom view take up all the actionbar space so it will cover menu as well?

I have created app with similar functionality to a browser. This is what I have right now:
Whenever user clicks on the edittext(the one with google.com inside it) i want to to take all of the space in actionbar covering overflow button and other icons(those are menu items as well).
Is there any way way I could do that? So far I have tried setting the layout-weight of the edittext to 1 but it does not work. The custom view inside actionbar is an linear layout like this one here:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<EditText xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/searchfield"
android:layout_width="0dip"
android:layout_weight="1"
android:layout_height="match_parent"
android:background="#android:color/transparent"
android:imeOptions="actionGo"
android:inputType="textWebEmailAddress"
android:text="www.google.com" />
</LinearLayout>
I should also mention that i want to do it programatically.
Thanks guys
You can hide these icons by following topic: How do I hide a menu item in the actionbar?
I think you can easily hide the actionbar when click,
something like:
ActionBar actionBar = getActionBar(); //OR getSupportActionBar();
actionBar.hide();
Then bring it back when you need it by using:
actionBar.show();

How to set app icon between home indicater icon and app title on action bar

This is my Action Bar i wanna set app icon between arrow and activity title so please tell me how to achieve this OR instead of acivity title i can set app icon there?
Please tell me how to achieve this.
i have used this code to do so.
ActionBar actionBar = getSupportActionBar();
actionBar.setDisplayHomeAsUpEnabled(true);
actionBar.setDisplayUseLogoEnabled(true);
actionBar.setIcon(R.drawable.ic_notification1);
actionBar.setDisplayShowTitleEnabled(false);
actionBar.setHomeAsUpIndicator(R.drawable.ic_drawer);
In code:
getSupportActionBar().setDisplayOptions(ActionBar.DISPLAY_SHOW_CUSTOM);
getSupportActionBar().setCustomView(R.layout.layout_actionbar);
In layout folder make layout_actionbar.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<ImageView />
<TextView />
</LinearLayout>
The back arrow should remain in place, in imageview add your icon and in text view your text.

Manipulating the Toolbar's title and other elements

I'm using the AppCompat toolbar, and for the most part its great. However, dealing with the title has been a nightmare. It's set to the app name by default, and I cannot find a way to hide it.
I was trying to hide it so that I can add my own textview so that I could properly align the title text to the top currently its left-aligned but vertically centered. I could not figure out how to position it where it would be normally if I didn't make my toolbar height longer than usual.
How have you guys been managing the toolbar? How can I align the title text to be at the top position where the title's normally are?
Edit: I've added a screenshot of what it looks like. I'm trying to keep my project private for now so I erased any identifying elements. But notice that the D (which is the title) is not aligned to the top.
If you have set your toolbar as action bar setSupportActionBar(toolbar);
then you can sipmly disable the title by using
getSupportActionBar().setDisplayShowTitleEnabled(false);
and add a textview as your Title in your toolbar layout as toolbar is also a view. See following
<LinearLayout
android:id="#+id/toolbar_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<android.support.v7.widget.Toolbar
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/material_blue"
android:elevation="5dp"
android:minHeight="?attr/actionBarSize"
android:theme="#style/ThemeOverlay.AppCompat.Dark"
app:theme="#style/ToolbarCustomIconColor" >
<TextView
android:id="#+id/textview_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:gravity="center"
android:text="#string/app_name"
android:textColor="#android:color/white" />
</android.support.v7.widget.Toolbar>
</LinearLayout>
This way you can arrange your title anywhere and customize accordingly.
You are using ToolBar from support v7 AppCompat
after that set that toolbar as action bar and then set action bar title for simple title or you want to set your custom layout inside toolbar then same as we are doing in action bar hence.. now your toolbar work as a actionbar..
See below example from ActionBarActivity..
mToolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(mToolbar);
getSupportActionBar().setTitle("Your Title");
Now if you do anything with action bar related methods it is ultimately affected in ToolBar.
to change Toolbar title try this
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
getSupportActionBar().setTitle("Text");
for custom layout for Toolbar try this
getSupportActionBar().setDisplayOptions(ActionBar.DISPLAY_SHOW_CUSTOM);
getSupportActionBar().setCustomView(R.layout.actionbar); //replace with your custom toolbar title

Set NavigationDrawer icon right side using AppCompat-V-21 Toolbar Widget

I've been working in material design using the latest Toolbar Widget provided in AppCompact-V21, with the navigation drawer.
My concern is How can I set navigation drawer icon to right side of the toolbar.
Although I can open navigation drawer from right by setting the android:layout_gravity="right" but navigation icon still appears to be on left side in toolbar.
When Using old Action Bar, I can crate custom action bar with button to right side with custom drawer icon and on click of custom navigation drawer icon open/close the drawer.
What is way to set navigation drawer icon on right side using toolbar ?
How to create custom view for it ?
Well, to customize toolbar and setting your own navigation button, you can add your own imagebutton to the toolbar :
<android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/toolbar"
android:minHeight="?attr/actionBarSize"
android:layout_height="?attr/actionBarSize"
android:layout_width="match_parent" >
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="end"
android:onClick="backButtonHandler"
android:background="#drawable/ic_launcher" />
</android.support.v7.widget.Toolbar>
Then, you can define your backButtonHandler(View v) in your activity class, and add functionality as desired.
I want to move ActionBarDrawerToggle from left to right and I am using appcompat 21 support library.
I haven't found a solution for this. It seems that we need to create a custom item in actionbar/toolbar as Abhinav Puri suggested.
You said you don't know how to add a custom view to your toolbar, hope this helps you or anybody who is fighting with this problem:
toolbar = (Toolbar) findViewById(R.id.toolbar);
if (toolbar != null) {
setSupportActionBar(toolbar);
}
actionBar = getSupportActionBar();
actionBar.setDisplayHomeAsUpEnabled(true);
actionBar.setHomeButtonEnabled(true);
actionBar.setDisplayShowHomeEnabled(true);
actionBar.setDisplayShowCustomEnabled(true);
ActionBar.LayoutParams layoutParams = new ActionBar.LayoutParams(
LayoutParams.WRAP_CONTENT, LayoutParams.MATCH_PARENT);
layoutParams.gravity = Gravity.RIGHT;
actionBar.setCustomView(
getLayoutInflater().inflate(R.layout.custom_top_bar, null),
layoutParams);
ImageButton rightToggle =(ImageButton) toolbar.findViewById(R.id.rightToggle);
rightToggle.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
if (mDrawerLayout.isDrawerOpen(Gravity.RIGHT)) {
mDrawerLayout.closeDrawer(Gravity.RIGHT);
} else {
mDrawerLayout.openDrawer(Gravity.RIGHT);
}
}
});
custom_top_bar.xml:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/rightLayout"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:orientation="horizontal" >
<ImageButton
android:id="#+id/rightToggle"
android:layout_width="?attr/actionBarSize"
android:layout_height="?attr/actionBarSize"
android:src="#drawable/ic_launcher" />
</LinearLayout>
You can do that very easily if you know how it works.
Most android drawers use the application's home button as a drawer button, this button's gravity cannot be changed,
All you have to do is to assign to the drawer button another button that you create yourself in the action bar (menu button), you give it an icon and an action in the onOptionsItemSelected.
if (item.getItemId() == android.R.id.home) {
if(mDrawerLayout.isDrawerOpen(mLinearLayout)) {
mDrawerLayout.closeDrawer(mmLinearLayout);
}
else {
// open the drawer
}
}
you will have approximately the same code as this, change the android.R.id.home by the button's Id I've talked about above.

Android custom action bar remove icon

Below is a screenshot of my current setup.
I have created a custom action bar view, which I set in the code below, and what I would like is two images, one left aligned in the title bar, the other right aligned.
The problem is, that when I hide the app icon, it only hides it, not removes it hence the gap on the left. I found a couple of other SO questions that show how to remove the icon, but that also removes the tabs which I want to keep.
Can any one offer me a solution?
From my onCreate() function:
final ActionBar actionBar = getActionBar();
actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);
LayoutInflater inflater = (LayoutInflater) this.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
View v = inflater.inflate(R.layout.action_bar_title, null);
View homeIcon = findViewById(android.R.id.home);
((View) homeIcon.getParent()).setVisibility(View.GONE);
((View) homeIcon).setVisibility(View.GONE);
actionBar.setDisplayShowCustomEnabled(true);
actionBar.setDisplayShowTitleEnabled(false);
actionBar.setDisplayShowHomeEnabled(true);
actionBar.setCustomView(v);
My xml custom layout:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="fill_horizontal"
android:layout_marginLeft="0dp"
android:orientation="horizontal"
>
<ImageView android:id="#+id/title_img_left"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:src="#drawable/test" />
<ImageView android:id="#+id/title_img_right"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:src="#drawable/test" />
</RelativeLayout>
I'm using the Holo.Light.DarkActionBar theme I believe.
So if I understand the thing which you are trying to achieve, why you just don't add a MenuItem with your custom image on left side and set you actionBarLogo with the image which you want to be on the right side. After that just override home button click and I guess you will achieve the same thing which you can create with custom view, without the padding on the left side of ActionBar.
P.S. If I understand you wrong, please give some more information on how it should look like.
the code is working!!!
ActionBar actionBar = getSherlockActivity().getSupportActionBar();
View customNav = LayoutInflater.from(getActivity()).inflate(R.layout.custom_action_bar_view, null);
ImageButton imageButton = (ImageButton) customNav.findViewById(R.id.imageButton);
ActionBar.LayoutParams lp = new ActionBar
.LayoutParams(RelativeLayout.LayoutParams.MATCH_PARENT, RelativeLayout.LayoutParams.MATCH_PARENT);
actionBar.setCustomView(customNav, lp);
actionBar.setDisplayShowCustomEnabled(true);
actionBar.setDisplayShowTitleEnabled(false);
actionBar.setDisplayShowHomeEnabled(false);

Categories

Resources