Custom title bar without padding (Android) - android

So I am using the techniques in this thread to use a custom background for my titlebar. Unfortunately the framework places my layout inside a FrameLayout (title_container) which has padding as seen below.
(source: ggpht.com)
Is there anyway to remove the grey borders? The frame layout is defined in com.android.internal.R.id.title_container, so accessing the frame by ID would be fragile.

I was struggling with this same issue and now I have the answer!
As you probably have seen several places, you need to create a themes.xml resource:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="MyTheme" parent="android:Theme">
<item name="android:windowTitleSize">44dip</item>
<item name="android:windowTitleBackgroundStyle">#style/WindowTitleBackground</item>
</style>
</resources>
Note it is not often mentioned in the sites talking about custom title bars you need to select this theme at the view, activity, or application level. I do it at the application level by adding android:theme property to the application:
<application android:icon="#drawable/icon"
android:label="#string/app_name"
android:theme="#style/MyTheme">
You also need a styles.xml to define that WindowTitleBackgroundStyle. Unlike the various versions of this file I have seen floating aroung the web, I have added one additional line to the file that sets the padding to 0 which gets rid of the padding you are complaining about:
<?xml version="1.0" encoding="UTF-8"?>
<resources>
<style name="WindowTitleBackground">
<item name="android:background">#android:color/transparent</item>
<item name="android:padding">0px</item>
</style>
</resources>

There is actually no need to use a custom layout to customise the background image. The following code in theme.xml will work:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="TitlebarBackgroundStyle">
<item name="android:background">#drawable/header_bg</item>
</style>
<style name="Theme.OTPMain" parent="android:Theme">
<item name="android:windowTitleBackgroundStyle">#style/TitlebarBackgroundStyle</item>
</style>
</resources>
However, if you do actually want to use a custom title bar, then the following code will remove the margin:
ViewGroup v = (ViewGroup) findViewById(android.R.id.title);
v.setPadding(0, 0, 0, 0)
title_bar_background was set as the ID of the background image in the XML. I set android:scaleType="fitXY".

There is a lenghty thread over on anddev.org that may be able to help you out
http://www.anddev.org/my_own_titlebar_backbutton_like_on_the_iphone-t4591.html
I have followed it and successfully created my own title bar which allows me to set the padding.
Xml for my title bar:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout android:id="#+id/header"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="38px" android:layout_width="fill_parent"
android:background="#drawable/gradient">
<TextView android:id="#+id/title" android:layout_width="wrap_content"
android:gravity="center_vertical" style="#style/PhoneText"
android:layout_alignParentLeft="true"
android:text="New Title" android:background="#android:color/transparent"
android:layout_height="wrap_content" android:layout_alignParentTop="true"
android:padding="5dip" android:layout_marginBottom="7px"/>
<TextView android:id="#+id/time" android:layout_width="wrap_content"
android:gravity="center_vertical" style="#style/PhoneText2"
android:layout_alignParentRight="true"
android:text="Test Text" android:background="#android:color/transparent"
android:layout_height="wrap_content" android:layout_alignParentTop="true"
android:padding="4dip" android:layout_marginBottom="7px"/>
</RelativeLayout>
The above creates a small gray bar with text aligned to the right and left sides

I got rid of the padding by getting the title container and setting the padding to 0. It works on Android 4.
titleContainerId = (Integer)Class.forName("com.android.internal.R$id").getField("title_container").get(null);
ViewGroup vg = ((ViewGroup) getWindow().findViewById(titleContainerId));
vg.setPadding(0, 0, 0, 0);

As mentioned by dalewking, you can change the Manifest like this:
<application android:icon="#drawable/icon"
android:label="#string/app_name"
android:theme="#style/MyTheme">
But it did not work for me until I added
android:theme="#style/MyTheme"
to the activity it self like:
<activity
android:name=".MainActivity"
android:screenOrientation="portrait"
android:theme="#style/CustomTheme" >
</activity>

As of 4.2 and ADT 21 when creating a default layout standard dimensions are added to the parent container:
<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:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context=".MainActivity" >
</RelativeLayout>
Values are located in res/dimens.xml:
<!-- Default screen margins, per the Android Design guidelines. -->
<dimen name="activity_horizontal_margin">16dp</dimen>
<dimen name="activity_vertical_margin">16dp</dimen>
</resources>
Either remove them from the parent or change the dimens.xml values to your desired values.

I added the following padding item the AppTheme in styles.xml
<style name="AppTheme" parent="AppBaseTheme">
...
<item name="android:padding">0dp</item>
...
</style>
The Application manifest uses that theme:
<application
...
android:theme="#style/AppTheme" >
...
This resolved it for me.

Related

Android: How to get rid of the header bar in App?

