Set tab above action bar - android

I have some issues with action bar and tabs navigation. Actually I want to set my tabs to be above my Action Bar. (I used Sherlock Action Bar).
I saw that some people had problems because when they enable did :
ab.setDisplayShowTitleEnabled(false);
Tabs of their tabhost was above their ActionBar but it's exactly what I want.
Here is my code :
ActionBar ab = getSupportActionBar();
//getSupportActionBar().setDisplayOptions(ActionBar.DISPLAY_SHOW_CUSTOM);
ab.setCustomView(R.layout.action_wifisettings);
ab.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);
ab.setDisplayShowTitleEnabled(false);
ab.setDisplayShowHomeEnabled(false);
ab.setDisplayUseLogoEnabled(false);
ab.setDisplayShowCustomEnabled(true);
and the xml file corresponding to my action bar :
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="bottom">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#FFFFFF"
android:text="#string/wifi_title"
android:layout_marginLeft="10dp"
android:id="#+id/action_page_title"
android:layout_centerVertical="true"
android:textSize="16sp" />
<CheckBox
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/action_page_title"
android:layout_marginLeft="40dp"
android:textColor="#FFFFFF"
android:layout_centerVertical="true"
android:text="#string/checkbox_title"
android:id="#+id/action_checkbox_wifi"
android:textSize="16sp" />
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginRight="10dp"
android:layout_centerVertical="true"
android:contentDescription="#string/wifi_refresh_desc"
android:background="#drawable/ic_refresh_selector"
android:id="#+id/action_wifi_refresh"
android:textSize="12sp" />
</RelativeLayout>
If you know how to set my action bar to be behind my tabs it could be great.
Thanks.

I've found setting
<item name="displayOptions">homeAsUp|showTitle</item>
in your app theme puts tabs at the top, though it looks buggy to me.

I didn't find a way to do this with the action bar so I had to implement my own view with informations I wanted.

Related

Custom Action bar layout not getting proper width

I am trying to use a custom layout for action bar with navigation drawer but it seems like the width is not consistent.
Here's how it looks like right now:
ListView http://imageshack.com/a/img673/867/fTvd6X.png
For some reason the width is not occupied completely on the left of the action bar.
The items currently used in the custom action bar are : app name(Text View), Spinner(Some Text), ImageView on the right of Spinner.
This is how my layout xm looks like:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#000" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:orientation="horizontal" >
<ImageView
android:layout_width="35dp"
android:layout_height="35dp"
android:padding="10dp"
android:layout_gravity="center_vertical|left"
android:src="#drawable/someIcon" />
<TextView
android:id="#+id/appTextLabel"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:gravity="center"
android:padding="10dp"
android:text="someAppName"
android:textColor="#555555"
android:textSize="24sp"
android:textStyle="bold" />
<Spinner
android:id="#+id/locationSpinner"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="#000"
android:spinnerMode="dropdown" />
<ImageView
android:layout_width="20dp"
android:layout_height="20dp"
android:layout_gravity="center_vertical|right"
android:src="#drawable/location_down_icon" />
</LinearLayout>
And sample code for Action bar :
mActionBar = getSupportActionBar();
mActionBar.setDisplayShowTitleEnabled(false);
mActionBar.setDisplayShowCustomEnabled(true);
mActionBar.setCustomView(actionBarLayout);
No idea whats going wrong with this.
Any help will be really appreciated. Thanks .. :)
Is this a space for icon (or logo)?
you might try
getActionBar().setDisplayShowHomeEnabled(false);
but you have flags ActionBar.DISPLAY_SHOW_HOME and ActionBar.DISPLAY_HOME_AS_UP, maybe they are important for you...
also you might try set transparent icon
getActionBar().setIcon(new ColorDrawable(getResources().getColor(android.R.color.transparent)));

Remove left padding on custom action bar

First I know this is a duplicate question, but none of the answers solved my issue.
Here is my current code:
final ActionBar actionBar = getSupportActionBar();
actionBar.setCustomView(R.layout.action_bar);
actionBar.setDisplayShowTitleEnabled(false);
actionBar.setDisplayShowCustomEnabled(true);
actionBar.setDisplayUseLogoEnabled(false);
actionBar.setDisplayShowHomeEnabled(false);
XML:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="fill_horizontal"
android:layout_gravity="fill_horizontal"
android:padding="0dp"
android:layout_margin="0dp"
android:background="#color/article_background">
<ImageButton android:src="#drawable/filter"
android:layout_width="36dp"
android:layout_height="36dp"
android:background="#00000000"
android:scaleType="centerInside"
android:id="#+id/filters"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"/>
<ImageView
android:src="#drawable/tc_logo"
android:layout_width="36dp"
android:layout_height="36dp"
android:scaleType="centerInside"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:id="#+id/logo" />
<ImageButton android:src="#drawable/menu_button"
android:background="#00000000"
android:layout_width="36dp"
android:layout_height="36dp"
android:scaleType="centerInside"
android:id="#+id/options"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"/>
</LinearLayout>
And there is a left padding showing.
I tried the following suggestions from Stack Overflow:
I tried setting a custom actionbar style in themes with zero padding.
I tried with relative and linear layout as the custom layout.
I tried setting custom actionbar icon in themes and enabling onHomeUp to display a one px image..
I tried layout gravity and gravity to fill_horizontal but didn't work.
No matter what I do, it still shows up.
I had the same issue, and nothing helped, until I found this SO question.
TL;DR
Have the Actionbar to display its up arrow, by calling setDisplayHomeAsUpEnabled(true).
Create a style based on your apps theme in "values-v14" (these will
apply to SDK Version 14 and above).
have this item in the new style: <item name="android:homeAsUpIndicator">#null</item>. This will cause the up to disappear, but the padding the icon had will be gone.

