Creating State List Drawable XML for Background - Android - java

I am trying to get the following state list to work. The idea is to create a white background.
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_window_focused="false" android:state_selected="true"
android:drawable="#android:color/transparent" />
<item android:state_selected="true" android:drawable="#android:color/transparent" />
<item android:state_pressed="true" android:state_selected="false"
android:drawable="#android:color/transparent" />
<item android:state_selected="false" android:drawable="#color/WHITE" />
</selector>
When I try and compile this I get the following error..
#color/transparent and #color.WHITE don't exist.
Do I need to define these somewhere and if so how ?
Thanks !

I think the only problem is you are referencing directly a color instead of an actual Drawable. Try creating a ColorDrawable first and use it in your StateListDrawable.
When creating a ColorStateList (which is different from StateListDrawable because it's a list of colors and not Drawables) you can directly use colors ...

You must use #android:color, otherwise it doesn't know where the color is defined.
android:background="#android:color/white"

In Android's Color Palette there is no defined transparent
Android Color Palette, however you could define opacity and that will generate the sense of transparency, here is a good sample about how to use it: Hex transparency in colors
Here's a code snipet about how to declare a custom color in res/value/colors.xml
<color name="colorWhite">#FFFFFF</color>
now with transparency:
<color name="colorWhite">#FFFFFFFF</color>
being used in the state list:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#color/colorWhite" android:state_hovered="true"/>
</selector>

try to create a resource file like this:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<color name="white">#ffffff</color>
</resources>
let's see if someone knows about transparent one

<color name="white">#aarrggbb</color> will set the transparency
<color name="white">#80ffffff</color> will set white color with transparency value 80.

Related

Ability to set a colour within code using a Style item, therefore not needing to concern myself with the current application theme

I've got a light and dark theme in my application, where I've a set of color attributes per theme in Styles.xml, for example:
<style name="LightTheme" parent="Theme.AppCompat.Light.NoActionBar">
<!-- colours -->
<item name="colour_text">#color/ltext</item>
<item name="colour_text_subtle">#color/ltext_subtle</item>
<item name="colour_text_more_subtle">#color/ltext_more_subtle</item>
</style>
<!-- Dark -->
<style name="DarkTheme" parent="Theme.AppCompat.NoActionBar">
<!-- colours -->
<item name="colour_text">#color/dtext</item>
<item name="colour_text_subtle">#color/dtext_subtle</item>
<item name="colour_text_more_subtle">#color/dtext_more_subtle</item>
</style>
These colours are defined in Colours.xml, such as:
<color name="ltext">#000</color>
<color name="ltext_subtle">#8000</color>
<color name="ltext_more_subtle">#4000</color>
<color name="dtext">#FFF</color>
<color name="dtext_subtle">#FAFAFA</color>
<color name="dtext_more_subtle">#FEFEFE</color>
Is there a way from within code to assign a colour to a widget attribute via a Styles.xml's attribute's name? For example, I want to give a TextView the subtle text colour by telling it to be coloured "colour_text_subtle", rather than needing to check what the current theme is and then telling it to be coloured "ltext_subtle". At the moment, how I've structured things enables me to assign colours within xml without needing to concern myself about the currently selected theme, and I'm hoping to achieve similar when working with colours in code.
I'm working in Xamarin.Android, but happy to be provided general Java Android guidance on the matter leaving for me to figure out how to accomplish similar in C#.

How to make a view transparent in android?

I'm doing some UI designing for class on an open source project. I'm trying to make the appbar and tabs of this tablayout transparent but no matter what I do they remain white. If it were transparent the background would be able to be seen but i get this white instead.
I have tried-
changing the xml values in the mainfragments xml to transparent
changing the colors.xml values to transparent (all of them because i wanted
to be sure)
changing and even removing the "light theme" and "dark theme" values in
styles.xml and removing the app theme line in the android manifest
android:theme="#style/AppTheme.FullScreen.Light"
Am I missing something else that i can try? I would be very thankful for any suggestions.
in style.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="Theme.Transparent" parent="android:Theme">
<item name="android:windowIsTranslucent">true</item>
<item name="android:windowBackground">#android:color/transparent</item>
<item name="android:windowContentOverlay">#null</item>
<item name="android:windowNoTitle">true</item>
<item name="android:windowIsFloating">true</item>
<item name="android:backgroundDimEnabled">false</item>
</style>
</resources>
in color.xml
value #color/transparent is the color value #00000000
<activity android:name=".YourActivity" android:theme="#style/Theme.Transparent">
</activity>
set alpha value in layout XML or dynamically in view to make view transparent.
view.setAlpha(40);
oR add from xml - value between 0 to 1
android:alpha="0.4"
In android Studio res->values->colors.xml
Step 1 : For selecting color
Step 2 : Changing transparency(you can move left to right for adjusting transparency )
Step 3 : Give this color as views background
<RelativeLayout
android:id="#+id/top_bar"
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="#color/color_name">
This may help you.

How to change button background colour without changing onclick/onpress colors

I'm wondering if this is even possible but hopefully someone will be able to confirm.
I've created a simple custom button layout in XML to handle the focused/pressed and dormant states. See code at bottom. This works fine when I use it to create a new button. However, I would like the user to be able to change the button colour via a colour picker if they don't like the default. However, the only way I know to change the button background colour programmatically is to use
mybutton.setBackgroundColor(someothercolor);
but if I do this it overwrites all the XML layout code and I lose the colour change when the button is pressed. I guess this is by design as I'm essentially overwriting the entire background style but what I really want to do is to allow the user to change the button colour when its not pressed to something custom but keep the style and layout of the other states the button could be in (i.e. what happens when its pressed).
Any ideas anyone?
Thank you in advance.
Nat
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_focused="true" android:state_pressed="false" android:drawable="#color/originalbuttoncolor" />
<item android:state_focused="true" android:state_pressed="true" android:drawable="#color/someotherbuttoncolor" />
<item android:state_focused="false" android:state_pressed="true" android:drawable="#color/someotherbuttoncolor" />
<item android:drawable="#color/originalbuttoncolor" />
</selector>
Maybe you can consider creating a ColorStateList programmatically, as described here: How do I create ColorStateList programmatically?
You can try this:
1. remove the default color <item android:drawable="#color/originalbuttoncolor" />
2.Then:
`StateListDrawable ret = (StateListDrawable) res.getDrawable(R.drawable.btn_selector);
ret.addState(new int[] {}, new ColorDrawable(your_desire_color));
mybutton.setBackgroundDrawable(ret);`
You can make multiple files of your selector-list, each one contain different color as the default color, and link those files to the color picker, so you save your logic of selector.
For example:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_focused="true" android:state_pressed="false" android:drawable="#color/originalbuttoncolor" />
<item android:state_focused="true" android:state_pressed="true" android:drawable="#color/someotherbuttoncolor" />
<item android:state_focused="false" android:state_pressed="true" android:drawable="#color/someotherbuttoncolor" />
<item android:drawable="#color/originalbuttoncolor" />
</selector>
And:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_focused="true" android:state_pressed="false" android:drawable="#color/yellowbuttoncolor" />
<item android:state_focused="true" android:state_pressed="true" android:drawable="#color/someotherbuttoncolor" />
<item android:state_focused="false" android:state_pressed="true" android:drawable="#color/someotherbuttoncolor" />
<item android:drawable="#color/originalbuttoncolor" />
</selector>
Edit: if you want to take color from user, this may work, if the selector state will overrided by this code:
ColorDrawable cd = new ColorDrawable(); // initialize it from the color picker;
StateListDrawable states = (StateListDrawable) mybutton.getBackground();
states.addState(new int[] {-android.R.attr.state_pressed, android.R.attr.state_focused}, cd); // the minus means false value
mybutton.setBackground(states);

Default Button's methods

I'd like to gain after onclick button efect similar to default in android, but with own colors
Default button is white or light gray
When i touch button color is changed for one moment (orange)
when release, button's color back to original color (white/light gray)
Which method's are using to this effect ?
I used onTouchListener() to set touched button color
and OnClickListener() to set back original color
But when i scroll group button(inner ScrollView) when i touch any button, color changed but when release button color ofc not change back. Which method should i use ? How can i fix that ?
///////////////////
I created colors in values and define 2 colors
<?xml version="1.0" encoding="utf-8"?>
<resources>
<color name="white">#ffffff</color>
<color name="blue">#004080</color>
</resources>
I create new folder color and button_state.xml inner this folder
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_focused="true"
android:state_pressed="false"
android:drawable="#color/blue" />
<item android:state_focused="true"
android:state_pressed="true"
android:drawable="#color/white" />
</selector>
to my button i assign code in xml file
android:background="#color/button_states"
Now my button have no background, but i don't know why
create xml file defining button states and button color depending on state, for example button_states.xml in res/color folder in your project:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true"
android:drawable="#color/pressed_button_color"/>
<item android:state_selected="true"
android:drawable="#color/selected_button_color"/>
<item android:drawable="#color/default_button_color"/>
</selector>
define these colors in values/colors.xml
and use this in your layout xml file on the Button element as:
android:background="#color/button_states"
In the xml for your button set its background to the following
android:background="?android:attr/selectableItemBackground"
This will automatically handle the colour changes to be default changes in android
If you want to have you own colours you need to do a custom selector and set it as your background. Something like the following should work:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true" android:drawable="#drawable/list_selector_pressed" />
<item android:state_focused="true" android:drawable="#drawable/list_selector_focused" />
<item android:drawable="#color/selector_background" />
</selector>
Your drawable would be like this:
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
<solid android:color="#color/selector_background_pressed"/>
</shape>
Not 100% sure but you might just be able to use #color/my_colour directly in the selector rather than referencing a drawable. But this way will definitely work
I recommend you use of this online tool. You just need to choose your desired color set and after download the resources put the in your project resource folder respectively and than apply theme to your you application in Manifest file with name name you set on this online tool("Theme Name" by default AppTheme)
<application android:debuggable="true" android:label="#string/app_name"android:theme="#style/AppTheme">

Android, How to change the actionbars logo button on state change?

So I'm wondering how one could implement to an action bar with a logo button, a different image per state.(pressed, released etc).
I know how to do this for a normal button, but I'm not sure if it's possible with the actionbars logo button?
And if it's not, how could one implement am action bar that supports this? externals libs?
Thank you.
Create a drawable xml file in res/drawable such as res/drawable/button_selector.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/button_pressed"
android:state_pressed="true" />
<item android:drawable="#drawable/button_normal" />
</selector>
where button_pressed and button_normalare just regular png files in one of your drawable directories (e.g/ drawables-hdpi)
Then in your menu.xml or in your code you can refer to #drawable/button_selector or R.drawable.button_selector and the image will change automatically when the button is pressed.
If you need to change the ActionBar button background you need to override the theme in your res/values/style.xml.
<style name="YourTheme.Sherlock" parent="#style/Theme.Sherlock">
<item name="actionBarItemBackground">#drawable/actionbar_item_background_selector</item>
<item name="android:actionBarItemBackground">#drawable/actionbar_item_background_selector</item>
</style>
Both lines matter: one for the SherlockActionBar and one for the standard ActionBar
Then set the theme to your activity in the manifest:
<activity
android:name=".yourActivity"
android:theme="#style/YourTheme.Sherlock" >
</activity>
And here is actionbar_item_background_selector.xml to be placed in res/drawable
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<!-- Even though these two point to the same resource, have two states so the drawable will invalidate itself when coming out of pressed state. -->
<item android:state_focused="true" android:state_enabled="false" android:state_pressed="true" android:drawable="#drawable/scene_overlay_bar_pressed_center" />
<item android:state_focused="true" android:state_enabled="false" android:drawable="#drawable/abs__list_selector_disabled_holo_light" />
<item android:state_focused="true" android:state_pressed="true" android:drawable="#drawable/scene_overlay_bar_pressed_center" />
<item android:state_focused="false" android:state_pressed="true" android:drawable="#drawable/scene_overlay_bar_pressed_center" />
<item android:state_focused="true" android:drawable="#drawable/abs__list_focused_holo" />
<item android:drawable="#android:color/transparent" />
</selector>
replace the background with the drawable of your choice where android:state_pressed="true"
It's a lot to do for just a background but that is how the ActionBar works.
you can use a selector to pick different image.
Android ImageButton with disabled UI feel
may be help
I think you are looking for this:
final ActionBar bar = getActionBar();
bar.setDisplayHomeAsUpEnabled(true);
This automatically makes the logo you have set look like its being pressed when its clicked. No need to have different images to show state change. Thats a pretty easy way. Though if you are using ActionBarSherlock this won't work, I think. Strictly 4.0 I believe. Check out the doc on ActionBar.

Categories