I try to apply my own design to edittext and to use android native selector when my edittext is enabled, focused, etc. The problem is that every time I touch the edittext and the native selector is working my edittext becomes smaller. Can anyone please suggest why this is happening?Here is my code snippet:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:state_window_focused="false" android:state_enabled="true"
android:drawable="#android:drawable/edit_text"/>
<item
android:state_window_focused="false" android:state_enabled="false"
android:drawable="#android:drawable/edit_text"/>
<item
android:state_pressed="true"
android:drawable="#android:drawable/edit_text"/>
<item
android:state_enabled="true" android:state_focused="true"
android:drawable="#android:drawable/edit_text"/>
<item
android:state_enabled="true"
android:drawable="#android:drawable/edit_text"/>
<item
android:state_focused="true"
android:drawable="#android:drawable/edit_text"/>
<item
android:drawable="#drawable/my_border" />
</selector>
And here I use my selector:
<EditText
android:layout_height="37dip"
android:layout_width="fill_parent"
android:layout_marginLeft="7dip"
android:layout_marginRight="7dip"
android:background="#layout/selector_input"
android:paddingLeft="5dip"
android:paddingRight="5dip"
android:inputType="textEmailAddress">
</EditText>
This is the code of my_border:
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="#color/white"/>
<stroke android:width="1dip" android:color="#color/border_green"/>
<corners android:radius="4dp" />
<padding android:left="1dip" android:top="1dip" android:right="1dip" android:bottom="1dip" />
</shape>
P.S. absolutely the same thing is happening with the buttons.
at first, thanks a lot for your post, helped me alot,
but your code above (sample for selector) wasnt working for me:
so i adapted it for others, so if someone searches howto mark a textfield as selected:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:state_window_focused="false" android:state_enabled="true"
android:drawable="#drawable/bottom_line_normal"/>
<item
android:state_window_focused="false" android:state_enabled="false"
android:drawable="#drawable/bottom_line_normal"/>
<item
android:state_pressed="true"
android:drawable="#drawable/bottom_line_focus"/>
<item
android:state_enabled="true" android:state_focused="true"
android:drawable="#drawable/bottom_line_focus"/>
<item
android:state_enabled="true"
android:drawable="#drawable/bottom_line_normal"/>
<item
android:state_focused="true"
android:drawable="#drawable/bottom_line_focus"/>
<item
android:drawable="#drawable/bottom_line_normal"/>
</selector>
have fun :=) good luck :)
Since no one was able to completely answer my question I will answer it by myself. The problem was that my edittext became smaller every time I touched it. That happens because native edittext background in Android has a transparent area around it. So I used a layer list to create my background also with a transparent area around it. Here is the code:
<?xml version="1.0" encoding="utf-8"?>
<layer-list
xmlns:android="http://schemas.android.com/apk/res/android" >
<item
android:drawable="#drawable/transparent_background"
android:top="5dip"
android:right="5dip"
android:bottom="5dip"
android:left="5dip" />
<item
android:drawable="#drawable/my_border"
android:top="0dip"
android:right="0dip"
android:bottom="0dip"
android:left="0dip" />
</layer-list>
In my selector instead of my_border I use this xml.
That's it. Easy to do and hell difficult to find out how!
<item
android:drawable="#drawablemy_border" />
1. are you missing a slash [/]? And what is the definition of that drawable my_border
Ok, after I tried this files, the EditText doesn't use your selector when it's not enabled and appear with it's standard layout... so adding
<item
android:state_enabled="false"
android:drawable="#android:drawable/edit_text"/>
to your selector should be the solution
Related
I have a recycler view which I need to use one of the color selectors, depending on what value in the data binding, to change the TextView color.
I have two selectors:
color/selector_item_text.xml
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:color="#color/white" android:state_checked="true" />
<item android:color="#color/white" android:state_pressed="true" />
<item android:color="#color/white" android:state_activated="true" />
<item android:color="#color/black" />
</selector>
color/selector_item_textwithspecial.xml
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:color="#color/pink" android:state_checked="true" />
<item android:color="#color/pink" android:state_pressed="true" />
<item android:color="#color/pink" android:state_activated="true" />
<item android:color="#color/orange" />
</selector>
And I'm binding it to my TextView like this:
<TextView android:text="#{data.displayPrice}"
android:textColor="#{data.isSpecial ? #color/selector_item_textwithspecial : #color/selector_item_text}"
style="#style/ProductPrice"/>
The problem is that the TextView color is always orange (if it has special) or black. The selection never changes the color. However, if I remove the databinding, it worked as expected.
For example, the following will make TextView becomes pink (when selected) and orange (when not selected)
<TextView android:text="#{data.displayPrice}"
android:textColor="#color/selector_item_textwithspecial"
style="#style/ProductPrice"/>
Any idea how to tackle this problem?
Thanks...
Figured it out, see here
use android:textColor="#{data.isSpecial ? #colorStateList/selector_item_textwithspecial : #colorStateList/selector_item_text}"
I think you need to use ContextCompat to get the colors.
<TextView android:text="#{data.displayPrice}"
android:textColor="#{data.isSpecial ? #{ContextCompat.getColor(context, #color/selector_item_textwithspecial)} : ContextCompat.getColor(context, #color/selector_item_text)}"
style="#style/ProductPrice"/>
while context you need to declare in your root element in your xml file
tools:context="...."//path to your activity
I tried to track down, how Lollipop displays a button, which is disabled with android:enabled="false" in the layout file.
Holo
With Holo, it's easy: In the styles_holo.xml, I find the style Widget.Holo.Button, which gives me a reference to #drawable/btn_default_holo_dark. There I find the selector:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_window_focused="false" android:state_enabled="true"
android:drawable="#drawable/btn_default_normal_holo_dark" />
<item android:state_window_focused="false" android:state_enabled="false"
android:drawable="#drawable/btn_default_disabled_holo_dark" />
<item android:state_pressed="true"
android:drawable="#drawable/btn_default_pressed_holo_dark" />
<item android:state_focused="true" android:state_enabled="true"
android:drawable="#drawable/btn_default_focused_holo_dark" />
<item android:state_enabled="true"
android:drawable="#drawable/btn_default_normal_holo_dark" />
<item android:state_focused="true"
android:drawable="#drawable/btn_default_disabled_focused_holo_dark" />
<item
android:drawable="#drawable/btn_default_disabled_holo_dark" />
</selector>
Lollipop
When I try to apply the same logic to Lollipop, I got stuck:
In styles_material.xml I find the style <style name="Widget.Material.Button"> where I find the reference to <item name="background">#drawable/btn_default_material</item>. But there is no selector??!! Instead I find:
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
android:color="?attr/colorControlHighlight">
<item android:drawable="#drawable/btn_default_mtrl_shape" />
</ripple>
Could someone please explain, which specific style Lollipop uses for a disabled button.
Thanks a lot!
Edit
I can partially answer myself: In #drawable/btn_default_mtrl_shape I find a reference to <solid android:color="?attr/colorButtonNormal" />, which in turn points to #color/btn_default_material_light, which includes a selector:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_enabled="false"
android:alpha="#dimen/disabled_alpha_material_light"
android:color="#color/button_material_light"/>
<item android:color="#color/button_material_light"/>
</selector>
But that alpha value only explains half of it. Somehow Lollipop also set the elevation down to 0?
This is how I resolved this, thanks to your partially answer.
First: add new Folder "color" under "res" folder, if it doesn`t exist.
Add new .xml file in "color" folder (I will call this file ButtonColorSelector.xml) where we will create new ColorStateList like this:
<?xml version="1.0" encoding="UTF-8" ?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_enabled="false" android:color="#F2F2F2"/> <!-- disabled -->
<item android:state_pressed="true" android:color="#FF0000"/> <!-- pressed -->
<item android:state_focused="true" android:color="#FF0000"/> <!-- focused -->
<item android:color="#0000FF"/> <!-- default -->
</selector>
Second: Add that ripple effect .xml file you mentioned, under "drawable" folder and reference your colorSelector instead of btn_default_mtrl_shape. I will call this file RaisedButton.xml.
<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
android:color="?attr/colorControlHighlight">
<item>
<shape>
<solid android:color="#color/buttoncolorselector"/>
<corners android:radius="5dp" />
</shape>
</item>
</ripple>
Third: Now you can use your drawable for button background in your layouts, like this:
<Button
android:background="#drawable/raisedbutton"
android:text="#string/SomeButton"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:onClick="DoStuffitto"
android:enabled="false"
android:id="#+id/someButton" />
I have some buttons with transparent background in my app. Now, I want to customize them to maintain that transparent background, but when they are pressed, the backgroud should become green.
I know that are lots of topics about custom buttons here on SO, I have readed several of them, also lots of tutorials from google. And although it may seem an easy task, I'm not getting it to work.
This is an example code of my buttons:
<Button
android:id="#+id/accept_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:background="#drawable/button_state"
android:text="#string/btnaccept"
android:textStyle="bold" />
And this is the selector xml file buton_state.xml where I've defined the background color change for diferent button states:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<!-- Button focused and pressed-->
<item android:state_pressed="true"
android:state_focused="true" >
<shape>
<solid
android:color="#color/LightGreen" />
</shape>
</item>
<!-- Button Default-->
<item android:state_pressed="false"
android:state_focused="false" >
<shape>
<solid
android:color="#android:color/transparent" />
</shape>
</item>
</selector>
This file is in res/drawable folder.
In my app, the button gets correctly a default transparent background, but this background color doesn't change to green when focused nor pressed.
try this may be help you,
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true" android:drawable="#color/LightGreen" /> <!--pressed -->
<item android:drawable="#android:color/transparent" /> <!-- Normal -->
</selector>
Use Selector
<?xml version="1.0" encoding="utf-8"?>
<item android:drawable="#drawable/numpad_button_bg_selected" android:state_selected="true"></item>
<item android:drawable="#drawable/numpad_button_bg_pressed" android:state_pressed="true"></item>
<item android:drawable="#drawable/numpad_button_bg_normal"></item>
and then
<Button
android:id="#+id/button1"
android:background="#drawable/Selector File Name"
android:layout_width="200dp"
android:layout_height="126dp"
android:text="Hello" />
For example, say I have a color state list declared in XML, called example1.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
<item
android:color="#color/red"
android:state_pressed="true" />
<item
android:color="#color/blue"
android:state_checked="true" />
<item
android:color="#color/green"
android:state_disabled="true" />
<item
android:color="#color/orange" />
</selector>
Then, I want to create example2.xml and I want it to be the exact same as example1.xml except I want the pressed color to be purple instead of red:
<item
android:color="#color/purple"
android:state_pressed="true" />
So example2.xml would end up acting like this:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
<item
android:color="#color/purple" <-- note this value is different
android:state_pressed="true" />
<item
android:color="#color/blue"
android:state_checked="true" />
<item
android:color="#color/green"
android:state_disabled="true" />
<item
android:color="#color/orange" />
</selector>
but without all of the duplicate code. Also, if I want to change a color I can just change it in one place.
Is this possible?
I don't think you can do this on Android, You have to create multiple xml resources for different selector.
Long time stackoverflow reader, first time with a question. The problem I am having seems silly, but I can't find any information that explains it.
I am new to Android programming and am working on a project with custom button backgrounds. I am using state list drawables for the different buttons that look like this:
<?xml version="1.0" encoding="UTF-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<bitmap android:src="#drawable/button_pressed_background" android:gravity="center"/>
android:state_pressed="true"
</item>
<item>
<bitmap android:src="#drawable/button_focused_background" android:gravity="center"/>
android:state_focused="true"
</item>
<item>
<bitmap android:src="#drawable/button_standard_background" android:gravity="center"/>
android:state_pressed="false"
android:state_focused="false"
</item>
</selector>
In the xml where the buttons are declared, I simply add the line android:background="#drawable/button_drawable" where button_drawable.xml is the state list drawable.
Seems simple enough, but in all cases, the buttons display with the background listed in the first <item> section of the state list drawable, no matter their state. In fact, in the example above, I could change the first <item> section to include android:state_pressed="false" instead, and the button_pressed_background still displays! It is as if all button states are true and false simultaneously.
I am developing using emulators, but see this behavior both with the AVD emulator and with Android x86 running on Oracle VirtualBox. Any idea why this would occur?
Define a selector with the below code and try it as background:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_focused="true" android:state_pressed="true" android:drawable="#drawable/background_sel"/>
<item android:state_focused="false" android:state_pressed="true" android:drawable="#drawable/background_sel"/>
<item android:state_focused="true" android:drawable="#drawable/background_sel"/>
<item android:state_focused="false" android:state_pressed="false" android:drawable="#drawable/background_normal"/>
</selector>
Itz not android:src, its android:drawable
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_window_focused="false" android:state_enabled="true"
android:drawable="#drawable/btn_new_default" />
<item android:state_pressed="true"
android:drawable="#drawable/btn_new_default_pressed" />
<item android:state_focused="true" android:state_enabled="true"
android:drawable="#drawable/btn_new_default" />
<item android:state_enabled="true"
android:drawable="#drawable/btn_new_default" />
For more action get the original file from
drive letter:\android-sdk-windows_new\platforms\android-8\data\res\drawable\btn_default.xml