Develop Reference

Toolbar disappears immediately after launching Activity

I originally had an ActionBar atop my Google Map Activity, but I needed to add multiple elements inside it, so it was suggested to me that I use a Toolbar instead.
Well, I've managed to successfully get it setup, but the Toolbar disappears immediately after launching.
I don't understand why this is happening since there are no errors, and I don't know where I would try to add a breakpoint in my code.
Here's the code in my onCreate method of my MapActivity.java:
/*
CODE FOR DISTANCE TEXT AND SHARE BUTTON
*/
if(getSupportActionBar() != null) {
getSupportActionBar().setDisplayShowTitleEnabled(false);
}
Toolbar toolbar = findViewById(R.id.toolbar);
mDrawerLayout = findViewById(R.id.nav_drawer);
setSupportActionBar(toolbar);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
getSupportActionBar().setHomeButtonEnabled(true);
mToggle = new ActionBarDrawerToggle(this,mDrawerLayout,toolbar,R.string.open, R.string.close);
mDrawerLayout.addDrawerListener(mToggle);
mToggle.syncState();
mNavigationView = findViewById(R.id.navigation_view);
if(mNavigationView != null) {
mNavigationView.setNavigationItemSelectedListener(this);
}
Here are the activities in my AndroidManifest.xml
<application
android:allowBackup="true"
android:icon="#drawable/wheres_my_ride_icon"
android:label="#string/app_name"
android:roundIcon="#mipmap/ic_launcher_round"
android:supportsRtl="true"
android:theme="#style/AppTheme">
<meta-data
android:name="com.google.android.geo.API_KEY"
android:value="***************************" />
<meta-data
android:name="com.google.android.gms.version"
android:value="#integer/google_play_services_version" />
<activity
android:name=".MapActivity"
android:screenOrientation="portrait"
android:theme="#style/AppTheme">
</activity>
<activity
android:name=".StartActivity"
android:screenOrientation="portrait">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
<activity
android:name=".TutorialActivity"
android:label="#string/title_activity_tutorial"
android:theme="#style/AppTheme.NoActionBar">
</activity>
</application>
Here is my styles.xml
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.NoActionBar">
<!-- Customize theme here. -->
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="android:textColorSecondary">#android:color/white</item>
</style>
<!-- Action Bar Custom Style -->
<style name="MyActionBar" parent="Theme.AppCompat.Light">
<item name="android:background">#2a363b</item>
<item name="drawerArrowStyle">#style/DrawerHamburgerStyle</item>
<item name="android:textColorSecondary">#android:color/white</item>
</style>
<!-- Action Bar Icon Style -->
<style name="DrawerHamburgerStyle" parent="#style/Widget.AppCompat.DrawerArrowToggle">
<item name="spinBars">true</item>
<item name="color">#android:color/white</item>
</style>
<!-- Custom Alert Dialog Theme -->
<style name="CustomAlertDialog" parent="#android:style/Theme.Dialog">
<item name="android:textColor">#FFFFFF</item>
</style>
<style name="AppTheme.NoActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
</style>
Here is my toolbar.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/minimalist_grey"
android:gravity="center"
app:popupTheme="#style/AppTheme.PopupOverlay">
<TextView
android:id="#+id/toolbarDistanceText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="start|center_vertical"
android:textSize="20sp"
android:text="Distance (Just for testing)" />
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_share_white"
android:background="#android:color/transparent"
android:layout_gravity="end"
android:layout_marginEnd="20dp"/>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
</LinearLayout>
And here is where I include the toolbar.xml in my activity_map.xml:
<android.support.v4.widget.DrawerLayout
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"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/nav_drawer">
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<!-- RIGHT HERE IS THE TOOLBAR -->
<include layout="#layout/toolbar"/>
<fragment xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/map"
android:name="com.google.android.gms.maps.SupportMapFragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.christopher_sheridan.wheres_my_ride.MapActivity"
tools:layout_editor_absoluteX="0dp"
tools:layout_editor_absoluteY="0dp" />

After reading about layouts, I realized I forgot about z-ordering!
I changed my code from this:
<android.support.v4.widget.DrawerLayout
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"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/nav_drawer">
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<!-- THIS WAS MY OOPSIE -->
<include layout="#layout/toolbar"/>
<fragment xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/map"
android:name="com.google.android.gms.maps.SupportMapFragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.christopher_sheridan.wheres_my_ride.MapActivity"
tools:layout_editor_absoluteX="0dp"
tools:layout_editor_absoluteY="0dp" />
to this:
<android.support.v4.widget.DrawerLayout
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"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/nav_drawer">
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<fragment xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/map"
android:name="com.google.android.gms.maps.SupportMapFragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.christopher_sheridan.wheres_my_ride.MapActivity"
tools:layout_editor_absoluteX="0dp"
tools:layout_editor_absoluteY="0dp" />
<!-- PLACED IT UNDER THE FRAGMENT -->
<include layout="#layout/toolbar"/>
Now the toolbar is there. :-)

