Flash image on button click over the button - android

As I am working on keyboard, we know on default keyboard on any android device when we click any button larger image is flashed above button, I don't know exactly this effect, ut I have tried using below code.
Button which is clicked in my Keyboard.xml:
<Button android:id="#+id/xBack"
android:background="#drawable/back_high"/>
Above back_high is my xml file.
back_high.xml file is,
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/back_click"
android:state_pressed="true" />
<item android:drawable="#drawable/back"
android:state_focused="true" />
<item android:drawable="#drawable/back" />
</selector>
Its working successfully, but image is flashed at same place where I clicked, but I need this image is displayed on above button, as happening on android default keyboard.

your setting the background of that specific button, so if you want it to appear above the button make sure you use a frame layout as the overall layout of the keyboard and then have a single extra imageview that you switch location and resource when you click on a button. you won't need the selector anymore.
Frame layout's will let you put multiple views on top of each other.

This Link :
Why not make this programmatically and not in UI mode?
There are several, depending on what kind of flashing you mean.
You can, for example, use alpha animation and start it as your button first appears. And when the user clicks button, in your OnClickListener just do clearAnimation().
Example:
public void onCreate(Bundle savedInstanceState) {
final Animation animation = new AlphaAnimation(1, 0); // Change alpha from fully visible to invisible
animation.setDuration(500); // duration - half a second
animation.setInterpolator(new LinearInterpolator()); // do not alter animation rate
animation.setRepeatCount(Animation.INFINITE); // Repeat animation infinitely
animation.setRepeatMode(Animation.REVERSE); // Reverse animation at the end so the button will fade back in
final Button btn = (Button) findViewById(R.id.your_btn);
btn.startAnimation(animation);
btn.setOnClickListener(new OnClickListener() {
#Override
public void onClick(final View view) {
view.clearAnimation();
}
});
}
Also This Answer.

Related

Android's touch event doesn't work

