Develop Reference

Display icon and title in the ActionBar in Android

I want to display both icon and title in the action bar of an Activity. Here is the screenshot of my app now:
Now I need the app logo be displayed to the left of MyApp text in the action bar. I have already tried the following code to set the logo but nothing happened:
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
getSupportActionBar().setLogo(R.drawable.ic_launcher_web);
getSupportActionBar().setDisplayUseLogoEnabled(true);
setContentView(R.layout.activity_main);
}

I just tried with your code, and this works.
getSupportActionBar().setDisplayShowHomeEnabled(true);
getSupportActionBar().setIcon(R.mipmap.ic_launcher);
Make sure your parent theme is set to Theme.AppCompat.Light.NoActionBar.
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
</style>

You can make a new layout for Action bar and you could implement in main activity
Create new Layout
<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:minHeight="60dp"
android:id="#+id/topHeaderNav"
android:background="#color/primary"
android:layout_height="60dp"
tools:showIn="#layout/activity_main">
<ImageView
android:layout_width="50dp"
android:maxHeight="75dp"
android:maxWidth="75dp"
android:id="#+id/imgTop"
android:layout_centerVertical="true"
android:src="#drawable/mag"
android:layout_height="wrap_content" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/topTitleText"
android:layout_toRightOf="#id/imgTop"
android:layout_centerVertical="true"
android:layout_marginLeft="10dp"
android:textSize="20sp"
android:text="Magnetic Orange"
android:textColor="#FFFFFF"
/>
and implement it in Main Layout
`<include layout="#layout/navbar"
android:id="#+id/topHeaderNavMainActivity"
/>`
I think it will help you

if your require to customize a action bar then use costume layout in action bar, following was the code which explain how customize the action bar,
In your activity put this code onCreate method
getSupportActionBar().setDisplayOptions(ActionBar.DISPLAY_SHOW_CUSTOM | ActionBar.DISPLAY_SHOW_HOME);
LayoutInflater inflator = LayoutInflater.from(this);
View v = inflator.inflate(R.layout.actionbar_layout, null); //hear set your costume layout
getSupportActionBar().setCustomView(v);
getSupportActionBar().setDisplayShowCustomEnabled(true);
getSupportActionBar().setBackgroundDrawable(new ColorDrawable(Color.parseColor("#8731a0")));
it is the code which activiy inherit AppCompatActivity or if you are inheriting activity then replace getSupportActionBar() with getActionBar() and use.

getSupportActionBar().setDisplayShowHomeEnabled(true);
getSupportActionBar().setDisplayShowTitleEnabled(true);

Fist of all be sure you have used style with NoActionBar
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
</style>
Set up your toolbar in onCreate() and be sure it's V7
Toolbar toolbar = (android.support.v7.widget.Toolbar) findViewById(R.id.toolbar);
toolbar.setLogo(R.drawable.ic_launcher);
setSupportActionBar(toolbar);
Your toolbar in xml looks like
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="60dp"/>
And use those methods you have previously tried. This will work.

private ViewGroup actionBarLayout;
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_home_screen);
context = this;
actionBarLayout = (ViewGroup) getLayoutInflater().inflate(R.layout.custom_actionbar, null);
actionBarLayout.setLayoutParams(new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT));
// Set up your ActionBar
/* final ActionBar actionBar = getActionBar();*/
getSupportActionBar().setDisplayShowHomeEnabled(false);
getSupportActionBar().setDisplayShowTitleEnabled(false);
getSupportActionBar().setDisplayShowCustomEnabled(true);
getSupportActionBar().setCustomView(actionBarLayout);
getSupportActionBar().setBackgroundDrawable(new ColorDrawable(getResources().getColor(R.color.green)));
init();
event();
}
and used following style.
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/green</item>
<item name="colorPrimaryDark">#color/green</item>
</style>