Android application label name appears everywhere

I am using this theme in my Android app, Theme.AppCompat.Light.NoActionBar in every activity my project name i.e the label name from the Application tag appears in every Android activity, before it was not happening but recently it is happening. If I remove the label then the package name appears instead of the title.
What exactly is happening ?
I know that there are several ways to fix it but show me where I am wrong and what is happening ? Is it a bug ?
I referred a previous answer Android Application Name Appears as Activity Name and tried but still did not work, So here is a copy of my manifest.xml
<application
android:allowBackup="true"
android:icon="#mipmap/ic_launcher"
android:label="#string/app_name"
android:roundIcon="#mipmap/ic_launcher_round"
android:supportsRtl="true"
android:theme="#style/AppTheme">
<activity android:name=".MainActivity">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
<activity android:name=".Activity2"></activity>
</application>
Below is a sample screenshot, the label name can be seen although that activity(Activity2) consists of a toolbar , the white area is a edittext in the toolbar and nothing else is present inside the toolbar.
EDIT 1
<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>
<item name="android:textColor">#color/white</item>
<item name="android:textColorPrimary">#color/white</item>
<item name="android:textColorSecondary">#color/white</item>
</style>
EDIT 2
public class Activity2 extends AppCompatActivity {
LinedEditText editText;
Toolbar toolbar;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity2);
toolbar = (Toolbar) findViewById(R.id.toolbar);
editText = (LinedEditText) findViewById(R.id.editText);
setSupportActionBar(toolbar);
}
}
activity2.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
>
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/green"
android:id="#+id/toolbar"
>
<EditText
android:layout_width="250dp"
android:layout_height="40dp"
android:id="#+id/title"
android:background="#color/white"
android:layout_margin="10dp"
/>
</android.support.v7.widget.Toolbar>
<com.test.testproject.LinedEditText
android:layout_height="match_parent"
android:layout_width="match_parent"
android:id="#+id/editText"
android:gravity="top"
/>
</LinearLayout>

Check this out.
getSupportActionBar().setDisplayShowTitleEnabled(false);

Check with setting theme for specific activity..which solves your problem..try this
<style name = "NoActionBar" parent = "#android:style/Theme.Holo.Light">
<item name = "android:windowActionBar">false</item>
<item name = "android:windowNoTitle">true</item>
</style>

Just put in onCreate() method after setSupportActionBar(toolbar).
setContentView(R.layout.activity_main);
ActionBar actionBar = getActionBar();
actionBar.setTitle("");

UPDATE:
This is your problem. Avoid using Toolbar.
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/green"
android:id="#+id/toolbar"
>
<EditText
android:layout_width="250dp"
android:layout_height="40dp"
android:id="#+id/title"
android:background="#color/white"
android:layout_margin="10dp"
/>
</android.support.v7.widget.Toolbar>
If you are using NoActionBar in your theme. Avoid using Toolbar in your Activity's layout. That is the reason you are getting the Activity name.
If you are using Toolbar make sure you disable the TITLE on it.

Android remove action bar

I'm trying to disable the action bar for some of my activities, but no matter what I try I can't seem to remove it.
In my styles.xml I have:
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
</style>
<style name="AppTheme.NoActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
</style>
<style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Dark.ActionBar" />
<style name="AppTheme.PopupOverlay" parent="ThemeOverlay.AppCompat.Light" />
And in my manifest.xml I have:
<application
android:allowBackup="true"
android:icon="#mipmap/ic_launcher"
android:label="#string/app_name"
android:supportsRtl="true"
android:theme="#style/AppTheme">
<activity
android:name=".NewActivity"
android:label="#string/app_name"
android:theme="#style/AppTheme.NoActionBar">
</activity>
</application>
My activity layout file:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout 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"
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:openDrawer="start">
<include
layout="#layout/app_bar_new"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<android.support.design.widget.NavigationView
android:id="#+id/nav_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:fitsSystemWindows="true"
app:headerLayout="#layout/nav_header_main"
app:menu="#menu/activity_main_drawer" />
</android.support.v4.widget.DrawerLayout>
My app_bar_new layout file:
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout 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"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context="net.binarysea.sensorload.MainActivity">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="#style/AppTheme.PopupOverlay" />
</android.support.design.widget.AppBarLayout>
<include layout="#layout/content_new" />
</android.support.design.widget.CoordinatorLayout>
I want the action bar to display on activities apart from one (NewActivity). I use intents to call up NewActivity, at which point I thought it would load up the AppTheme.NoActionBar style, but the bar still appears on the screen
I'm using the navigation drawer activity in android studio if that makes a difference
EDIT: I've tried all the suggesting adding Adding Theme.AppCompat.Light.NoActionBar, but that only makes my action bar white and doesn't actually remove it. I tested this in a new android studio project, created a navigation drawer activity, and add the theme setting to my styles.xml. I still get the same problem