I'm trying to do a simple imageview with a colored background that when pressed change the color and at the end of the touch if it is outside the image area then it would return to the original color or else start another activity (like a button); so i decided to implement an onTouchListener in my activity using a kotlin lambda.
This is the code:
imageview.setOnTouchListener{ view: View, event: MotionEvent ->
val rect = Rect(view.left, view.top, view.right, view.bottom)
when(event.action){
MotionEvent.ACTION_DOWN->{
view.setBackgroundColor(dark_color)
}
MotionEvent.ACTION_UP-> {
if (rect.contains(event.x.toInt(), event.y.toInt()))
startActivity(Intent(this, NewActivity::class.java)
else{
view.setBackgroundColor(normal_color)
}
}
}
true
}
And it works fine but while i was testing it i saw that the new activity was starting else if the touch is out of the image area, so i used the Log function to report the cordinates of the touch and i noticed that the cordinates (when MotionEvent.ACTION_UP was triggered) where different from the point that i was touching on the screen.
Is it possible that the system is bugged ?
(p.s. i tried also on the emulator and i had the same result and I can't use xml selectors)
Thanks for help!
The only thing you need to do is to create a selector. You set the selector as a background to your ImageView. So the selector manage the colour automatically (when the image is pressed or not). Then you set a listener on your ImageView to manage the click event. If the user moves his finger out of the ImageView area, the listener will NOT be triggered (it's automatically managed).
In your Java code
imageView.setOnClickListener(new View.OnClickListener {
public void onClick(...){
// Start the Activity
}
});
in your XML
<ImageView
android:background="#drawable/my_selector"
//...
my_selector.xml (must be in the drawable folder)
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:color="#color/default_pressed" android:state_pressed="true" />
<item android:color="#color/default_not_pressed" />
</selector>

GridView (of ImageViews) : setOnTouchListener and setOnItemClickListener implementation

Currently I have a GridView that holds some ImageViews. The GridView implements setOnItemClickListener. When the onItemClick occurs, the user gets a dialog and on back pressed or on dismiss, he returns to the current GridView.
Till now everything works fine.
I would like to know if there is a way to change the selected imageView (with another image, or even just the alpha).
I have tried inside the setOnItemClickListener to change the image, but when I try to change it back to it's normal image after the dialog.dismiss() call, a white screen pops up for some milliseconds. Although, the image is set correctly, I would like to avoid this white image.
I have tried to implement the GridView.setOnTouchListener, but I would get only a white screen (for some milliseconds) and no other operation would be executed (no pop up dialog).
I even tried to implement OnTouchListener inside the ViewHolder class and although it seemed to work with some problems (changing the alpha on ACTION_DOWN was permanent, so I had to reselect the same item to change the alpha back to normal), the setOnItemClickListener wouldn't work at all.
Can someone help me with this?
Thanks in advance!
Just for anyone having the same problem, I used TransitionDrawable. Inside my imageAdapter, I loaded the transition xml files:
<?xml version="1.0" encoding="utf-8"?>
<transition xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/soft"/>
<item android:drawable="#drawable/soft_pressed"/>
</transition>
and on gridview.setOnItemClickListener, I used this sample of code:
ViewHolder holder = (ViewHolder) v.getTag();
final ImageView imageview = holder.image;
((TransitionDrawable)imageview.getDrawable()).startTransition(2000);
And to execute the next command (some delay is needed):
final Handler handler = new Handler();
handler.postDelayed(new Runnable() {
#Override
public void run() {
YourMethod(...);
//reverse the transition
((TransitionDrawable)imageview.getDrawable()).reverseTransition(2000);
}
}, 2000);

Disabled button loses pressed state when touched

I'm generating a number of buttons programmatically (some to increase a value while others to decrease a value) that I disable when the value they adjust either reaches a maximum or minimum. (i.e. The 'increase' button is disabled when the maximum is reached while the 'decrease' button is disabled when the minimum is reached.) In addition to disabling, I'm also setting the button state to 'pressed' in order to visually indicate that the limit value has been reached and the button no longer functions.
My button onClickListener for the 'increase' buttons look like this:
increase.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
// do some stuff
// here I enable the corresponding 'decrease' button because once you increase you can then decrease
setEnabled(decrease, true);
// if the maximum value is obtained, I disable the 'increase' button because you can't go higher
if (value == maximum) {
setEnabled(increase, false);
}
}
});
The corresponding 'decrease' onClickListeners are similar.
Because these button are changing their own state, I need to use a Handler to adjust Button.setEnabled() and Button.setPressed() after a small delay, so that the user's finger doesn't get in the way (see https://stackoverflow.com/a/28788780/852795). Here is the setEnabled(final Button b, final boolean set) method that is used above:
private void setEnabled(final Button b, final boolean set) {
Handler refresh = new Handler(Looper.getMainLooper());
refresh.postDelayed(new Runnable() {
#Override
public void run() {
b.setEnabled(set);
b.setPressed(!set);
}
}, 250); // delayed post required to make pressed button accept setPressed()
}
Everything works great, with one small exception: once a user presses the 'increase' button enough times to reach the maximum the button will be disabled and the 'pressed' state will be set to true, however, if it's then pressed one more time, the 'pressed' state will be turned off. Functionally, the button is disabled. I know this because the onClickHandler is not invoked. Why then is my button losing it's 'pressed' state? How can I stop this from happening?
Update: Looking at https://stackoverflow.com/a/8693444/852795 I tried plugging into the onTouchListener() in order to 'intercept' the touch that's turning off the pressed state. However, this, too, is not invoked because, I would imagine, the button is disabled.
One way to handle this would be to use a StateListDrawable as the background of the button and set the Disabled state to use the same drawable as the Pressed state. This way you could avoid having to set the Pressed state in code.
ie
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true"
android:drawable="#drawable/btn_pressed" /> <!-- pressed -->
<item android:state_enabled="false" android:drawable="#drawable/btn_pressed"/> <!-- disabled (same as pressed) -->
<item android:state_enabled="true" android:drawable="#drawable/btn_normal"/>
</selector>

How do I programmatically check an Android radio button with ripple animation?

tl;dr: When the user clicks an unrelated text view, I want a radio button to be selected with a ripple animation. performClick doesn't do this. What should I be doing instead?
I have a radio button with both a label and a longer description.
The general structure of my layout is this:
<RadioGroup>
<RadioButton
id="#+id/officialBusinessRadio"
text="Official business" />
<TextView
id="#+id/officialBusinessCaption"
text="This operates under a ..." />
<!-- ... -->
</RadioGroup>
I've added an OnClickListener to the text view so that tapping on the caption selects the radio button:
officialBusinessCaption.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
officialBusinessRadio.performClick();
}
});
When I tap on the radio button itself or on its own text ("Official Business"), the radio button animates to selected and a ripple ink effect occurs. When I top on the caption text (and performClick is called), the radio button still animates to selected, but no ripple occurs.
Is there a more correct way to get this effect? That is, is there a better way to forward a click on the caption text view to the radio button? If not, is there a straightforward way to trigger the ripple effect on the radio button programmatically?
I would prefer against setting all the text using a string resource for the following reasons:
I intend on styling the label and the caption differently.
I want the radio vertically center aligned with the first line of text.
I've hit this problem by population RadioButtons in a RecyclerView. All of them are set to isClickable = false because I override their selection according to another rule, but the way to trigger the selection to true is doing:
Kotlin:
radioButton.post {
radioButton.isChecked = true
}
Java:
radioButton.post(new Runnable() {
#Override
public void run() {
radioButton.setChecked(true);
}
})
before, I was doing setChecked(true) only and it wouldn't work.

