I have put an edit text which has a tint color as white. But it looks black in android above 4.0 devices till lollipop.
I searched for this and got solutions as apply background color as white.
But I have another layout from which the edit text belongs which has dark blue color, so if I apply background color as white whole edit text looks white on that dark blue layout.
What can I do for this now?
Layout :
<RelativeLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="#drawable/purple_bg"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="false"
android:layout_alignParentStart="true"
android:id="#+id/linearLayout"
android:weightSum="1">
<EditText
android:layout_width="match_parent"
android:layout_height="42dp"
android:id="#+id/editTextOrderItem"
android:layout_gravity="center_vertical"
android:backgroundTint="#ffffff"
android:drawableTint="#ffffff"
android:hint="Type here..."
android:textColorHint="#ffffff"
android:paddingLeft="15dp"
android:imeOptions="actionDone"
android:textSize="12sp"
android:layout_marginLeft="#dimen/activity_horizontal_margin"
android:layout_centerVertical="true"
android:textColor="#ffffff"
android:layout_toLeftOf="#+id/imageViewSearch"
android:layout_toStartOf="#+id/imageViewSearch"
android:singleLine="true" />
<ImageView
android:layout_width="40dp"
android:layout_height="40dp"
android:id="#+id/imageViewSearch"
android:backgroundTint="#android:color/white"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:layout_gravity="center"
android:src="#drawable/btn_search"
android:layout_centerVertical="true"
android:padding="10dp"
android:layout_marginRight="06dp" />
</RelativeLayout>
color.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<color name="colorPrimary">#ffffff</color>
<color name="colorPrimaryDark">#eeeeee</color>
<color name="colorAccent">#3e3e3e</color>
<color name="black">#747474</color>
<color name="drawerBacground">#e6f7fd</color>
<color name="themetextcolor">#009688</color>
<color name="darktextcolor">#000000</color>
<color name="lighttextcolor">#ACABAC</color>
<color name="activity_bg_color">#D9E7E4</color>
<color name="activity_footer_color">#37b0a0</color>
<color name="btn_text">#b3ffffff</color>
<color name="seperator">#dedede</color>
<color name="accent">#00B0FF</color>
</resources>
Please help, thank you..
EDIT:
I tried to add new theme and put it in activity in manifest, but did not help.
<resources>
<!-- 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/black</item>
<item name="colorAccent">#color/accent</item>
<item name="android:typeface">monospace</item>
<item name="android:textSize">17sp</item>
</style>
<style name="AppTheme2" parent="Theme.AppCompat.Light.NoActionBar">
<!-- Customize your theme here. -->
<item name="android:typeface">monospace</item>
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorPrimary</item>
</style>
<style name="AppTheme1" parent="Theme.AppCompat.Light.NoActionBar">
<!-- Customize your theme here. -->
<item name="android:typeface">monospace</item>
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/accent</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" />
Manifest :
<activity android:name=".Activities.MainActivity"
android:theme="#style/AppTheme2"
/>
Create a drawable resource xml file (your requirement is only to have a bottom stroke)
Set givendrawable as the background of the editText then you can add the background color you need + bottom line you need with a color
Explain:
This is a resource drawable
dashGap & dashWidth is for doted/broken lines (remove them if you do not need dashes)
android:top -> you can give minus sizes to the views that you don't need to display.(here your requirement is to show only bottom line so top,right & left lines of the item has given -2dp )
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="rectangle" >
<solid android:color="#FFF" /> <-- background color here
</shape>
</item>
<item android:top="-2dp" android:right="-2dp" android:left="-2dp">
<shape>
<solid android:color="#android:color/transparent" />
<stroke
android:dashGap="10px"
android:dashWidth="10px"
android:width="1dp"
android:color="#ababb2" <-- bottom line color here />
</shape>
</item>
</layer-list>
you can set different different color accent at activity in your manifest file.
<color name="colorAccent">#FFFFFF</color>
Related
I want to put all of these argument for this checkedtextview into a drawable file so that if I make more checkedtextviews I can use the same arguments the drawable file.
<CheckedTextView
android:id="#+id/DrinkWater"
android:layout_width="match_parent"
android:layout_height="35dp"
android:layout_marginBottom="2dp"
android:background="#drawable/startscreenbuttons"
android:checked="true"
android:drawableLeft="#drawable/checkbox"
android:fontFamily="casual"
android:onClick="do_drink_water"
android:paddingLeft="3dp"
android:paddingTop="3dp"
android:text="#string/action_drink_water"
android:textColor="#FFFF"
android:textSize="20sp" />
Basically, how do I make CheckedTextView empty (except to call the drawable) and put it's arguments into this:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
</selector>
Use a style, e.g.
<style name="MyCheckedTextView" parent="#android:style/Widget.Material.CheckedTextView">
<item name="android:layout_width">match_parent</item>
<item name="android:layout_height">35dp</item>
<item name="android:layout_marginBottom">2dp</item>
<item name="android:background">#drawable/startscreenbuttons</item>
<item name="android:checked">true</item>
<item name="android:drawableLeft">#drawable/checkbox</item>
<item name="android:fontFamily">casual</item>
<item name="android:paddingLeft">3dp</item>
<item name="android:paddingTop">3dp</item>
<item name="android:textColor">#FFFF</item>
<item name="android:textSize">20sp</item>
</style>
and apply it to your view
<CheckedTextView
android:id="#+id/DrinkWater"
style="#style/MyCheckedTextView"
//...
Also put your values in dimens.xml and colors.xml. It allows better layout management later in the project.
dimens.xml
<resources>
<dimen name="dimen_name">5dp</dimen>
</resources>
colors.xml
<resources>
<color name="color_name">#AABBCCDD</color>
</resources>
I'm trying to make an activity where user can choose a color from the buttons, after clicking one of it the entire application's layouts change base on the value of the button. I'm sorry I just started android programming already a week now, noob here.
Here is my code in theme_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:layout_height="match_parent"
android:background="#618685"
android:id="#+id/relative"
tools:Context="com.majimechibireminder2.Themes" >
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="26dp"
android:text="#string/save" />
<ScrollView
android:id="#+id/scrollView1"
android:layout_width="260dp"
android:layout_height="280dp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:fillViewport="false"
android:orientation="vertical"
android:padding="10dp" >
<TableLayout
android:layout_width="match_parent"
android:layout_height="395dp"
android:background="#618685" >
<Button
android:id="#+id/colorBlue"
android:layout_width="fill_parent"
android:layout_height="50dp"
android:background="#4d4dff" />
<Button
android:id="#+id/colorPurple"
android:layout_width="fill_parent"
android:layout_height="50dp"
android:background="#d11aff" />
<Button
android:id="#+id/colorPink"
android:layout_width="fill_parent"
android:layout_height="50dp"
android:background="#ff4dc4" />
<Button
android:id="#+id/colorRed"
android:layout_width="fill_parent"
android:layout_height="50dp"
android:background="#ff0000" />
<Button
android:id="#+id/colorYellow"
android:layout_width="fill_parent"
android:layout_height="50dp"
android:background="#ffff00" />
<Button
android:id="#+id/colorOrange"
android:layout_width="fill_parent"
android:layout_height="50dp"
android:background="#ffaa00" />
<Button
android:id="#+id/colorGreen"
android:layout_width="fill_parent"
android:layout_height="50dp"
android:background="#5cd65c" />
</TableLayout>
</ScrollView>
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#+id/scrollView1"
android:layout_alignLeft="#+id/scrollView1"
android:layout_marginBottom="24dp"
android:text="#string/theme_color"
android:textAppearance="?android:attr/textAppearanceLarge" />
</RelativeLayout>
Recent code in my java class
// TODO Auto-generated method stub
super.onCreate(savedInstanceState);
relLayout = (View) findViewById(R.id.relative_theme);
SharedPreferences preferences = getSharedPreferences("MY_APP",MODE_PRIVATE);
setTheme(preferences.getInt("MY_CURRENT_THEME",R.style.AppTheme));
setContentView(R.layout.theme_layout);
findViewById(R.id.colorBlue).setOnClickListener(this);
findViewById(R.id.colorGreen).setOnClickListener(this);
findViewById(R.id.colorOrange).setOnClickListener(this);
findViewById(R.id.colorPink).setOnClickListener(this);
findViewById(R.id.colorPurple).setOnClickListener(this);
findViewById(R.id.colorRed).setOnClickListener(this);
findViewById(R.id.colorYellow).setOnClickListener(this);
}
#Override
public void onClick(View v) {
// TODO Auto-generated method stub
switch (v.getId()){
case R.id.colorRed:
preferences.edit().putInt("MY_CURRENT_THEME",R.style.red_theme).commit();
finish(); startActivity(getIntent());
break;
}
}
}
Changing entire application colors or themes requires a configuration changes of the application. Initially We need to create a list of styles depending on your no of colors in your app. So in your styles.xml update the code like below and make changes accordingly for your app needs.
<!-- Base application theme. -->
<style name="red_theme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/redprimary</item>
<item name="colorPrimaryDark">#color/redprimary_dark</item>
<item name="colorAccent">#color/redaccent</item>
<item name="android:textColorPrimary">#color/redprimary_text</item>
<item name="android:textColorSecondary">#color/redsecondary_text</item>
<item name="android:windowBackground">#color/windowBackground</item>
<item name="android:navigationBarColor">#color/navigationColor</item>
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
<item name="themedMenuMailDrawable">#drawable/ic_menu_camera</item>
</style>
<style name="brown_theme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/brownprimary</item>
<item name="colorPrimaryDark">#color/brownprimary_dark</item>
<item name="colorAccent">#color/brownaccent</item>
<item name="android:textColorPrimary">#color/brownprimary_text</item>
<item name="android:textColorSecondary">#color/brownsecondary_text</item>
<item name="android:windowBackground">#color/windowBackground</item>
<item name="android:navigationBarColor">#color/navigationColor</item>
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
<item name="themedMenuMailDrawable">#drawable/ic_menu_manage</item>
</style>
<style name="yellow_theme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/yellowprimary</item>
<item name="colorPrimaryDark">#color/yellowprimary_dark</item>
<item name="colorAccent">#color/yellowaccent</item>
<item name="android:textColorPrimary">#color/yellowprimary_text</item>
<item name="android:textColorSecondary">#color/yellowsecondary_text</item>
<item name="android:windowBackground">#color/windowBackground</item>
<item name="android:navigationBarColor">#color/navigationColor</item>
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
<item name="themedMenuMailDrawable">#drawable/ic_menu_slideshow</item>
</style>
<style name="green_theme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/greenprimary</item>
<item name="colorPrimaryDark">#color/greenprimary_dark</item>
<item name="colorAccent">#color/greenaccent</item>
<item name="android:textColorPrimary">#color/greenprimary_text</item>
<item name="android:textColorSecondary">#color/greensecondary_text</item>
<item name="android:windowBackground">#color/windowBackground</item>
<item name="android:navigationBarColor">#color/navigationColor</item>
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
<item name="themedMenuMailDrawable">#drawable/ic_menu_gallery</item>
</style>
Since your styles require different colors so maintain them in colors.xml file
<?xml version="1.0" encoding="utf-8"?><resources>
<color name="windowBackground">#FFFFFF</color>
<color name="navigationColor">#000000</color>
<color name="colorAccent">#FF4081</color>
<color name="redprimary">#F44336</color>
<color name="redprimary_dark">#D32F2F</color>
<color name="redprimary_light">#FFCDD2</color>
<color name="redaccent">#FF4081</color>
<color name="redprimary_text">#212121</color>
<color name="redsecondary_text">#727272</color>
<color name="redicons">#FFFFFF</color>
<color name="reddivider">#B6B6B6</color>
<color name="brownprimary">#795548</color>
<color name="brownprimary_dark">#5D4037</color>
<color name="brownprimary_light">#D7CCC8</color>
<color name="brownaccent">#9E9E9E</color>
<color name="brownprimary_text">#212121</color>
<color name="brownsecondary_text">#727272</color>
<color name="brownicons">#FFFFFF</color>
<color name="browndivider">#B6B6B6</color>
<color name="greenprimary">#4CAF50</color>
<color name="greenprimary_dark">#388E3C</color>
<color name="greenprimary_light">#C8E6C9</color>
<color name="greenaccent">#FFC107</color>
<color name="greenprimary_text">#212121</color>
<color name="greensecondary_text">#727272</color>
<color name="greenicons">#FFFFFF</color>
<color name="greendivider">#B6B6B6</color>
<color name="yellowprimary">#FFEB3B</color>
<color name="yellowprimary_dark">#FBC02D</color>
<color name="yellowprimary_light">#FFF9C4</color>
<color name="yellowaccent">#448AFF</color>
<color name="yellowprimary_text">#212121</color>
<color name="yellowsecondary_text">#727272</color>
<color name="yellowicons">#212121</color>
<color name="yellowdivider">#B6B6B6</color>
We update all the activities with the below code to set the theme when user opens the activity. add before setting the layout //setContentView()
SharedPreferences preferences = getSharedPreferences("MY_APP",MODE_PRIVATE);setTheme(preferences.getInt("MY_CURRENT_THEME",R.style.default_theme));
So now when ever user clicks on different color button just set the new theme and update the app by calling finish and start activity respectively
preferences.edit().putInt("MY_CURRENT_THEME",R.style.new_theme).commit();
finish();
startActivity(getIntent());
I want to apply different themes to my application. I want to change the color of navigation bar and floating action button.
Now I am able to change color of navigation bar , but floating action button's color dose not get change. How can I change color of fab dynamically when theme is changed?
Style:
<!-- 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>
<item name="colorAccent_500">#color/accent_500</item>
<item name="colorAccent_700">#color/accent_700</item>
<item name="windowActionBarOverlay">false</item>
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
<item name="android:windowBackground">#color/background_material_light</item>
</style>
<style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Dark.ActionBar" />
<style name="AppTheme.PopupOverlay" parent="ThemeOverlay.AppCompat.Light" />
<style name="BlueTheme" parent="Theme.AppCompat.Light.NoActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#3F51B5</item>
<item name="colorPrimaryDark">#303F9F</item>
<item name="colorAccent">#03A9F4</item>
<item name="windowActionBarOverlay">false</item>
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
<item name="android:windowBackground">#color/background_material_light</item>
</style>
<style name="AppTheme.Solarized">
<item name="colorPrimary">#color/orange300</item>
<item name="colorPrimaryDark">#color/orange500</item>
<item name="colorAccent">#color/solarizedOrange</item>
<item name="android:textColorPrimary">#color/solarizedBase01</item>
<item name="android:textColorSecondary">#color/solarizedBase1</item>
</style>
</resources>
Fab :
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/main_fab"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_gravity="bottom|end">
<View
android:id="#+id/myfab_shadow"
android:layout_width="72dp"
android:layout_height="72dp"
android:layout_gravity="center"
android:background="#drawable/fab_shadow"
android:focusable="false" />
<ImageButton
android:id="#+id/imgbtn_fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:background="#drawable/fab_selector"
android:cropToPadding="true"
android:padding="10dp"
android:src="#drawable/ic_add_white_36dp"
android:stateListAnimator="#animator/fab_elevation_selector" />
</FrameLayout>
Fab selector :
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true">
<shape android:shape="oval">
<solid android:color="#color/colorAccent" />
</shape>
</item>
<item android:state_focused="true">
<shape android:shape="oval">
<solid android:color="#color/accent_700" />
</shape>
</item>
<item>
<shape android:shape="oval">
<solid android:color="#color/accent_500" />
</shape>
</item>
</selector>
Thank you..
The floating action button is colored based on your colorAccent
<style name="AppTheme" parent="Base.Theme.AppCompat.Light">
<item name="colorAccent">#color/accent</item>
</style>
Or from code:
fab.setBackgroundTintList(getResources().getColorStateList(R.color.blue));
Or from XML:
Change attribute of app:backgroundTint
But it seems that you are using ImageButton not FloatingActionButton, You should use:
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:layout_margin="#dimen/fab_margin" />
And in the dependencies add:
dependencies {
compile 'com.android.support:design:23.1.1'
}
Thank you for answers. But I just changed in fab selector.
<item android:state_pressed="true">
<shape android:shape="oval">
<solid android:color="?attr/colorAccent" />
</shape>
</item>
<item android:state_focused="true">
<shape android:shape="oval">
<solid android:color="?attr/colorAccent" />
</shape>
</item>
<item>
<shape android:shape="oval">
<solid android:color="?attr/colorAccent" />
</shape>
</item>
This worked..
Please use the material shape theme with the floating button, its very easy now no need for customization
I am creating custom rating bar.The problem is that drawables are not overlaying properly,because there are two different images with same hight and width.It should be like this when the progress will be updated the default image should be replaced by the image2. Any idea?
<RatingBar
android:layout_weight="1"
android:numStars="5"
android:stepSize="1"
android:progressDrawable="#drawable/customselector"
android:layout_width="wrap_content"
android:layout_height="0dp"/>
Here is my custom selector
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:id="#android:id/background"
android:drawable="#drawable/image1" />
<item android:id="#android:id/secondaryProgress"
android:drawable="#drawable/image1" />
<item android:id="#android:id/progress"
android:drawable="#drawable/image2" />
</layer-list>
The way I set the selector to the RatingBar is a bit different, but I don't know if it will help:
<RatingBar
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/ratingBar"
android:rating="3"
android:numStars="5"
android:stepSize="1"
android:isIndicator="false"
style="#style/mileageRatingBar"/>
In your values/styles.xml file put this:
<style name="mileageRatingBar" parent="#android:style/Widget.RatingBar">
<item name="android:progressDrawable">#drawable/rating_stars</item>
<item name="android:minHeight">32dip</item>
<item name="android:maxHeight">32dip</item>
</style>
You can of course change the size. And as you can see here is the reference to the custom drawable.
Remove
android:progressDrawable="#drawable/customselector"
and add style in your values/styles.xml
to be like this
<RatingBar
android:layout_weight="1"
android:numStars="5"
android:stepSize="1"
android:layout_width="wrap_content"
android:layout_height="0dp"
style="#style/customRatingBar"/>
your style from styles.xml
<style name="customRatingBar" parent="#android:style/Widget.RatingBar">
<item name="android:progressDrawable">#drawable/customselector</item>
<item name="android:minHeight">32dip</item>
<item name="android:maxHeight">32dip</item>
</style>
the customselector.xml file must place in drawable folder
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:id="#android:id/background"
android:drawable="#drawable/image1" />
<item android:id="#android:id/secondaryProgress"
android:drawable="#drawable/image1" />
<item android:id="#android:id/progress"
android:drawable="#drawable/image2" />
</layer-list>
make sure item id is written correctly , then you have two option to assign drawable as image or put your selector into your drawable folder selector.xml with your custom setting
instead of image1 put ratingbar_empty.xml
<?xml version="1.0" encoding="utf-8"?>
<selector
xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true"
android:state_window_focused="true"
android:drawable="#drawable/image1" />
<item android:state_focused="true"
android:state_window_focused="true"
android:drawable="#drawable/image1" />
<item android:state_selected="true"
android:state_window_focused="true"
android:drawable="#drawable/image1" />
<item android:drawable="#drawable/image1" />
</selector>
the same to progress but change selector to image2
I have created a theme for my application using this action bar style generator.
http://jgilfelt.github.io/android-actionbarstylegenerator/
I have set the tab colors to orange, but it's not affecting the tabs in my layout.
My layout looks the following.
<android.support.v4.app.FragmentTabHost 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:id="#android:id/tabhost" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<TabWidget
android:id="#android:id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0"
android:orientation="horizontal" />
<FrameLayout
android:id="#+id/tabFrameLayout"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />
</LinearLayout>
</android.support.v4.app.FragmentTabHost>
Here are the other things I have in my style files and in the manifest file.
The Manifest file
android:theme="#style/Theme.Silence"
styles_silence.xml
<style name="Theme.Silence" parent="android:Theme.Holo.Light">
<item name="android:actionBarTabStyle">#style/ActionBarTabStyle.Silence</item>
...
</style>
...
<style name="ActionBarTabStyle.Silence" parent="#android:style/Widget.Holo.Light.ActionBar.TabView">
<item name="android:background">#drawable/tab_indicator_ab_silence</item>
</style>
tab_indicator_ab_silence.xml (this is generated by the program I linked earlier)
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<!-- Non focused states -->
<item android:state_focused="false" android:state_selected="false" android:state_pressed="false" android:drawable="#android:color/transparent" />
<item android:state_focused="false" android:state_selected="true" android:state_pressed="false" android:drawable="#drawable/tab_selected_silence" />
<!-- Focused states -->
<item android:state_focused="true" android:state_selected="false" android:state_pressed="false" android:drawable="#drawable/tab_unselected_focused_silence" />
<item android:state_focused="true" android:state_selected="true" android:state_pressed="false" android:drawable="#drawable/tab_selected_focused_silence" />
<!-- Pressed -->
<!-- Non focused states -->
<item android:state_focused="false" android:state_selected="false" android:state_pressed="true" android:drawable="#drawable/tab_unselected_pressed_silence" />
<item android:state_focused="false" android:state_selected="true" android:state_pressed="true" android:drawable="#drawable/tab_selected_pressed_silence" />
<!-- Focused states -->
<item android:state_focused="true" android:state_selected="false" android:state_pressed="true" android:drawable="#drawable/tab_unselected_pressed_silence" />
<item android:state_focused="true" android:state_selected="true" android:state_pressed="true" android:drawable="#drawable/tab_selected_pressed_silence" />
</selector>
I checked this document, and it seems to me that everything is alright. What could be wrong?
What could be wrong?
That tool generates the styles for the tabs present in the ActionBar, but you're using normal tabs(through the standard TabWidget) which have a different style associated with them. That style is represented in the theme by the tabWidgetStyle attribute which points to the style Widget.(Holo).TabWidget style.
Unfortunately through the Widget.TabWidget style of the theme you can't change the background(and neither the tab layout as the attribute which manages this is hidden) but you can do it manually by assigning a new layout as the tab indicator and placing your selector in there:
fragmentTabHost.addTab(fragmentTabHost.newTabSpec("tabText").setIndicator(buildTabLayout("tabText")), YourFragmentClass.class, null);
where buildTabLayout() is a method like this:
private View buildTabLayout(String tag) {
View tab = getLayoutInflater().inflate(R.layout.new_tab_layout, null);
return tab;
}
The layout is:
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:background="#drawable/tab_indicator_ab_silence" // or you could have a style attribute
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center" android:text="simple"/>
Copy paste the following res/values-v14/styles.xml
<resources xmlns:android="http://schemas.android.com/apk/res/android">
<!--
Base application theme for API 14+. This theme completely replaces
AppBaseTheme from BOTH res/values/styles.xml and
res/values-v11/styles.xml on API 14+ devices.
-->
<style name="AppBaseTheme" parent="android:Theme.Holo.Light.DarkActionBar">
<!-- API 14 theme customizations can go here. -->
<item name="android:actionBarStyle">#style/MyActionBar</item><!-- your theme name -->
<item name="android:actionBarDivider">#null</item>
</style>
<!-- style for the action bar backgrounds -->
<style name="MyActionBar" parent="#android:style/Widget.Holo.ActionBar">
<item name="android:backgroundStacked">#drawable/tab_bar_bg</item> <!-- change your image -->
<item name="android:titleTextStyle">#style/MyActionBar.Text</item> <!-- to cusomize the font style on tab bar --.
</style>
<style name="MyActionBar.Text" parent="#android:style/TextAppearance">
<item name="android:textColor">#A3A3A3</item>
<item name="android:textSize">15sp</item>
</style>
</resources>
Change the default theme to your theme In AndroidManifest.xml
<application
android:theme="#style/AppTheme" >
----
----
</application>