Try this...
Just add parent tag for your style.
Styles.xml
<style name="AppTheme.NoActionBar" parent="Theme.AppCompat.Light.NoActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
</style>
AndroidManifest.xml
.......
<application
android:allowBackup="true"
android:icon="#mipmap/ic_launcher"
android:label="#string/app_name"
android:supportsRtl="true"
android:theme="#style/AppTheme">
<activity
android:name=".NewActivity"
android:label="#string/app_name"
android:theme="#style/AppTheme.NoActionBar">
</activity>
</application>
........

Try and drop the following into your manifest
android:theme="#style/Theme.AppCompat.Light.NoActionBar"

Follow this Link- https://developer.android.com/training/system-ui/status
Hide the Status Bar on Android 4.1 and Higher-Kotlin
window.decorView.systemUiVisibility = View.SYSTEM_UI_FLAG_FULLSCREEN
supportActionBar?.hide()
Better use it inside onResume().
Another Solution
https://stackoverflow.com/a/28125711/14366835

MainActivity.java
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
//requestWindowFeature(Window.FEATURE_NO_TITLE); //will hide the title
getSupportActionBar().hide(); // hide the title bar
this.getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,
WindowManager.LayoutParams.FLAG_FULLSCREEN); //enable full screen
setContentView(R.layout.activity_main);
}}

Use like this in styles.xml
<style name="AppTheme" parent="AppTheme.Base">
<!-- Customize your theme here. -->
</style>
<style name="AppTheme.Base" parent="Theme.AppCompat.Light.NoActionBar">
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="android:windowBackground">#color/drawer_bg</item>
</style>
Create seperate layout for toolbar
toolbar.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
</android.support.v7.widget.Toolbar>
In any activity, access this toolbar by using below code.
Toolbar toolbar; //declaration
In onCreate() after setContentView() use this
toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);

You can try this in your onCreate() of NewActivity to hide the action bar for particular Activity
ActionBar actionBar = getSupportActionBar();
actionBar.hide();

activity becomes fullscreen when toolbar is transparent

I am trying to use a transparent toolbar in my app. However, when I set my toolbar as transparent the activity expands to fullscreen height and some content overlaps with my toolbar.
Here is the layout code for the activity:
app_bar_main.xml :
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
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"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<include layout="#layout/content_main" />
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#00FFFFFF"/>
</RelativeLayout>
content_main.xml :
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
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"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:background="#color/colorPrimary"
tools:context=".MainActivity"
tools:showIn="#layout/app_bar_main">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello World!" />
</RelativeLayout>
manifest :
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.aaaaa.www.aaaaaaaaa" >
<application
android:allowBackup="true"
android:icon="#mipmap/ic_launcher"
android:label="#string/app_name"
android:supportsRtl="true"
android:theme="#style/AppTheme" >
<activity
android:name=".MainActivity"
android:label="#string/app_name"
android:theme="#style/AppTheme.NoActionBar" >
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
</manifest>
styles.xml :
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
</style>
<style name="AppTheme.NoActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
</style>
<style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Dark.ActionBar" />
<style name="AppTheme.PopupOverlay" parent="ThemeOverlay.AppCompat.Light" />
</resources>

Try adding this to your relative layout xml
android:paddingTop="?android:attr/actionBarSize"

You can try with this:
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#00FFFFFF">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"/>
</android.support.v7.widget.Toolbar>

You are using a RelativeLayout as parent container in app_bar_main.xml where all children will occupy the entire view if set to match parent. You can change it to LinearLayout with vertical mode where Android will arrange the children one by one in vertical direction without overlap.

Try adding this:
<include layout="#layout/content_main" android:layout_below="#+id/toolbar" />

Strange divider with the v7 support actionbar