Try Custom ActionBar.
custom_actionbar.xml
Layout XML
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:clickable="true"
android:background="#ffffff">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
android:layout_alignParentBottom="true"
android:weightSum="1">
<ImageView
android:layout_width="50dp"
android:layout_height="match_parent"
android:layout_marginLeft="15sp"
android:background="#drawable/emaact"
android:layout_alignParentBottom="true"
android:layout_margin="10dp"
android:id="#+id/imageView"/>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_gravity="right">
<TextView
android:layout_width="75dp"
android:layout_height="match_parent"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Project"
android:layout_gravity="center_vertical"
android:textSize="20sp"
android:id="#+id/textView" android:gravity="center_vertical"
android:textStyle="bold"/>
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_weight="0.99"
android:weightSum="1">
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/txttitle"
android:text="title"
android:textStyle="normal"
android:textSize="20sp"
android:gravity="center"
android:layout_weight="1.06"/>
</LinearLayout>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/menuline"
android:layout_margin="10dp"
android:id="#+id/slidingmenu"
android:layout_gravity="center_vertical"/>
</LinearLayout>
</RelativeLayout>
In Your MainActivity, Use This code.
MainActivity.java
public void customBar(){
ActionBar actionBar = getSupportActionBar();
actionBar.setDisplayShowHomeEnabled(false);
actionBar.setDisplayShowTitleEnabled(false);
LayoutInflater inflater = LayoutInflater.from(this);
View customView = inflater.inflate(R.layout.custom_actionbar, null);
TextView text =(TextView) customView.findViewById(R.id.txttitle);
text.setText("Home");
ImageView menus =(ImageView) customView.findViewById(R.id.slidingmenu);
actionBar.setCustomView(customView);
actionBar.setDisplayShowCustomEnabled(true);
}
Your Action Bar looks like...
Custom ActionBar

Styling the Action Bar

I'm trying to style the action bar by adding a custom back button on the left and an icon in the center. The rendering in Android Studio is exactly as I want it, but when I test the layout on my phone, it just shows both back button and icon on the left, with the icon on top of the back button. This is my layout file:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/action_bar_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageButton android:id="#+id/back_button"
android:contentDescription="Image"
android:src="#drawable/back_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:background="#color/action_bar_bg_color"
android:layout_alignParentLeft="true"/>
<ImageView android:id="#+id/cow_icon"
android:contentDescription="Image"
android:src="#drawable/cowhead"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:layout_centerVertical="true"/>
</RelativeLayout>
And this is what I do to style the action bar:
ActionBar actionBar = getSupportActionBar();
actionBar.setDisplayShowTitleEnabled(false);
View mActionBar = getLayoutInflater().inflate(R.layout.action_bar_layout, null);
actionBar.setCustomView(mActionBar);
actionBar.setDisplayShowCustomEnabled(true);
Anyone see what could be causing the flawed styling of the action bar?

You could try using the new Toolbar : https://developer.android.com/reference/android/widget/Toolbar.html
which is great for making custom actionBar.
Otherwise, you don't have to make your back button custom, actionbar supports it with : https://developer.android.com/reference/android/app/ActionBar.html#setDisplayHomeAsUpEnabled(boolean)

Custom tabs design with Swipeable Views

I've followed a tutorial on how to create tabs that you can swipe between using fragments, but now as I'm done with the tutorial I need to implement a custom design on the tabs. Can I do that because that is not explained in the tutorial.
*This is the tutorial I followed

Create custom tab’s layout
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/tabsLayout" android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:padding="10dip" android:gravity="center" android:orientation="vertical">
<TextView android:id="#+id/tabsText" android:layout_width="wrap_content"
android:layout_height="wrap_content" android:text="Title"
android:textSize="15dip" />
</LinearLayout>
Customize the look and feel of the view
tabs_bg.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/tabsLayout" android:layout_width="fill_parent"
android:layout_height="fill_parent" android:background="#drawable/tab_bg_selector"
android:padding="10dip" android:gravity="center" android:orientation="vertical">
<TextView android:id="#+id/tabsText" android:layout_width="wrap_content"
android:layout_height="wrap_content" android:text="Title"
android:textSize="15dip" android:textColor="#drawable/tab_text_selector" />
</LinearLayout>
similarly set text and background selector.use it as your new layout
you can reference this for more details.

create xml(tab1) in drawble folder
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<!-- When selected, use grey -->
<item android:drawable="#drawable/videos_gray"
android:state_selected="true" />
<!-- When not selected, use white-->
<item android:drawable="#drawable/videos_white" />
and use that in java file
// Create an actionbar
ActionBar actionBar = getActionBar();
// Hide Actionbar Icon
actionBar.setDisplayShowHomeEnabled(false);
// Hide Actionbar Title
actionBar.setDisplayShowTitleEnabled(false);
// Create Actionbar Tabs
actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);
// Create first Tab
tab = actionBar.newTab().setTabListener(new FragmentTab1());
// Create your own custom icon
tab.setIcon(R.drawable.tab1);
actionBar.addTab(tab);
// Create Second Tab
tab = actionBar.newTab().setTabListener(new FragmentTab2());
// Set Tab Title
tab.setText("Tab2");
actionBar.addTab(tab);
// Create Third Tab
tab = actionBar.newTab().setTabListener(new FragmentTab3());
// Set Tab Title
tab.setText("Tab3");
actionBar.addTab(tab);