For some reasons when I launch the app in the splash activity and in the row activity, see images, there is a header bar with the name of the app "Baby Read".
I don't want the header there, how do I get rid of it?
Splash Activity
Row Activity
[![enter image description here][2]][2]
This is the splash layout:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/babyreadappsplash"
>
</LinearLayout>
And this is the row layout:
<?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"
>
<ImageView
android:id="#+id/icon"
android:layout_width="90px"
android:layout_height="90px"
android:layout_marginLeft="10px"
android:layout_marginRight="10px"
android:layout_marginBottom="10px"
android:layout_marginTop="10px"
android:src="#drawable/ic_launcher" >
</ImageView>
<TextView
android:id="#+id/label"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#+id/label"
>
</TextView>
This is res/values/styles after adding the code suggested
[![enter image description here][3]][3]
And this is the manifest after adding the code suggested
Create a style for your splash Activity like this
<style name="AppTheme.NoActionBar">
<item name="windowActionBar">false</item>
</style>
after that set this style for your splash Activity in Manifest
<activity
android:name="activity name"
android:theme="#style/AppTheme.NoActionBar"
/>
Update
make your style like this
<style name="splashStyle" parent="Theme.AppCompat.Light.NoActionBar">
//add other attributes
</style>
if not work for you change the parent of your AppTheme to Theme.AppCompat.Light.ActionBar
You can use this in onCreate:
getSupportActionBar().hide();
No need to create anew theme (At least for this purpose)
Modify you app theme (Picture one)change parent="android:Theme.Holo.Light.DarkActionBar" for parent="android:Theme.Holo.NoActionBar"
On you manifest, in the application section (picture 2)add
android:theme="#style/AppTheme"
If by any change you are supporting APIs below 13 you can add
<item name="android:windowActionBar">false</item>
<item name="android:windowNoTitle">true</item>
to your app theme rather than changing the parent.
As a side note I would advise moving from Holo themes to Appcompat or even Material, but that´s out of the scope of this question

Change the background color of both the actionbar and the rest of the activity

In continues to this question, I'd like to change the colors of both the actionbar (the upper pane)to one color and the rest of the screen to a different color.
How can I do it?
when I tried this -
<style name="MyTheme" parent="#style/Theme.AppCompat.Light">
<item name="android:actionBarStyle">#style/MyActionBar</item>
<item name="android:background">#ffffd982</item>
</style>
it seems like the 'android:background' definition override also the actionbarstyle definition
Indeed, the background attribute is known to supersede the actionBarStyle attribute. However, changing the color of the entire Activity needs to be done through the Activity's XML layout, using the android:background attribute of the parent ViewGroup. The ActionBar styles won't help you there.
In your Activity's root ViewGroup, set the background attribute as:
<LinearLayout
android:id="#+id/outermost_viewgroup"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background = "#00FF00"
....
....
EDIT:
I just realized that there is a way for this:
<item name="android:windowBackground">#color/background</item>
Add the above tag to to your ActionBar style definition, and the background in the colors.xml file:
<resources>
<color name="background">#00FF00 </color>
</resources>
There, done!
To change Actionbar style In your style.xml file define style like bellow
<style name="AppBaseTheme" parent="android:Theme.Light">
<!-- Application theme. -->
<style name="AppTheme" parent="AppBaseTheme">
<item name="android:actionBarStyle">#style/MyActionBar</item>
</style>
<style name="MyActionBar" parent="#android:style/Widget.ActionBar">
<item name="android:background"><YourColor></item>
<item name="android:titleTextStyle"><Your String Color></item>
</style>
In your menifest.xml file used your style inside application tag like bellow
<application
android:allowBackup="true"
android:icon="#drawable/ic_launcher"
android:label="#string/app_name"
android:theme="#style/AppTheme" >
And for set background color of your activity just set android:background attribute in your each activity like
<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="#ff2323"
tools:context=".MainActivity" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/textView2"
android:layout_below="#+id/textView2"
android:layout_marginTop="121dp"
android:text="Medium Text"
android:textAppearance="?android:attr/textAppearanceMedium" />
I think this is work for you...!

Set all the viewgroups #null background by default

I am trying to achieve a simple thing instead of always setting the parent layout background to be null, have it null by default with by changing the application theme.
It should look something like the following style:
<style name="MyViewGroupsStyle" parent="android:Widget.ViewGroup">
<item name="android:background">#null</item>
</style>
And have my main theme include it
How do I achieve that?
The result should be like the follows:
<?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:orientation="vertical"
android:background="#null" >
</LinearLayout>
But without adding a style attribute to every layout(view group).

changing the titlebar results in not showing (fonts issue) the listview items