The used theme for the actionbar is Theme.AppCompat.Light when using Theme.Holo the issue does not exists.
I am using a custom view for the support v7 actionbar:
<?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:background="#android:color/white" >
</LinearLayout>
And I get the following result :
How do I remove the black line/divider between the layout and the actionbar.
I have tried changing the actionbar style but with not much of a success.
<resources>
<style name="Theme.Styled" parent="#style/Theme.AppCompat.Light">
<!-- Setting values in the android namespace affects API levels 14+ -->
<item name="android:actionBarStyle">#style/Widget.Styled.ActionBar</item>
</style>
<style name="Widget.Styled.ActionBar" parent="#style/Widget.AppCompat.Light.ActionBar">
<item name="dividerVertical">#null</item>
<item name="android:background">#null</item>
<item name="android:paddingTop">0dp</item>
<item name="android:paddingBottom">0dp</item>
<item name="android:showDividers">none</item>
<item name="android:background">#null</item>
<item name="android:divider">#null</item>
<item name="android:dividerHeight">0dp</item>
<item name="android:dividerPadding">0dp</item>
</style>
</resources>
Here is my Activity Source:
public class MainActivity extends ActionBarActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ActionBar actionBar = getSupportActionBar();
actionBar.setDisplayShowTitleEnabled(false);
actionBar.setDisplayShowHomeEnabled(false);
actionBar.setDisplayShowCustomEnabled(true);
actionBar.setCustomView(R.layout.actionbar);
actionBar.setDisplayOptions(ActionBar.DISPLAY_SHOW_CUSTOM);
}
}
This is the manifest:
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.example.actionbartest"
android:versionCode="1"
android:versionName="1.0" >
<uses-sdk
android:minSdkVersion="8"
android:targetSdkVersion="17" />
<application
android:allowBackup="true"
android:icon="#drawable/ic_launcher"
android:label="#string/app_name"
android:theme="#style/Theme.Styled" >
<activity
android:name="com.example.actionbartest.MainActivity"
android:label="#string/app_name"
>
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
</manifest>

You're probably looking for the android:windowContentOverlay attribute.
To remove that drop shadow, simply set the value to #null in your theme, like so:
<style name="Theme.Styled" parent="#style/Theme.AppCompat.Light">
<!-- Setting values in the android namespace affects API levels 14+ -->
<item name="android:actionBarStyle">#style/Widget.Styled.ActionBar</item>
<item name="android:windowContentOverlay">#null</item>
</style>

How do I remove the black line/divider between the layout and the actionbar.
I think you are mistaken. There really isn't a divider present. To confirm:
Open the layout file you're using with setContentView(R.layout.activity_main). Whatever the base container is, set its background to the color you use with the ActionBar. For example, let's say that the base container is a LinearLayout:
<?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:background="#android:color/white" > <<<====== Add this
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello World!" />
</LinearLayout>
You'll see that the ActionBar now blends with the activity's view.
What you are currently seeing is a gradient defined as:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<gradient
android:startColor="#ffe8e8e8"
android:endColor="#ffffffff"
android:angle="270" />
</shape>
Here's where the background comes from:
(taken from platforms/android-17/data/res/values/themes.xml)
<style name="Theme.Light">
<item name="windowBackground">#android:drawable/screen_background_selector_light</item>
....
To get rid of it, you can either give your base container a background color, or override this attribute's value in your project's res/values/themes.xml:
<style name="AppBaseTheme" parent="android:Theme.Holo.Light">
</style>
<!-- Application theme. -->
<style name="AppTheme" parent="AppBaseTheme">
<item name="android:windowBackground">#android:color/white</item>
</style>
Edit:
This is the project setup:
res/layout/activity_main.xml:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/white"
tools:context=".MainActivityCompat" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/hello_world" />
</RelativeLayout>
res/values/styles.xml
<resources>
<style name="AppBaseTheme" parent="#style/Theme.AppCompat.Light">
</style>
<!-- Application theme. -->
<style name="AppTheme" parent="AppBaseTheme">
</style>
</resources>
AndroidManifest.xml:
<uses-sdk
android:minSdkVersion="7"
android:targetSdkVersion="14" />
<application
android:allowBackup="true"
android:icon="#drawable/ic_launcher"
android:label="#string/app_name"
android:theme="#style/AppTheme" >
<activity
android:name="com.example.trialcompat.MainActivityCompat"
android:label="#string/app_name" >
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
MainActivityCompat.java:
import android.os.Bundle;
import android.support.v7.app.ActionBar;
import android.support.v7.app.ActionBarActivity;
public class MainActivityCompat extends ActionBarActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ActionBar actionBar = getSupportActionBar();
actionBar.setDisplayShowTitleEnabled(false);
actionBar.setDisplayShowHomeEnabled(false);
actionBar.setDisplayShowCustomEnabled(true);
actionBar.setCustomView(R.layout.actionbar);
actionBar.setDisplayOptions(ActionBar.DISPLAY_SHOW_CUSTOM);
}
}
R.layout.actionbar is the same as the one you have posted in the question. And this is the result:
As you can see, I cannot reproduce the divider issue. Am I missing something here?

Beside #Vikram answer, add this to the theme:
<item name="android:windowContentOverlay">#android:color/white</item>
Recommendation: Use the same color you use on your layouts. For the default one, use #null
Hope this helps.

I had the same issue. After lots of trials and fails I found that the bug was because of the 9patch background of the action bar.
I switched the 9patch with a regular image and the black line was gone.

For api version >= 21
AppBarLayout appBarLayout = findViewById(R.id.app_bar_layout);
appBarLayout.setOutlineProvider(null);