Applying custom layout to ActionBar in FragmentActivity

I'm trying to change the layout of the actionBar in my app. I managed to display the layout, but there's a problem - the layout doesn't stretch to entire width of the bar and I don't see the title and the icon. Here's how I see it right now:
This is the XML of my 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="match_parent"
android:orientation="vertical"
android:background="#drawable/app_bg"
android:layout_gravity="fill_horizontal" >
<Button
android:id="#+id/button1"
style="?android:attr/buttonStyleSmall"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:text="Button" />
</RelativeLayout>
And this is how I tried to display it in my main FragmentActivity, along with the title:
final ActionBar actionBar = getActionBar();
actionBar.setCustomView(R.layout.action_bar);
actionBar.setDisplayShowTitleEnabled(true);
actionBar.setDisplayUseLogoEnabled(true);
actionBar.setSubtitle("welcome to my app");
actionBar.setTitle("My App");
actionBar.setDisplayShowCustomEnabled(true);
actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);
I want the layout to stretch to entire width of the bar. Also, I'd like to have the options button on the right of the menu later (to the left of the button).
What am I doing wrong and how do I fix it?

how to hide custom title background image?

In my program, sometimes , I need to hide my custom title,but I failed hide the tilte's background image.the button and the Textview I can hide well. my code(xml) as follow.
the title xml : viewimage_slide_title.xml
< RelativeLayout
android:background="#drawable/iphone_header_bg"
android:orientation="horizontal"
android:id="#+id/viewimage_slide_title">
<Button
android:id="#+id/third_image_button_back"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:id="#+id/third_title_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</RelativeLayout>
the style.xml:
<color name="transparent">#00000000</color>
<style name="CustomWindowTitleBackground">
<item name="android:background">#drawable/iphone_header_bg</item>
</style>
<style
name="title" parent="android:Theme.Light">
<item name="android:windowTitleSize">50dp</item><item name="android:windowTitleBackgroundStyle">#style/CustomWindowTitleBackground</item>
</style>
the manifes.xml . the activity. i add as:
<activity
android:name="com.android.camera.third.MianActivity"
android:configChanges="orientation|keyboardHidden"
android:label="#string/view_label"
android:theme="#style/title"
android:screenOrientation="behind" >
In my java(MianActivity) code:
titlebar = (RelativeLayout) findViewById(R.id.viewimage_slide_title);
requestWindowFeature(Window.FEATURE_CUSTOM_TITLE);
setContentView(R.layout.viewimage_slide);
getWindow().setFeatureInt(Window.FEATURE_CUSTOM_TITLE,
R.layout.viewimage_slide_title);
In my other java code:
I do
MianActivity.titlebar.setVisibility(View.GONE);

Add one ParentLayout in your XML:
<RelativeLayout
android:orientation="horizontal"
android:layout_heigth="fill_parent"
android:layout_width="fill_parent">
<RelativeLayout
android:background="#drawable/iphone_header_bg"
android:orientation="horizontal"
android:id="#+id/viewimage_slide_title">
<Button
android:id="#+id/third_image_button_back"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:id="#+id/third_title_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</RelativeLayout>
</RelativeLayout>
If you want to remove your backgroundImage then use,
titlebar.setBackgroundDrawable(null);
titlebar.setVisibility(View.GONE);

First Of all , what do you mean by custom title bar?
Second thing is what i have understood by your code is you want to hide a layout ( viewimage_slide_title.xml) .
For this you simple provide a id to the Relative layout and set visibility gone to the layout rather than the button or textview .
You are able to hide button and text view but failed to hide tilte's background image because background set to relative layout not to button or text.
here is code -
<RelativeLayout
android:background="#drawable/iphone_header_bg"
android:orientation="horizontal"
android:id="#+id/viewimage_slide_title">
<Button
android:id="#+id/third_image_button_back"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:id="#+id/third_title_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</RelativeLayout>
Then your main Activity : -
titlebar = (RelativeLayout) findViewById(R.id.viewimage_slide_title);
MianActivity.titlebar.setVisibility(View.GONE);

I find the reason , because both the theme (title) and layout I set the backgroud, it is wrong,where I change my theme, so it work. thanks guys for these help me ~~ this is my first question in stackoverflow.