I'm trying to implement material design to legacy code.
I want a button to have a ripple effect on click but it shows nothing.
I'm using default ?android:attr/selectableItemBackground.
this is button xml:
<Button
android:text="Wandio"
android:padding="10dp"
android:textColor="#ffffff"
android:background="?android:attr/selectableItemBackground"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/wandio_link" />
style in values folder:
<resources>
<color name="main_green">#45bb61</color>
<style name="AppTheme" parent="AppTheme.Base">
</style>
<style name="Theme.Splash" parent="android:Theme">
<item name="android:windowNoTitle">true</item>
<item name="windowActionBar">false</item>
</style>
<style name="AppTheme.Base" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="windowNoTitle">true</item>
<item name="windowActionBar">false</item>
<item name="colorPrimary">#909CD4</item>
<item name="colorPrimaryDark">#D490CA</item>
<item name="colorAccent">#FFFFFF</item>
<item name="android:imageButtonStyle">#style/ImageButtonStyle</item>
<item name="android:windowBackground">#color/main_green</item>
</style>
<style name="ImageButtonStyle">
<item name="android:background">#android:color/transparent</item>
</style>
</resources>
style in values-v21 folder:
<resources>
<style name="AppTheme" parent="AppTheme.Base">
<item name="windowNoTitle">true</item>
<item name="windowActionBar">false</item>
<item name="android:windowContentTransitions">true</item>
<item name="android:windowAllowEnterTransitionOverlap">true</item>
<item name="android:windowAllowReturnTransitionOverlap">true</item>
<item name="android:windowSharedElementEnterTransition">#android:transition/move</item>
<item name="android:windowSharedElementExitTransition">#android:transition/move</item>
<item name="android:windowTranslucentStatus">true</item>
<item name="android:fitsSystemWindows">true</item>
<item name="android:imageButtonStyle">#style/StyleApi21</item>
<item name="android:buttonStyle">#style/StyleApi21</item>
</style>
<style name="StyleApi21">
<item name="android:background">?android:attr/selectableItemBackgroundBorderless</item>
</style>
Never had this problem before. Can't find what I'm missing.
Any suggestions?
I tryed the same thing and I have used this in my custom button xml:
<item ><ripple xmlns:android="http://schemas.android.com/apk/res/android"
android:color="?android:colorControlHighlight">
<item android:id="#android:id/mask">
<shape android:shape="oval">
<solid android:color="#FFBB00" />
</shape>
</item>
<item>
<shape android:shape="oval">
<solid android:color="#color/colorAccent" />
</shape>
</item>
</ripple>
Here is my another xml for older devices:
<item>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/fab_selected" android:state_selected="true"/>
<item android:drawable="#drawable/fab_pressed" android:state_pressed="true"/>
<item android:drawable="#drawable/fab_normal"/>
</selector>
</item>
These drawable files are just different colors of the button.
Related
I implemented a shader in this way, the xml file is called horde_shader.xml, and looks like this:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<gradient
android:endColor="#color/bordeaux"
android:angle="270">
</gradient>
</shape>
I have also implemented the following themes, in the related style.xml file that looks like this:
<resources xmlns:tools="http://schemas.android.com/tools">
<style name="AllyTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="colorPrimary">#color/royalBlue</item>
<item name="colorAccent">#color/royalBlue</item>
<item name="android:navigationBarColor">#color/royalBlue</item>
<item name="colorShader">#drawable/ally_shader</item>
<item name="imageFaction">#drawable/ally</item>
<item name="android:textColorSecondary">#android:color/white</item>
<item name="android:textColorPrimary">#android:color/white</item>
<item name="android:textColorHint">#android:color/white</item>
<item name="android:fontFamily">serif</item>
</style>
<style name="HordeTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="colorPrimary">#color/bordeaux</item>
<item name="colorAccent">#color/bordeaux</item>
<item name="android:navigationBarColor">#color/bordeaux</item>
<item name="colorShader">#drawable/horde_shader</item>
<item name="imageFaction">#drawable/horde1</item>
<item name="android:textColorSecondary">#android:color/white</item>
<item name="android:textColorPrimary">#android:color/white</item>
<item name="android:fontFamily">serif</item>
</style>
<style name="Theme">Theme</style>
<style name="AppTheme">AppTheme</style>
</resources>
I tried in an activity to set the background in this way:
<TextView
android:id="#+id/banner_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Esempio Titolo"
android:textAlignment="center"
android:fontFamily="serif"
android:textColor="#FFF"
android:paddingBottom="5dp"
android:background="?attr/colorShader"
android:layout_alignParentBottom="true"
android:textSize="17dp"/>
button style rounded corners not working on android earlier than level 21
Note that I'm applying this style on the whole project
drawable edittext.xml
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" android:padding="10dp">
<solid android:color="#FFFFFF"/>
<corners
android:bottomRightRadius="15dip"
android:bottomLeftRadius="15dip"
android:topLeftRadius="15dip"
android:topRightRadius="15dip"/>
</shape>
Styles.xml
<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/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="android:windowBackground">#color/colorPrimary</item>
<item name="android:buttonStyle">#style/App_ButtonStyle</item>
<item name="editTextStyle">#style/App_EditTextStyle</item>
<item name="android:spinnerStyle">#style/App_SpinnerStyle</item>
</style>
<style name="App_EditTextStyle" parent="#android:style/Widget.EditText">
<item name="android:background">#drawable/edittext</item>
<item name="android:textColor">#color/colorPrimary</item>
<item name="android:padding">5dip</item>
<item name="android:gravity">right</item>
</style>
<style name="App_SpinnerStyle" parent="#android:style/Widget.Spinner">
<item name="android:background">#drawable/edittext</item>
<item name="android:textColor">#color/colorPrimary</item>
<item name="android:padding">5dip</item>
<item name="android:gravity">right</item>
</style>
<style name="App_ButtonStyle" parent="#android:style/Widget.Button">
<item name="android:background">#drawable/edittext</item>
<item name="android:textColor">#color/colorPrimary</item>
<item name="android:padding">10dip</item>
<item name="android:gravity">center</item>
<item name="android:width">150dip</item>
</style>
also spinner style not applied,
This screenshot show how it on android API level 21+
and the below picture shows how it be on earlier than level 21
So any idea what is wrong with this style
Note that Widget.AppCompat.Button didn't solve the problem
Instead of creating another styles.
use button background android:background="#drawable/edittext"
this worked for my in every API level.
I got the following background for an edit text:
edit_text_rounded_white.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape>
<solid android:color="#66c6c6c6"/>
<stroke android:width="0.1dp"
android:color="#66c6c6c6"/>
<corners android:radius="40dp"/>
</shape>
</item>
</selector>
in my styles.xml I define the following:
<style name="editText">
<item name="android:background">#drawable/edit_text_rounded_white</item>
<item name="android:drawablePadding">5dp</item>
<item name="android:paddingBottom">2dp</item>
<item name="android:paddingTop">2dp</item>
<item name="android:paddingLeft">10dp</item>
<item name="android:paddingRight">10dp</item>
<item name="android:textCursorDrawable">#drawable/edit_text_cursor</item>
<item name="colorControlNormal">#color/colorPrimaryDark</item>
<item name="colorControlActivated">#color/transparentWhite50</item>
</style>
When I set the style via: style="#style/editText" for my editTexts it takes the background but doesnt take the colorControl I set. When I set the style via android:theme="#style/editText" it takes the colorControls but doesnt show the background image. I already tried src and windowBackground instead of background in the style file.
Any ideas how achieve both? Showing background and the colorControls?
Split your style into two:
<style name="editTextStyle">
<item name="android:background">#drawable/edit_text_rounded_white</item>
<item name="android:drawablePadding">5dp</item>
<item name="android:paddingBottom">2dp</item>
<item name="android:paddingTop">2dp</item>
<item name="android:paddingLeft">10dp</item>
<item name="android:paddingRight">10dp</item>
<item name="android:textCursorDrawable">#drawable/edit_text_cursor</item>
</style>
<style name="editTextTheme">
<item name="colorControlNormal">#color/colorPrimaryDark</item>
<item name="colorControlActivated">#color/transparentWhite50</item>
</style>
And then apply both to your view:
<EditText
...
android:theme="#style/editTextTheme"
style="#style/editTextStyle"/>
I am working on Android project, what I can't change is line between Tab items. Now it's light white / gray, but I want to make it black. I've tried to change style ActionBar.Solid.A with background to black, but it didn't solve the problem. Before I ask question I've check several similar problems, but didn't find solution...
Theme Style
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="Theme.A" parent="#android:style/Theme.Holo.Light.DarkActionBar">
<item name="android:actionBarItemBackground">#drawable/selectable_background_A</item>
<item name="android:popupMenuStyle">#style/PopupMenu.A</item>
<item name="android:dropDownListViewStyle">#style/DropDownListView.A</item>
<item name="android:actionBarTabStyle">#style/ActionBarTabStyle.A</item>
<item name="android:actionDropDownStyle">#style/DropDownNav.A</item>
<item name="android:actionBarStyle">#style/ActionBar.Solid.A</item>
<item name="android:actionModeBackground">#drawable/cab_background_top_A</item>
<item name="android:actionModeSplitBackground">#drawable/cab_background_bottom_A</item>
<item name="android:actionModeCloseButtonStyle">#style/ActionButton.CloseMode.A</item>
<!--<item name="android:actionOverflowButtonStyle">#style/Widget.ActionButton.Overflow</item>-->
<!-- Light.DarkActionBar specific -->
<item name="android:actionBarWidgetTheme">#style/Theme.A.Widget</item>
</style>
<style name="ActionBar.Solid.A" parent="#android:style/Widget.Holo.Light.ActionBar.Solid.Inverse">
<item name="android:titleTextStyle">#style/Theme.A.TitleTextStyle</item>
<item name="android:background">#drawable/ab_solid_A</item>
<item name="android:backgroundStacked">#drawable/ab_stacked_solid_A</item>
<item name="android:backgroundSplit">#drawable/ab_bottom_solid_A</item>
<item name="android:progressBarStyle">#style/ProgressBar.A</item>
</style>
<style name="ActionBar.Transparent.A" parent="#android:style/Widget.Holo.ActionBar">
<item name="android:background">#drawable/ab_transparent_A</item>
<item name="android:progressBarStyle">#style/ProgressBar.A</item>
</style>
<style name="PopupMenu.A" parent="#android:style/Widget.Holo.ListPopupWindow">
<item name="android:popupBackground">#drawable/menu_dropdown_panel_A</item>
</style>
<style name="DropDownListView.A" parent="#android:style/Widget.Holo.ListView.DropDown">
<item name="android:listSelector">#drawable/selectable_background_A</item>
<item name="android:textColor">#color/main_white_color</item>
</style>
<style name="ActionBarTabStyle.A" parent="#android:style/Widget.Holo.ActionBar.TabView">
<item name="android:background">#drawable/tab_indicator_ab_A</item>
</style>
<style name="DropDownNav.A" parent="#android:style/Widget.Holo.Spinner">
<item name="android:background">#drawable/spinner_background_ab_A</item>
<item name="android:popupBackground">#drawable/menu_dropdown_panel_A</item>
<item name="android:dropDownSelector">#drawable/selectable_background_A</item>
</style>
<style name="DropDownSpinner.A" parent="#android:style/Widget.Holo.Light.Spinner">
<item name="android:popupBackground">#drawable/menu_dropdown_panel_spinner</item>
</style>
<style name="ProgressBar.A" parent="#android:style/Widget.Holo.ProgressBar.Horizontal">
<item name="android:progressDrawable">#drawable/progress_horizontal_A</item>
</style>
<style name="ActionButton.CloseMode.A" parent="#android:style/Widget.Holo.ActionButton.CloseMode">
<item name="android:background">#drawable/btn_cab_done_A</item>
</style>
<!-- this style is only referenced in a Light.DarkActionBar based theme -->
<style name="Theme.A.Widget" parent="#android:style/Theme.Holo">
<item name="android:popupMenuStyle">#style/PopupMenu.A</item>
<item name="android:dropDownListViewStyle">#style/DropDownListView.A</item>
<item name="android:textColor">#color/main_white_color</item>
</style>
<!-- ActionBar TitleTextStyle styles -->
<style name="Theme.A.TitleTextStyle" parent="#android:style/TextAppearance.Holo.Widget.ActionBar.Title">
<item name="android:textColor">#color/main_white_color</item>
</style>
<!-- ActionBar SettingIcon style -->
<style name="Widget.ActionButton.Overflow" parent="#android:style/Widget.Holo.ActionButton.Overflow">
<item name="android:src">#drawable/ic_dots</item>
</style>
</resources>
What you want to change is the ActionBarTab divider color. You can do it like this:
Inside ActionBarTabStyle.A definition, add:
<item name="android:actionBarDivider">#drawable/tab_divider</item>
The tab_divider drawable is an XML file as well:
<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
android:fromDegrees="90"
android:toDegrees="90" >
<shape android:shape="line" >
<stroke
android:dashWidth="3dp"
android:width="4dp"
android:color="#android:color/black" />
</shape>
</rotate>
Edit: An alternative solution is simply changing your Theme.A theme directly, adding:
<item name="actionBarDivider">#android:color/black</item>
Note that the android: prefix is not being used.
I am trying to change the color of an item when it pressed. I used the actionBarItemBackground item in the action bar style, but nothing happens.. The color not changed...
Here my code:
<style name="ActionBarStyle" parent="#style/Widget.AppCompat.ActionBar.Solid">
<item name="android:background">#color/actionbar_background</item>
<item name="titleTextStyle">#style/ActionBarStyle.Title</item>
<item name="actionBarItemBackground">#drawable/action_bar_item_selector</item>
<item name="android:actionBarItemBackground" tools:ignore="NewApi">#drawable/action_bar_item_selector</item>
</style>
And the selector:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/pressed_item" android:state_focused="true"/>
<item android:drawable="#drawable/pressed_item" android:state_pressed="true"/>
<item android:drawable="#android:color/transparent"/>
</selector>
And the drawable:
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle" >
<solid android:color="#FF0000"/>
</shape>
What is worng? Someone?
actionBarItemBackground isn't inherit of Widget.ActionBar. You should be placing it in your root theme, wherever you apply your ActionBarStyle, but not in your ActionBarStyle. So, something like:
<style name="Your.Theme" parent="#style/Theme.AppCompat">
<item name="actionBarStyle">#style/ActionBarStyle</item>
<item name="android:actionBarStyle">#style/ActionBarStyle</item>
<item name="actionBarItemBackground">#drawable/action_bar_item_selector</item>
<item name="android:actionBarItemBackground" tools:ignore="NewApi">#drawable/action_bar_item_selector</item>
</style>