I have an image button and associated click handler.
When I animate button (using translate animation) the button, obviously, changes it's position on screen.
But there is a problem: Android detects clicks when I touch initial button location and not the current.
How can I make Android respect actual location of the button?
fragment_main.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageButton
android:id="#+id/addButton"
android:src="#android:drawable/ic_input_add"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:onClick="plusButtonClick"/>
</RelativeLayout>
MainActivity.java
public class MainActivity extends ActionBarActivity
{
public void plusButtonClick(View v)
{
Toast.makeText(this, "Clicked!", Toast.LENGTH_SHORT).show();
animateButton(R.id.addButton, R.anim.anim_move);
}
private void animateButton(int buttonId, int animationId)
{
View button = findViewById(buttonId);
AnimationSet animationSet = (AnimationSet)AnimationUtils.loadAnimation(this, animationId);
animationSet.setAnimationListener(getStartingButtonsListener(button));
button.setVisibility(View.VISIBLE);
button.startAnimation(animationSet);
}
private Animation.AnimationListener getStartingButtonsListener(final View v)
{
return new Animation.AnimationListener()
{
#Override
public void onAnimationEnd(Animation arg0)
{
v.setVisibility(View.GONE);
}
};
}
}
anim_move.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:shareInterpolator="true"
android:fillAfter="true"
android:duration="1000">
<translate
android:fromXDelta="0"
android:toXDelta="180"
android:fromYDelta="0"
android:toYDelta="0"/>
</set>
I had a similar problem here : Button moves to different part of screen but can only press it at its initial spot?
The animation is animating the pixels, not the touch zones of a widget.
You need to animate the properties as well : https://developer.android.com/guide/topics/graphics/prop-animation.html
The translate animation doesn't actually move your object, it just moves the image of it. You should reposition your button yourself at the end of the animation by editing its LayoutParams
Use onTouchEvent for your button. Moreover, give this onTouch implementation through java file, but not with the XML layout file. This is far better than using onClick event.
See this : Triggering event when Button is pressed down in Android
Related
Anyone know how i can move an imageview to another imageview ?
im thinking at this kind of method, or maybe is another one that i dont know... no problem, im glad to learn it
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:fillAfter="true"
android:interpolator="#android:anim/linear_interpolator">
<translate
android:duration="800"
android:fromXDelta="0%p"
android:toXDelta="75%p" />
i know that fromXDelta (is the starting position) and the toXDelta is the possition where should arrive.. but? how i can know what is my starting position and arrive position looking at my picture example?
Added details:
There are 4 different layouts in here, but only 3 are with weight value.
The bar from top where are buttons is a layout but not have weight like the rest.
So laying cards from up are in the layout1
My desired position to arrive are in the layout2
Playing cards from down are in the layout3
Also i use onClick methods in xml not onClickListeners. Thanks
You can do this programmatically like this :
#Override protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
final View target = findViewById(R.id.target);
final View viewToMove = findViewById(R.id.viewToMove);
viewToMove.setOnClickListener(new View.OnClickListener() {
#Override public void onClick(View v) {
translate(viewToMove, target);
}
});
}
private void translate(View viewToMove, View target) {
viewToMove.animate()
.x(target.getX())
.y(target.getY())
.setDuration(1000)
.start();
}
Here the XML :
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
android:id="#+id/activity_main"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/target"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_gravity="center"
android:background="#color/colorAccent"/>
<ImageView
android:id="#+id/viewToMove"
android:layout_width="50dp"
android:layout_height="50dp"
android:background="#color/colorPrimary"
android:src="#mipmap/ic_launcher"/>
</FrameLayout>
Finnaly i have succeded with the help of user Francois L.
Was a lot of work to do, i don't say no, because i needed to redesign all my layouts, but this is no problem cause i learned something new and i appreciate all the help i can receive.
If anyone want to move a view (any type of view, imageview, buttonview, textview etc ) to another view it is necessary that both views to be in the same layout, that is the most important part.
And the code to achieve this is:
//here is the part of initialization
ImageView poz1Inamic = (ImageView) findViewById(inamic_pozitia1);
ImageView poz1InamicSpateCarte = (ImageView) findViewById(inamic_pozitia1spatecarte);
//other code
poz1InamicSpateCarte.setVisibility(View.INVISIBLE);
//here is the initialization of the arrive position
ImageView cartePusaInamic = (ImageView) findViewById(R.id.cartePusaInamic);
//the code for moving from start position to arrive position
poz1Inamic.animate()
.x(cartePusaInamic.getX())
.y(cartePusaInamic.getY())
.setDuration(333)
.start();
I have a relative layout (let's call it A), inside a scroll view, inside a relative layout (we will call this layout B)
What I'm trying to do is remove a child from A, insert it into B and align it to the parent top (right below the action bar).
I've been trying to animate this slide up, and back down to it's original position without any luck.
Any idea how can I perform this animation?
A very late reply, but here's how I managed this:
center_to_top_center.xml (located in res/anim/)
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:duration="1000"
android:fillAfter="true"
android:fromXDelta="0%p"
android:fromYDelta="00%p"
android:toXDelta="00%p"
android:toYDelta="-40%p" />
</set>
HomeActivity.java
public class HomeActivity extends FragmentActivity {
#InjectView(R.id.imageView2)
ImageView mImageView;
#Override
protected void onCreate(Bundle savedInstanceState) {
setContentView(R.layout.activity_home, false);
beginLogoAnimation();
}
private void beginLogoAnimation(){
Animation translateAnim= AnimationUtils.loadAnimation(getApplicationContext(),
R.anim.center_to_top_center);
translateAnim.setFillAfter(true);
translateAnim.setFillEnabled(true);
translateAnim.setFillBefore(false);
translateAnim.setAnimationListener(new Animation.AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
}
#Override
public void onAnimationRepeat(Animation animation) {
}
});
mImageView.startAnimation(translateAnim);
}
}
activity_home.xml
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/imageView2"
android:layout_centerInParent="true"
android:layout_marginTop="15dp"
android:layout_centerHorizontal="true"
android:src="#drawable/logo"
/>
Since you are Animating Layout Changes Try adding this to your layout block:
android:animateLayoutChanges="true"
Source: http://developer.android.com/guide/topics/graphics/prop-animation.html#layout
Is there any way that foreground activity send some signal (such as callback) to the previous activity without finishing foreground activity?
I am implementing activity transition on my own. Once user clicks one of images on activity A, activity B is launched with the bitmap, position and dimension of the image. The original image from A is hidden, and activity B animates imageview with the bitmap at the exact location in the exact size. So it seems the image from A moves. Simple.
But the problem is, there is very small time gap between hiding image from A, and start drawing image at B, so there is some flickering. Although I am currently hiding image from A after 100ms, I don't think that's good solution overall.
Is there any way that activity B can notify activity A just right before animation starts in order to hide original image properly?
Simple, do not use different activities for this. Instead use animations.
Here's a simple example to translate and scale an ImageView:
MainActivity.java:
public class MainActivity extends ActionBarActivity {
private ImageView ivImage;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ivImage = (ImageView) findViewById(R.id.ivImage);
ivImage.setImageDrawable(ContextCompat.getDrawable(getApplicationContext(), R.drawable.background));
ivImage.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
animate();
}
});
}
private void animate() {
Animation animation = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.bitmap_movement);
ivImage.startAnimation(animation);
}
}
bitmap_movement.xml:
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="3000"
android:fillAfter="true"
android:fillEnabled="true">
<scale
android:fromXScale="1.0"
android:fromYScale="1.0"
android:toXScale="0.5"
android:toYScale="0.5" />
<translate
android:fromXDelta="0"
android:toXDelta="240" />
</set>
Layout main_activity.xml:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context=".MainActivity">
<ImageView
android:id="#+id/ivImage"
android:layout_width="40dp"
android:layout_height="40dp" />
</RelativeLayout>
its my first time to ask question here...
im hoping that somebody could help me....
i want to animate multiple images that animates as fade in and fade out. i was able to animate one imageview but what i need is once the first imageview fade out, the second imageview must fade in and so on...
it should loop once the application is opened. thanks
here is how i call the animation in my java onCreate(),
final ImageView image = (ImageView)findViewById(R.id.bsc);
final Animation animationFadeIn = AnimationUtils.loadAnimation(this, R.anim.fadein);
image.startAnimation(animationFadeIn);
final Animation animationFadeOut = AnimationUtils.loadAnimation(this, R.anim.fadeout);
image.startAnimation(animationFadeOut);
fade in.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="#android:anim/linear_interpolator">
<alpha
android:fromAlpha="0.1"
android:toAlpha="1.0"
android:duration="2000"
/>
</set>
fade out.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="#android:anim/linear_interpolator">
<alpha
android:fromAlpha="1.0"
android:toAlpha="0.1"
android:duration="2000"
/>
</set>
Try using AnimationListener.
final ImageView image = (ImageView)findViewById(R.id.bsc);
final Animation animationFadeIn = AnimationUtils.loadAnimation(this, R.anim.fadein);
final Animation animationFadeOut = AnimationUtils.loadAnimation(this, R.anim.fadeout);
AnimationListener animListener = new AnimationListener(){
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationRepeat(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
image.setImageResource(R.drawable.hsc);
image.startAnimation(animationFadeIn);
}
};
image.startAnimation(animationFadeOut);
animationFadeOut.setAnimationListener(animListener);
If you want to loop, then put another listener on animationFadeIn also. This will again start animationFadeOut. Pick images from an array and display.
In your Activity.xml layout create a new ImageView, please note I'm not using the attribute android:src="#drawable/...." in this ImageView , like this
<ImageView
android:id="#+id/uno"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
/>
So you will have two imageViews in your Activity.xml finally
1.-Your first image (the original in your code)
<ImageView
android:id="#+id/bsc"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:src="#drawable/your_first_image/>
2.-the new image without android:src attribute
<ImageView
android:id="#+id/uno"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
/>
In your activity class onCreate() define the new image you want to use, of course you need to save this image in your drawable folder, and then set the image with its drawable using setImageResource() method, the code will be something like this;
ImageView nueva = null;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//....your code...
nueva = (ImageView) findViewById(R.id.uno);
//Here set the new image
nueva.setImageResource(R.drawable.your_new_image);
}
Now just need to add the animations, in onResume() method for example:
#Override
protected void onResume() {
super.onResume();
//the imagen you are using in your code
image.startAnimation(animationFadeOut);
//the new image fadein
nueva.startAnimation(animationFadeIn);
}
Is there a way to have the Animation pause for a half a second?
I am trying to make an infinite animation using the TranslateAnimation API. So, I use the RepeatCount as Infinite. I also noticed that there's a setStartOffset(...) method that covers the case when I'd like to have a delay in starting the animation. However, I can't find a way to have a delay before each 'restart'. Since animation is gonna happen infinite amount of times, every time the animation restarts I need to put a delay in.
Any ideas?
Thanks!!
Here is an example:
First the layout (main.xml) with an image we would like to animate:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_launcher" />
</LinearLayout>
Next one is the animation. Placed in res/anim and is called anim_img.xml. The file contains the translation animation with android:startOffset="500" (in millisec). This will set the offset, which is used every time animation starts:
<?xml version="1.0" encoding="utf-8"?>
<set>
<translate
xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="1000"
android:fromXDelta="0%"
android:fromYDelta="0%"
android:toXDelta="0%"
android:toYDelta="100%"
android:zAdjustment="top"
android:repeatCount="infinite"
android:startOffset="500"/>
</set>
And last but not least - the activity. Which starts the animation:
public class StackOverflowActivity extends Activity {
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
ImageView iv_icon = (ImageView) findViewById(R.id.imageView1);
Animation a = AnimationUtils.loadAnimation(this, R.anim.anim_img);
a.setFillAfter(true);
a.reset();
iv_icon.startAnimation(a);
}
}
To achieve a pause of x milliseconds between each restart:
myAnimation.setAnimationListener(new AnimationListener(){
#Override
public void onAnimationStart(Animation arg0) {
}
#Override
public void onAnimationEnd(Animation animation) {
}
#Override
public void onAnimationRepeat(Animation animation) {
myAnimation.setStartOffset(x);
}
});
myanimation.setStartDelay(int);