I want to change the title bar color .Following the instructions here
, or eliminating the title bar with Notitle bar in AndroidManifest esults in not showing the text fonts in the list view (I use "simple_list_item_checked" listview).
Here is the xml for this activity:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:background="#FFFAFA"
>
<Button
android:id="#+id/btn"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/green_button"
android:text="#string/show_items_kfc"
android:onClick="onClick"/>
<ListView
android:id="#+id/android:list"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
</LinearLayout>
(the rest of xml code is the same as the link above)
Any solutions to this?
Thanks!
If I got the problem:
Instead of parent="android:Theme":
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="customTheme" parent="android:Theme">
<item name="android:windowTitleBackgroundStyle">#style/WindowTitleBackground</item>
</style>
</resources>
Use parent="android:Theme.Light":
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="customTheme" parent="android:Theme.Light">
<item name="android:windowTitleBackgroundStyle">#style/WindowTitleBackground</item>
</style>
</resources>
The problem is that you are overriding the native Black theme which has black background and white letters. By switching to Light theme you achieve the black letter also have your own white background!
Note: After that you may have to fix custom theme colors (eg. title text color force to white) to white/black if they do not fit the UI you need.
you can use the titlebar object for the purpose...
the link below gives the good explanation on how to do that...
Title bar color change issues

Android - margins specified in custom style not taking effect

I wish to have the default margin for EditText's be 10dp. Therefore, in my styles.xml file I set up the following:
<resources xmlns:android="http://schemas.android.com/apk/res/android">
<style name="MyTheme" parent="android:style/Theme.NoTitleBar">
<item name="android:editTextStyle">#style/edit_text_default</item>
</style>
<style name="edit_text_default" parent="android:style/Widget.EditText">
<item name="android:layout_margin">10dp</item>
</style>
</resources>
Then in AndroidManifest.xml, I set the applications theme to the one I defined:
<application
android:icon="#drawable/ic_launcher"
android:label="#string/app_name"
android:theme="#style/MyTheme" >
...
The "No Title Bar" aspect of the theme is working. However, the default margin for EditText's is not, it is still filling the parent. Here is my table view:
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#FFFFFF" >
<TableRow>
<EditText android:hint="#string/last_name" />
</TableRow>
<TableRow>
<EditText android:hint="#string/first_name" />
</TableRow>
</TableLayout>
Short Answer: If you are specifying layout_margin in a custom style, this style must be explicitly applied to each individual view that you wish to have the specified margin (as seen in the code sample below). Including this style in a theme and applying it to your application or an activity will not work.
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#FFFFFF" >
<TableRow>
<EditText android:hint="#string/last_name" style="#style/edit_text_default" />
</TableRow>
<TableRow>
<EditText android:hint="#string/first_name" style="#style/edit_text_default" />
</TableRow>
</TableLayout>
Explanation: Attributes which begin with layout_ are LayoutParams, or one of its subclasses (e.g. MarginLayoutParams). LayoutParams are used by views to tell their parent ViewGroup how they want to be laid out. Each and every ViewGroup class implements a nested class that extends ViewGroup.LayoutParams. Therefore, LayoutParams are specific to the ViewGroup's type. What this means is that while a TableLayout and a LinearLayout may both have layout_margin as one of it's LayoutParams, they are considered to be completely different attributes.
So layout_margin is not just general attribute that can be applied anywhere. It must be applied within the context of a ViewGroup that specifically defines it as a valid argument. A view must be aware of the type of its parent ViewGroup when LayoutParams are applied.
Specifying layout_margin in a style, including that style in a theme, and attempting to apply that theme to an application/activity will result in the layout attributes being dropped, because no ViewGroup parent has been specified yet and so the arguments are invalid. However, applying the style to an EditText view that has been defined with a TableLayout works, because the parent ViewGroup (the TableLayout) is known.
Sources:
Android documentation on Layout Parameters.
Answer given to this question by Android framework engineer and StackOverflow user adamp.
Also, answer given to this question by StackOverflow user inazaruk.
You arent using the correct theme name in your Manifest. Try changing it to:
<application
android:icon="#drawable/ic_launcher"
android:label="#string/app_name"
android:theme="#style/MyTheme" >
Just in case it is useful for others, I'd like bring the answer by Oliv to another SO question here.
I was trying to add margins to all buttons and found layout_margin does not work.
The theme:
<style name="FooThemeStyle" parent="Base.Theme.AppCompat">
<item name="android:buttonStyle">#style/FooButton</item>
<item name="buttonStyle">#style/FooButton</item>
</style>
The button style:
<style name="FooButton" parent="Widget.AppCompat.Button">
<item name="android:background">#drawable/button_background</item>
</style>
Here is button_background.xml where the answer by Oliv to another SO question is used to set the margin to 2dp: :
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:bottom="2dp"
android:left="2dp"
android:right="2dp"
android:top="2dp">
<selector xmlns:android="http://schemas.android.com/apk/res/android">
...
</selector>
</item>
</layer-list>

Categories

Resources