Android-Move content downwards

I'm very new regarding developing apps for android. Now what I want to do is to implement four buttons and as soon as a user clicks, let's say, on the topmost button, another two sub-buttons should appear underneath the clicked button and the other three remaining buttons should automatically move downwards.
I think my explanation is not hundred per cent clear, so I try to illustrate the problem with some images.
Now here are the four buttons:
http://advancedata.ad.funpic.de/First-AGApp.png
And as soon as the user pushes button one, two extra buttons should appear and the other three buttons should move downwards:
http://advancedata.ad.funpic.de/Second-AgApp.png
I would be very thankful for any advice how to implement this.
Thanks,
enne
Draw all your buttons in a LinearLayout with vertical orientation. Add the attribute
android:visibility="gone"
to the buttons that should appear when clicking the main buttons. Then you can show those buttons in the OnClickListener of the main buttons with the line:
button.setVisibility(View.VISIBLE);
where button is the reference to your layout in the code.
Button button = (Button) findViewById (R.id.your_button_id);
EDIT:
To add an animation to the process, you have to slide up/down the new buttons appearing and the buttons below. (Group the views into Layouts so it's easier to apply the animations).
Here you have the two XML files to create in your res/anim folder:
slide_down.xml
<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
android:fromYDelta="-50" android:toYDelta="0"
android:duration="300" />
slide_up.xml
<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
android:fromYDelta="0" android:toYDelta="-50"
android:duration="300" />
Create the animations in your code with:
Animation slideDown = AnimationUtils.loadAnimation(this, R.anim.slide_down);
and apply it to the buttons with:
secondaryButton.startAnimation(slideDown);
When sliding up, you need to set the visibility to "gone" after the animation is finished, not before. In order to do that, you need to set the animation listener and hide the button in onAnimationEnd:
slideUp.setAnimationListener(new AnimationListener () {
#Override
public void onAnimationEnd(Animation animation) {
secondaryButton.setVisibility(View.GONE);
}
#Override
public void onAnimationRepeat(Animation animation) {}
#Override
public void onAnimationStart(Animation animation) {}
});

Categories

Resources