Develop Reference

Android TabLayout Text Sizes being Overwritten on Samsung Devices

So I was able to successfully modify what my text tabs look like by using the following code, and it looks as expected on most devices including my Nexus
Styles:
<style name="AppTabLayout" parent="Widget.Design.TabLayout">
<item name="tabIndicatorColor">#color/white</item>
<item name="android:background">#color/colorPrimary</item>
<item name="tabSelectedTextColor">#color/white</item>
<item name="tabTextColor">#color/whiteTransparent</item>
</style>
<style name="TabTextStyle" parent="TextAppearance.AppCompat.Widget.ActionMode.Title.Inverse">
<item name="android:textSize">14sp</item>
<item name="android:textAllCaps">true</item>
</style>
Layout:
<android.support.design.widget.TabLayout
android:id="#+id/toolbar_tab_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="top"
app:tabTextAppearance="#style/TabTextStyle"
style="#style/AppTabLayout">
</android.support.design.widget.TabLayout>
The problem is that on Samsung devices (S5 and S7 have been tested) the sizes appear to be overwritten so that they expand or shrink based on the length of text in the tab - i.e. short strings are made larger to filler the space.
I've seen no mention of this anywhere and can't seem to make the device respect my choice to set the text to the same size no matter the length of the tab title.
Any advice on how to stop Samsungs doing this?

In Samsung phones there is an option called font size change in settings.
Always use dp instead of sp so that text size is set based on density pixel.
ur value in dp
u can check the same by playing around font size change in settings of ur samsumg phone

Android Preference Screen, change color behind title text

I have changed the background color to my preference screen but the title bar is acting strange.
I have this as my theme set in the manifest for the preference activity as below:
<style name="PrefTheme">
<item name="android:background">#color/activity_default_bg_color</item>
</style>
Which works, but the title bar now looks like this:
I have tried playing with a bunch of other properties to change it but can't find the correct one.
Thanks
Steve
Edit:
Looking at the edit text popups they have also changed
I tried to change the popups with, but didn't work
<item name="android:windowBackground">#color/activity_default_bg_color</item>
<item name="android:popupBackground">#color/activity_default_bg_color</item>

This is the problem:
<item name="android:background">#color/activity_default_bg_color</item>
I had to use this instead
<item name="android:windowBackground">#color/activity_default_bg_color</item>
This fixed both the problems mentioned above.
Hope this helps someone.
Thanks
Steve
Edit:
End Result:

Compound drawable in a TextView is stretching beyond the image size

