androidcustom-titlebarandroid-titlebar

Custom titlebar has unwanted black border

Title Bar

I am getting a black border around the edge of my custom title bar, which I don't want. Any ideas would be great. Here is the code for the title bar.

<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="35sp"
android:gravity="center_vertical"
android:background="@color/TitleBlue">

<ImageView
    android:id="@+id/header"
    android:src="@drawable/app_icon_white"
    android:adjustViewBounds="true"
    android:layout_marginLeft="5sp"
    android:layout_marginBottom="1sp"
    android:padding="3sp"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"/>

<com.hdms.manager.Drawable.TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginLeft="10sp"
    android:text="HDMS Manager"
    android:textColor="@android:color/white"
    android:textStyle="bold"/>

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:gravity="right">

    <RelativeLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">

        <ImageView
            android:id="@+id/circleIcon"
            android:src="@drawable/blank_circle"
            android:adjustViewBounds="true"
            android:layout_marginLeft="-8sp"
            android:padding="8sp"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"/>

        <com.hdms.manager.Drawable.TextView
            android:id="@+id/accessLevel"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignLeft="@+id/circleIcon"
            android:layout_alignTop="@+id/circleIcon"
            android:layout_marginLeft="14sp"
            android:layout_marginTop="8sp"
            android:text=""
            android:textColor="@color/TitleBlue" />
    </RelativeLayout>

    <ImageView
        android:id="@+id/connectionModeIcon"
        android:src="@drawable/direct_on_lan"
        android:adjustViewBounds="true"
        android:layout_marginLeft="-8sp"
        android:padding="8sp"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"/>

    <ImageView
        android:id="@+id/connectedIcon"
        android:src="@drawable/tick_raw"
        android:adjustViewBounds="true"
        android:layout_marginLeft="-8sp"
        android:padding="8sp"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"/>

</LinearLayout>
</LinearLayout>

I am using custom TextView so that I can load my own TTF into the project. But that isn't the problem as the border is still there with a normal TextView.

This is the manifest file.

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.hdms.manager"
android:versionCode="12"
android:versionName="0.35" >

<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>
<uses-permission android:name="android.permission.CHANGE_NETWORK_STATE"/>
<uses-permission android:name="android.permission.ACCESS_WIFI_STATE"/>
<uses-permission android:name="android.permission.CHANGE_WIFI_STATE"/>
<uses-permission android:name="android.permission.READ_PHONE_STATE"/>

<uses-sdk
    android:minSdkVersion="12"
    android:targetSdkVersion="18" />

<application
    android:allowBackup="true"
    android:icon="@drawable/ic_launcher"
    android:label="@string/app_name"
    android:name="App"
    android:theme="@style/AppTheme" >

    <!-- Splash screen -->
    <activity
        android:name="com.hdms.manager.Drawable.SplashScreen"
        android:label="@string/app_name"
        android:screenOrientation="portrait"
        android:theme="@android:style/Theme.Black.NoTitleBar" >
        <intent-filter>
            <action android:name="android.intent.action.MAIN" />

            <category android:name="android.intent.category.LAUNCHER" />
        </intent-filter>
    </activity>

    <!-- Main activity -->
    <activity
        android:name="com.hdms.manager.MainActivity"
        android:label="@string/app_name" >
    </activity>
</application>

</manifest>

And the relevant code from the styles.xml

<!-- Application theme. -->
<style name="AppTheme" parent="android:Theme.Light">
    <item name="android:windowTitleSize">35sp</item>
    <item name="android:dropDownListViewStyle">@style/MyDropDownListView</item>
    <item name="android:buttonStyle">@style/My.Button</item>
</style>

Colour from the colors.xml

<color name="TitleBlue">#008cb8</color>

The problem isn't seen if the colour is set to black.

Solution

  • For anyone interested. I got around this by declaring no title bar in the theme and adding the title bar to the main activity; and using a viewpager with fragments. So that the "title bar" is always visible.

    New Style file

    <style name="AppTheme" parent="android:Theme.Light.NoTitleBar">
     <item name="android:windowTitleSize">35sp</item>
     <item name="android:dropDownListViewStyle">@style/MyDropDownListView</item>
     <item name="android:buttonStyle">@style/My.Button</item>
 </style>

    The New activity_main.xml

    <?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/mainView">

<include layout="@layout/titlebar"/>

<android.support.v4.view.ViewPager
    android:id="@+id/contentViewPager"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_weight="1" />

 </LinearLayout>

    Thanks for the effort guys.