How to give Flashing Effect between Two images in Android? - android

I have two images(Light Red and Dark Red) for the button and i want to give Flashing Effect to that button that initially it glows from light-red to Dark-red and then when it pressed, its state will be changed to dark red. i try to sort out the Solution for this but every-where i see Fade-in and Fade-out solution using one image, but i want to use both images.
Please let me know if any function exists there for giving Flashing Effect between two images or i will have to make it manually.

For this I think you have to use customized xml drawable for your button,
And for different state of button you can use different images, to apply style
Try this,
example:
XML file saved at res/drawable/button.xml:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true"
android:drawable="#drawable/button_pressed" /> <!-- pressed -->
<item android:state_focused="true"
android:drawable="#drawable/button_focused" /> <!-- focused -->
<item android:state_hovered="true"
android:drawable="#drawable/button_focused" /> <!-- hovered -->
<item android:drawable="#drawable/button_normal" /> <!-- default -->
</selector>
This layout XML applies the state list drawable to a Button:
<Button android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:background="#drawable/button" />
For more info look at Android - Drawable Style.
And nice example Adding Gradient Effects to Android Button.
SO post how to set image button backgroundimage for different state?.

You will need to work with associating Animations to Buttons.
Here are some links to tutorials :
link
video tutorial

Related

Convenient way to show touch highlight when clicking Button in Android

In iOS, one code line is enough to have button show touch highlight: yourButton.showsTouchWhenHighlighted = YES;
In Android, selector could be used. However, it's quite tedious. For example, if there're 100 button icons in my app, I have to prepare at least 200 button icons: 100 for normal and 100 for highlighted.
Is there any convenient/simpler way to do this?
You may try Ripple Effect to show touch effect
Create a single selector, and use that as a background for all your views (this doesn't need to be created for each button individually, you can apply the same one universally).
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true"
android:color="#000000" /> <!-- pressed -->
<item android:state_focused="true"
android:color="#000000" /> <!-- focused -->
<item android:color="#FFFFFF" /> <!-- default -->
</selector>
This can be applied universally to ALL your buttons like this:
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#color/button_selector" />
There is a new Ripple response, but this is available for Android 5.0 devices plus (there probably is a 3rd party library on GitHub allowing this to work on earlier OSes)

Android + Change image state on button widget

Ok I am having a LOT of trouble finding an answer for this question. So either I'm asking it wrong or going about it the completely wrong way. Either way I could use some help. So what I'm trying to do is implement dynamic image cycling on a button widget based on state.
What I mean by this is
On Mouse Down {
Change to this image
}
On Click {
Button functionality
}
On Mouse Up {
Change back to original
}
I've seen a LOT of tutorials that place this under the click event but this isn't really what I want. I don't just simply want to change the color of the button when the button is pressed I want it to flash with the alternate image quickly and then Change back to the Original image placed on the button. How would I go about doing this?
Take a look at this link: https://developer.android.com/guide/topics/resources/drawable-resource.html#StateList
From the Link:
EXAMPLE:
XML file saved at res/drawable/button.xml:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true"
android:drawable="#drawable/button_pressed" /> <!-- pressed -->
<item android:state_focused="true"
android:drawable="#drawable/button_focused" /> <!-- focused -->
<item android:state_hovered="true"
android:drawable="#drawable/button_focused" /> <!-- hovered -->
<item android:drawable="#drawable/button_normal" /> <!-- default -->
</selector>
This layout XML applies the state list drawable to a Button:
<Button
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:background="#drawable/button" />

How to layout irregular shapes in Android layout

So my graphics artist came to me with a really cool layout for controls on our new app. The problem is getting these images laid out since most views in android are rectangular. See image for what I have to work with.
Any idea how to layout these buttons so they shape around each other if that makes sense?
If the problem is the layout, you can draw the buttons and save it as png. You can layout your app by RelevantLayout . And use the "selector" to change the button image when user press an so on.
selector example: "drawable/selector1.xml"
<?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="true" android:drawable="#drawable/buttonClicked" /> <!-- focused and pressed-->
<item android:state_pressed="true" android:drawable="#drawable/buttonClicked" /> <!-- pressed -->
<item android:drawable="#drawable/button" /> <!-- default -->
</selector>
use it like this:
android:background="#drawable/selector1"
the Views in android are rectangular, that is correct. The only workaround I see here: use multiple "invisible" Buttons (alpha set to 0). You can position them around the screen and assign the same action to some of them. Of course you'll need to implement the OnClickListener and use switch-case.

How to get glow on the buttons like ipod/ipad in Android

On Android application How can I get the glow effect on button when touched; I am looking for exact similar effect like ipod/iphone buttons
Use a StateListDrawable. Type this into a file and store it as res/drawable/button_bg.xml. Then create 4 images button_press.png, button_focus.png, button_disabled.png and button.png and last set your background to button_bg. If you want your button glow when touch you can add an image of your glowing button to state press. So when you press the system will get glowing_button.png and display it.
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/button_press" android:state_pressed="true" />
<item android:drawable="#drawable/button_focus" android:state_focused="true" />
<item android:drawable="#drawable/button_disabled" android:state_enabled="false" />
<item android:drawable="#drawable/button" />
</selector>
The "magic" behind this is that android will go from the top to bottom and use the first one matching your buttons state.
In these links you can find some snippets to get exactly the same TabBar as iOS applications
iPhone Tab in Android
TabHost For Android
iTabs

how to change button color when it is clicked in android

By default when button is clicked something like orange color will surround the button for short time, that indicates buttons is clicked. But this feature is not working when button contains background image. This is happening in list view too.why ? Any Ideas? TIA
I used setBackgroundColor(Color.BLUE); But here the color is applied and not gone...
You need to use a selector as your background resource :
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true" android:drawable="#drawable/button_pressed" />
<item android:state_focused="true" android:drawable="#drawable/button_focus" />
<item android:drawable="#drawable/button_normal" />
</selector>
This selector makes use of 3 separate drawables to change the image of the button , you may use the same image for pressed and focuses.
You need to put this XML into your drawables directory and use it as a background for your button.
For another solution refer : Standard Android Button with a different color
i too had the same problem. so instead of setting the background color,i included three images of button in three different colors , so based on state focused,pressed,default the respective image will replace the other. and it looks like change in the color of the button.
**<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/c2"
android:state_pressed="true" />
<item android:drawable="#drawable/c1"
android:state_focused="true" />
<item android:drawable="#drawable/c1" />
</selector>**
above is the content of the xml file,which must be assigned to the background of the respective button
android:background="#drawable/drawable_button
hope this might be helpful for you

Categories

Resources