Android Action Bar: Can I replace a custom Title in appcompat v7

I want to add a custom action title on the left of the actin bar, replacing with the default title just like in the below image the default image is shown
And here I want to add this title.
You need to change the logo and the title in action bar.
You can use
getActivity().getActionBar().setTitle("your title");
and
getActivity().getActionBar().setLogo(your draw id);
It is very easy to do ..
There's lot's of way to do this task as defined above .. but I will suggest to make use of custom view for Action bar(As this will work on all devices as same) .. this will let you create much more complex view's in a very handy and easy way.
For your query you make make use of custom views for ActionBar..
You can create customized action bar like this ..
actionBar = getSupportActionBar();
actionBar.setCustomView(R.layout.xyz); // Set custom view like this
// In your case you want an icon ...
ImageView image = (ImageView) actionBar.getCustomView().findViewById(R.id.fare_ll); // Get id of custom view like this
Also you need to set this property ..
actionBar.setDisplayOptions(ActionBar.DISPLAY_SHOW_CUSTOM);
// Now you can do any sort of stuffs with this icon .. like you can perform click functionality
Here's your xyz.xml file .. This file is just for your reference purpose .. this will let you know how to create custom view for Action Bar. :)
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:orientation="horizontal"
>
<LinearLayout
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_gravity="center|start"
android:id="#+id/confirm_cabs_back"
>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/b"
/>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:id="#+id/city_spinner_layout"
android:layout_gravity="center"
>
<TextView
android:id="#+id/action_city"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="XYZ"
android:textStyle="bold"
android:textColor="#color/taxi_blue"
android:layout_gravity="center"
/>
<!-- <ImageView
android:layout_gravity="center"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/drop_down" /> -->
</LinearLayout>
</LinearLayout>
<!-- <LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="end|center"
android:gravity="end"
android:id="#+id/fare_ll"
> -->
<LinearLayout
android:layout_width="2dp"
android:layout_height="fill_parent"
android:background="#color/grey" >
</LinearLayout>
<!-- android:layout_marginTop="2dp"
android:layout_marginBottom="2dp" -->
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/hard_61"
android:id="#+id/fare_ll"
android:layout_gravity="center|end"
android:layout_marginLeft="3dp"
android:layout_marginRight="3dp"
android:textColor="#color/black"
/>
<!-- </LinearLayout> -->
</LinearLayout>
You are good to go ..
You need to use the following code to get this:
private ActionBar actionBar;
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
actionBar = getActionBar();
actionBar.setTitle("");
actionBar.setLogo(R.drawable.logo); //logo needs to be defined in the drawables folder.
}

Actionbar custom style with title highlight on clicked

I have a quick question regarding custom style navigation in the action bar.
I have used this code to create a custom title layout:
ActionBar ab = getActionBar();
ab.setDisplayShowTitleEnabled(false);
ab.setDisplayShowCustomEnabled(true);
View customTitle = getLayoutInflater().inflate(R.layout.custom_title, null);
ab.setCustomView(customTitle);
which looks like this:
But when I click the navigate up button, only the icon and the indicator highlight... like this:
I'm looking for a way to get the whole title clickable, but with the custom layout. Is this possible?
For reference here is my actionbar layout XML:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:gravity="center_vertical"
android:layout_height="match_parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="Ferries"
android:textSize="20sp"
android:textColor="#FFF"
android:id="#+id/actionbar_title_depart" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:text=""
android:textSize="10sp"
android:textColor="#FFF"
android:id="#+id/actionbar_title_arrive" />
</LinearLayout>
Thanks for taking a look, and I look forward to hear some suggestions!

Add custom title bar using ActionBar

I want to add a custom title bar in a child of FragmentActivity, I have a layout for title bar and this is how I do it.
final ActionBar actionBar = getActionBar();
actionBar.setDisplayOptions(ActionBar.DISPLAY_SHOW_CUSTOM);
actionBar.setCustomView(R.layout.title_bar);
actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);
actionBar.addTab(actionBar.newTab().setText("Tab0").setTabListener(this));
actionBar.addTab(actionBar.newTab().setText("Tab1").setTabListener(this));
actionBar.addTab(actionBar.newTab().setText("Tab2").setTabListener(this));
but the problem is title bar is showing below the tabs. I want the title bar above the navigation tabs.
this is my title_bar.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/titleBar"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#color/black" >
<ImageView
android:id="#+id/titleBarMenuBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/menu_btn" />
<TextView
android:id="#+id/titleBarLocation"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_toRightOf="#+id/titleBarMenuBtn"
android:text="Location"
android:textColor="#color/white"
android:textSize="16dip" />
<TextView
android:id="#+id/titleBarUpdateDate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/titleBarMenuBtn"
android:layout_alignLeft="#+id/titleBarLocation"
android:layout_alignParentRight="true"
android:text="Updated: 30/Jul/2013"
android:textColor="#color/white" />
</RelativeLayout>
I saw this post but my tabs are showing above title bar.
Thanks
Showing the tabs above your custom layout is the intended default behaviour. Though there are ways to override this. I found to post with possible solutions: #1 and #2
Further more the sherlock actionbar seems to behave the same way.

Categories

Resources