I am developing an application in which i am having a custom list view. One item of list view contains four text box. The need of app is like when i click on one text box, one image view should be visible, zoom in and then zoom out, and after zoom out the visibility should be gone.
What i tried is :
In adapter in getView method
if(clickPosition == position){
holder.imageViewOne.setVisibility(View.VISIBLE);
holder.imageViewOne.startAnimation(zoominout);
zoominout.setAnimationListener(new AnimationListener() {
#Override
public void onAnimationStart(Animation arg0) {}
#Override
public void onAnimationRepeat(Animation arg0) {}
#Override
public void onAnimationEnd(Animation arg0) {
holder.imageViewOne.setVisibility(View.GONE);
clickedPosition = -1;
}
});
}
My animation XML
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:fillAfter="true" >
<scale
xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="2000"
android:fromXScale="1"
android:fromYScale="1"
android:pivotX="50%"
android:pivotY="50%"
android:toXScale="3"
android:toYScale="3" >
</scale>
<scale
xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="2000"
android:fromXScale="1.0"
android:fromYScale="1.0"
android:pivotX="50%"
android:pivotY="50%"
android:toXScale="0.5"
android:toYScale="0.5"
android:startOffset="2000" >
</scale>
</set>
When i run my app the animation is working good.
But the issue is :
1) The visibility gone on image view is not working.
2) I am having list like below image :
When i click on list item one, first textview, Animation is working, But when i click on list view 2 first textview animation is working on both List item 1 and List item 2.
What should i do for this? Am i missing something? Please guide me with your valuable suggestions.
You need to maintain an array of status of each images whether it is visible or not. You have to apply checks for visibility on the basis of that array of status on each of the ImageView in your getView() method. Now everytime when your animation ends for an ImageView, you have to update the corresponding status of that image in your array of status and just call notifyDataSetChanged().
Related
one more problem.
I am trying to make RecycleView items fade away, so I wrote an XML animation for each item, then a layer animation XML and added code in Java main activity. Everything works ok, views disappear, but the problem is, after they all disappear, they all of a sudden appear back again on their own! What can be the reason? How to keep alpha 0?
Codes:
Main activity method:
private void layoutDisappear(final RecyclerView recyclerView) {
if(recyclerView.isAnimating()){
return;
}
final Context context = recyclerView.getContext();
final LayoutAnimationController controller =
AnimationUtils.loadLayoutAnimation(context, R.anim.layout_recycleview_disappear);
recyclerView.setLayoutAnimation(controller);
recyclerView.setLayoutAnimationListener(new Animation.AnimationListener() {
public void onAnimationStart(Animation animation) {}
public void onAnimationRepeat(Animation animation) {}
public void onAnimationEnd(Animation animation) {
}
});
recyclerView.scheduleLayoutAnimation();
Item animation XML:
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="1400">
<alpha
android:fromAlpha="1"
android:interpolator="#android:anim/decelerate_interpolator"
android:toAlpha="0" />
<scale
android:fromXScale="100%"
android:fromYScale="100%"
android:interpolator="#android:anim/decelerate_interpolator"
android:pivotX="50%"
android:pivotY="50%"
android:toXScale="102%"
android:toYScale="102%" />
</set>
Layer XML:
<?xml version="1.0" encoding="utf-8"?>
<layoutAnimation xmlns:android="http://schemas.android.com/apk/res/android"
android:animation="#anim/item_recycleview_disappear"
android:animationOrder="reverse"
android:delay="7%" />
You need add android:fillAfter="true" property to Item animation XML to keep animation changes.
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:fillAfter="true"
android:duration="1400">
...
</set>
I need to locate a click on one ImageView (image1) and then to set my second ImageView (image2) to the same position, and start a rotate animation on image2.
My animatiom works fine when i don't change image2 position.
When I want to change the position and start the animation together image2 is moving all over the screen.
My XML code:
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<rotate
android:fromDegrees="0"
android:toDegrees="-50"
android:pivotX="50%"
android:pivotY="50%"
android:duration="1000"
/>
</set>
My java code is:
image1.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
image2.setX(image1.getX());
image2.setY(image1.getY());
Animation animation =
AnimationUtils.loadAnimation(MainActivity.this, R.anim.myanim);
image2.startAnimation(animation);
}
});
I'd like to apply 2 alternate rotation animations to a View. Each rotation should start after the click on the same View.
The result I'm looking for is:
the user clicks on the View and it rotates from 0° to 135°
the user clicks again on the View and it rotates from 135° to 0° (to the initial state)
The problem is that, when the user performs the second click, the Button resets to the initial aspect before starting the animation correctly.
I'm targeting Android APIs<11 so I'm using the startAnimation() method. The animations are applied to a Button view defined as follows:
<Button
android:id="#+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
The animations are the following
rotate_cw.xml (0° to 135° rotation):
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:fillAfter="true">
<rotate
android:duration="300"
android:fromDegrees="0"
android:pivotX="50%"
android:pivotY="50%"
android:toDegrees="135" />
</set>
rotate_ccw.xml (135° to 0° rotation):
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<rotate
android:duration="300"
android:fromDegrees="135"
android:pivotX="50%"
android:pivotY="50%"
android:toDegrees="0"/>
</set>
The animations are then applied in this way, where flag is a boolean global variable:
Button b = (Button) findViewById(R.id.button);
b.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
if (flag) {
Animation a = AnimationUtils.loadAnimation(this, R.anim.rotate_cw);
b.startAnimation(a);
} else {
Animation a = AnimationUtils.loadAnimation(this, R.anim.rotate_ccw);
b.startAnimation(a);
}
flag = !flag;
}
});
Am I missing anything?
Thanks in advance for your help.
What I am attempting to do is scale an ImageView from it's normal size, to 20% larger and then back. This should be looped. I have done this with the following code but it doesn't quite work right. More below.
anim/scale.xml
<set xmlns:android="http://schemas.android.com/apk/res/android">
<scale
android:duration="1000"
android:fromXScale="1.0"
android:fromYScale="1.0"
android:toXScale="1.2"
android:toYScale="1.2"
android:pivotX="50%"
android:pivotY="50%"
android:fillAfter="false" />
<scale
android:startOffset="1000"
android:duration="1000"
android:fromXScale="1.2"
android:fromYScale="1.2"
android:toXScale="1.0"
android:toYScale="1.0"
android:pivotX="50%"
android:pivotY="50%"
android:fillAfter="false" />
</set>
Then in my code I do
private void scaleAnimation() {
final Animation scaler = AnimationUtils.loadAnimation(this, R.anim.scale);
scaler.setAnimationListener(new AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationRepeat(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
animation.reset();
animation.startNow();
}
});
new Handler().postDelayed(new Runnable() {
#Override
public void run() {
scale.startAnimation(scaler);
}
}, 2000);
}
I have the handler there so I could see what was happening at the start.
The problem is kind of difficult to explain.. My image appears to get scaled as soon as the animation starts AND THEN it performs the animation. So the image appears, as it should, for 2 seconds. Just as the animation starts it suddenly gets bigger by what appears to be 25% - 50% and then the animation performs properly. Once the animation is over, the image resizes to it's original size really quickly and then gets scaled up again and then the animation starts over.
I've tried with a couple of different images without difference. It is my understanding that fromXScale=1.0 starts the animation with no scaling, i.e. the image as is. Hopefully someone can shed light on what I've done wrong or where I've misunderstood the concepts.
Cheers
If what you're trying to accomplish is an view that scales from 1.0 to 1.2 back to 1.0 constantly, you could make your animation simpler.
You would do the following:
Only define one scale animation (from 1.0 to 1.2)
Set the repeat count to INFINITE
Set the repeat mode to REVERSE
For more info, you can check out the document on the Animation class
In my case, I need to animate my view one time (1.0f -> 0.6f -> 1.0f)
The solution of cheezy works for me changing repeatCount = 1 instead of infinite.
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:shareInterpolator="false">
<scale
android:duration="600"
android:fromXScale="1.0"
android:fromYScale="1.0"
android:pivotX="50%"
android:pivotY="50%"
android:repeatMode="reverse"
android:repeatCount="1"
android:toXScale="0.6"
android:toYScale="0.6" />
</set>
I have 2 imageview (a imageview for a pen image, and a imageview for a line, both are drawable), that each one has it own view animation that works perfectly.
my problem is that when I start the animation for the pen I want it to interact and animate the drawing of the line in the other view animation (I want that it will show as the pen is drawing the line), how do I do that?
my xml for animation for the pen imageview is:
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:fromXDelta="0%p"
android:toXDelta="100%p"
android:fromYDelta="-50%p"
android:toYDelta="-50%p"
android:duration="2000"/>
</set>
my xml for animation for the line imageview is:
<?xml version="1.0" encoding="utf-8"?>
<scale xmlns:android="http://schemas.android.com/apk/res/android"
android:pivotX="0%"
android:pivotY="50%"
android:fromXScale="0%"
android:toXScale="100%"
android:fromYScale="1.0"
android:toYScale="1.0"
android:fillAfter="true"
android:duration="2000"
android:interpolator="#android:anim/linear_interpolator"
/>
please help!
I believe this can be done with the help of animationListener. Add an animationListener for the pen's animation. In onAnimationStart method do lineImage.startAnimation(lineAnimation);
Sample:
penAnimation.setAnimationListener(new Animation.AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
lineImage.startAnimation(lineAnimation);
}
#Override
public void onAnimationEnd(Animation animation) {
}
#Override
public void onAnimationRepeat(Animation animation) {
}
});