I am creating a menu in an Android app with several list items and corresponding icons. The problem that I'm having is that the icons are being stretched beyond the image size for some reason. I have created a menu like this before without such a problem, and I essentially copied the code over to this new project, primarily only changing the image names and string names.
Here is the code from the menu layout for a single list item:
<TextView
android:id="#+id/listItemCardTransactions"
style="#style/NavigationMenuItem"
android:drawableLeft="#drawable/ic_card_transaction_menu_icon_normal"
android:text="#string/card_transactions" />
Here is the NavigationMenuItem style:
<style name="NavigationMenuItem">
<item name="android:layout_width">match_parent</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:paddingTop">#dimen/menu_list_item_padding</item>
<item name="android:paddingBottom">#dimen/menu_list_item_padding</item>
<item name="android:paddingLeft">#dimen/menu_list_item_padding</item>
<item name="android:drawablePadding">#dimen/menu_list_item_left_padding</item>
<item name="android:gravity">center_vertical</item>
<item name="android:clickable">true</item>
<item name="android:background">#drawable/selector_navigation_item</item>
<item name="android:textSize">#dimen/text_size_menu_item</item>
</style>
Here are the dimensions:
<dimen name="text_size_menu_item">18sp</dimen>
<dimen name="menu_list_item_padding">6dip</dimen>
<dimen name="menu_list_item_left_padding">12dip</dimen>
And here is what the menu looks like right now (I know there are several other problems but those aren't my concern right now). You can see the stretching problem best when you drag-and-drop the image to get the full view:
And what the icon is supposed to look like (this one is grey since I wasn't sure how to easily make the white one visible on a white background):
Anyone know what might be causing the image to stretch past its dimensions like this?

I would follow Barry's advise in the comments, ie use an ImageView + TextView inside a LinearLayout for each item. However, to solve the "the height of the list item is smaller", you could try adding the following attribute to the ImageView:
android:adjustViewBounds="true"
If I'm not mistaken, this should effectively make sure that the view bounds is actually based on the content of the image, and not the aspect ratio (ie, it won't change the height beyond the maximum height of the image itself due to "scaling").
Hope that helps (and also makes a bit sense).

Eclipse GUI shows newly styled button incorrectly

I'm starting with a fully working app, with all the buttons in the right locations and the right sizes... but now I wanted to try out using styles for the first time. In particular I wanted to have the text colour in my buttons a dark blue and the background white. So I wrote the following in styles.xml in res/values ->
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="mybut" parent="#android:style/Widget.Button">
<item name="android:textColor">#color/dblue</item>
<item name="android:background">#ffffffff</item>
</style>
</resources>
I modified my button code as follows:
<Button
android:id="#+id/spec"
style="#style/mybut" <-- I added this line here
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0.12"
android:text="#string/spec" />
In eclipse's XML viewer, the new button looked right in every way. But then at run time, on my android device, the button's height had shrunk by about a third! Any ideas?
EDIT: I'm not very confident about the parent="#android:style/Widget.Button" bit. I'm suspicious that perhaps I'm somehow already using some other style?/theme? and perhaps the line should look something akin to parent="#android:otherstyle/Widget.Button" or parent="#android:style/other.Widget.Button"... or similar.
EDIT: FYI... I'm trying this out on a kind of "home screen" activity which just contains two big buttons. I added the style="#style/mybut" to just one of the two buttons. They are now clearly very different sizes.
EDIT: I noticed that in the manifest I have android:theme="#android:style/Theme.NoTitleBar.Fullscreen" ... does that mean I need to make my button's parent android:theme="#android:style/Theme.NoTitleBar.Fullscreen.Widget.Button" ?? or something like that?

By default, a Button has a 9-patch background, not a simple color. This image has padding and a content area which alters the actual size of the button.
When you change the background, you're stripping that padding, and it appears smaller. The correct way to do this is to create a new 9-patch, based on the old, but with the colors changed.

The problem must be here:
android:layout_weight="0.12"
If you have an action_bar or something like that when you run your app the button is going to shrink. In your preview the action_bar doesn't appear (I'm just guessing).
EDIT:
Here is a sample of a custom button that I use in my app, I put a min height and width.
Instead of using: parent="#android:style/Widget.Button" I use: parent="android:Widget.Button"
<style name="ButtonCustom" parent="android:Widget.Button">
<item name="android:background">#drawable/btn_default_holo_light</item>
<item name="android:minHeight">48dip</item>
<item name="android:minWidth">64dip</item>
<item name="android:textColor">#fff</item>
</style>

Style ActionMode

I am using ActionBarSherlock and trying to style ActionMode. I can change background and done button using these attributes in my style:
<item name="android:actionModeCloseDrawable">#drawable/abs__ic_cab_done_holo_dark</item>
<item name="android:actionModeBackground">#drawable/actionbar_bg</item>
But I can not figure out how to set the color of the vertical line just next to the done button. Does anyone know how to do this?

I solved it with this code in my theme:
<item name="android:actionModeCloseButtonStyle">#style/action_button_done</item>
And the style action_button_done just sets the background drawable:
<style name="action_button_done" parent="Widget.Sherlock.ActionButton.CloseMode">
<item name="android:background">#drawable/abs__btn_cab_done_holo_dark</item>
</style>
Warning
This should be a simple thing to do. And it was, but for some reason htc decided to put an extra layer on top of the button that makes it impossible to style it. I was just lucky that I tried deploying on my friends samsung galaxy nexus and noticed that it actually worked. I only used htc one x, so don't know if it is the same on other htc devices.