I've succesfully managed to do a nice slide-down effect when expanding a list-object by using an animation. I am trying to do the reverse thing, a slide-up effect, when collapsing the expanded view, but with no success. Here is my onclicklistener:
head.setOnClickListener(new OnClickListener() {
public void onClick(View v) {
if (child.isShown()) {
Slide.slide_up(Kalender.this, child);
child.setVisibility(View.GONE);
} else {
child.setVisibility(View.VISIBLE);
Slide.slide_down(Kalender.this, child);
}
}
});
And my Slide-class:
public class Slide {
public static void slide_down(Context context, View view) {
Animation anim = AnimationUtils.loadAnimation(context, R.anim.slide_down);
if (anim != null) {
anim.reset();
if (view != null) {
view.clearAnimation();
view.startAnimation(anim);
}
}
}
public static void slide_up(Context context, View view) {
Animation anim = AnimationUtils.loadAnimation(context, R.anim.slide_up);
if (anim != null) {
anim.reset();
if (view != null) {
view.clearAnimation();
view.startAnimation(anim);
}
}
}
And finally the animations. Slide-down:
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:fillAfter="true" >
<scale
android:duration="200"
android:fromXScale="1.0"
android:fromYScale="0.0"
android:interpolator="#android:anim/linear_interpolator"
android:toXScale="1.0"
android:toYScale="1.0" />
</set>
Slide-up:
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:fillAfter="true" >
<scale
android:duration="200"
android:fromXScale="1.0"
android:fromYScale="1.0"
android:interpolator="#android:anim/linear_interpolator"
android:toXScale="1.0"
android:toYScale="0.0" />
</set>
The only difference is that the slide-down starts at y=0 and goes to y=1, and the slide-up starts at y=1 and goes back to y=0, but this seems to be the wrong way of doing it. How can I make the slide-up work as well? Thanks
Related
Following is my zoom_in.xml
<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="1000"
android:fromXScale="0"
android:fromYScale="0"
android:pivotX="50%"
android:pivotY="50%"
android:toXScale="1"
android:toYScale="1" >
</scale>
</set>
the view is zoom in three time. how I can make it to only one time
PS: android:repeatCount="1" is not working.
EDIT 1: my animation Util have Load animation as folowing
public static Animation loadAnimation(Context context, #AnimRes int id)
throws NotFoundException {
XmlResourceParser parser = null;
try {
parser = context.getResources().getAnimation(id);
return createAnimationFromXml(context, parser);
} catch (XmlPullParserException ex) {
NotFoundException rnf = new NotFoundException("Can't load animation resource ID #0x" +
Integer.toHexString(id));
rnf.initCause(ex);
throw rnf;
} catch (IOException ex) {
NotFoundException rnf = new NotFoundException("Can't load animation resource ID #0x" +
Integer.toHexString(id));
rnf.initCause(ex);
throw rnf;
} finally {
if (parser != null) parser.close();
}
now I have called it as following
zoomIn = loadAnimation(getContext(),
R.anim.zoom_in);
view.startAnimation(zoomIn);
Set repeat count to 0
zoomIn = loadAnimation(getContext(), R.anim.zoom_in);
zoomIn.setRepeatCount(0);
Add AnimationListener to zoomIn like below
zoomIn.setAnimationListener(new Animation.AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
// clear animation here
view.clearAnimation();
}
#Override
public void onAnimationRepeat(Animation animation) {
}
});
Hope this will help.
Insted of using "set" try "objectAnimator" :
<objectAnimator xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="1000"
android:fromXScale="0"
android:fromYScale="0"
android:pivotX="50%"
android:pivotY="50%"
android:toXScale="1"
android:toYScale="1"
android:repeatCount="1" />
I am creating a animation in which I want to fade out my imageview but the fading animation should start from bottom to top unlike fading animation in which whole imageview fades at once.
public void animateFadeIn() {
Animation in = AnimationUtils.loadAnimation(this,
android.R.anim.fade_in);
motherboard.startAnimation(in);
motherboard.setVisibility(View.VISIBLE);
in.setDuration(1500);
in.setAnimationListener(new AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
// TODO Auto-generated method stub
}
#Override
public void onAnimationRepeat(Animation animation) {
// TODO Auto-generated method stub
}
#Override
public void onAnimationEnd(Animation animation) {
// TODO Auto-generated method stub
animateFadeOut();
}
});
}
How to achieve this.
<?xml version="1.0" encoding="UTF-8"?>
<scale
android:fromYScale="-450"
android:toYScale="450" />
<alpha
android:duration="1500"
android:fromAlpha="0.0"
android:interpolator="#android:anim/accelerate_interpolator"
android:repeatCount="infinite"
android:toAlpha="1.0" />
create a slide_up.xml in your
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:duration="5000"
android:fillAfter="true"
android:fromYDelta="75%p"
android:repeatCount="0"
android:toYDelta="0%p" />
your fade_in.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:fillAfter="true" >
<alpha
android:duration="1000"
android:fromAlpha="0.0"
android:interpolator="#android:anim/accelerate_interpolator"
android:toAlpha="1.0" />
</set>
than load animation
ImageView imageview;
Animation animFadein, animslideup;
animFadein = AnimationUtils.loadAnimation(getApplicationContext(),
R.anim.fade_in);
animslideup = AnimationUtils.loadAnimation(getApplicationContext(),
R.anim.slide_up);
final AnimationSet s = new AnimationSet(true);
s.setInterpolator(new AccelerateInterpolator());
s.addAnimation(animslideup);
s.addAnimation(animFadein);
imageview.startAnimation(s);
i am trying to scale an image, rotate it, rotate it backwards and then scale it to its origninal size.
This is allready working, but i cant figure out how to repeat this animation set infinitly ( android:repeatCount="infinite" isnt working for me ).
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="#android:anim/accelerate_decelerate_interpolator"
android:shareInterpolator="true"
android:repeatCount="infinite"
>
<scale
android:fromXScale="1.0"
android:toXScale="4.0"
android:fromYScale="1.0"
android:toYScale="4.0"
android:pivotX="50%"
android:pivotY="50%"
android:duration="700"
/>
<rotate
android:fromDegrees="0"
android:toDegrees="360"
android:pivotX="50%"
android:pivotY="50%"
android:startOffset="700"
android:duration="2000"
/>
<rotate
android:fromDegrees="360"
android:toDegrees="0"
android:pivotX="50%"
android:pivotY="50%"
android:startOffset="2700"
android:duration="2000"
/>
<scale
android:fromXScale="1.0"
android:toXScale="0.25"
android:fromYScale="1.0"
android:toYScale="0.25"
android:pivotX="50%"
android:pivotY="50%"
android:startOffset="4700"
android:duration="700"
/>
</set>
and in the Activity:
ImageView imageView = (ImageView) findViewById(R.id.imageView2);
Animation rotateAndScale = AnimationUtils.loadAnimation(this, R.anim.rotate_z);
imageView.startAnimation(rotateAndScale);
<set> marker in xml is bad implemented and not work propperly. Full explenation here: Android animation does not repeat
what you should do is use listener and method to use recurency to roll the anim for ever.
public void startAnimation() {
View component= findViewById(R.id.imageView2);
component.setVisibility(View.VISIBLE);
Animation anim = AnimationUtils.loadAnimation(this, R.anim.rotate_z);
anim.setAnimationListener(new AnimationListener() {
#Override
public void onAnimationEnd(Animation arg0) {
Animation anim = AnimationUtils.loadAnimation(this, R.anim.rotate_z);
anim.setAnimationListener(this);
component.startAnimation(anim);
}
#Override
public void onAnimationRepeat(Animation arg0) {
// TODO Auto-generated method stub
}
#Override
public void onAnimationStart(Animation arg0) {
// TODO Auto-generated method stub
}
});
component.startAnimation(anim);
}
I am just curious. How do I implement animation in ping app when I start/replace one activity/fragment from other. In IOS we can add a mask layer in oval shape and modify the alpha values. How do i implement this in android?
This is the solution:
Create the shape.xml:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">
<solid
android:color="#android:color/black"/>
</shape>
Set it to your ImageView:
<ImageView
android:layout_width="60dp" //or another
android:layout_height="60dp" //or another
android:id="#+id/ping"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true"
android:src="#drawable/shape" />
Then create two animations scale_up.xml and scale_down.xml:
scale_up.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<scale
android:fromXScale="1.0"
android:fromYScale="1.0"
android:toXScale="1.5"
android:toYScale="1.5"
android:pivotX="50%"
android:pivotY="50%"
android:duration="1000"
android:fillBefore="true" />
</set>
scale_down.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<scale
android:fromXScale="1.5"
android:fromYScale="1.5"
android:toXScale="1.0"
android:toYScale="1.0"
android:pivotX="50%"
android:pivotY="50%"
android:duration="1000"
android:fillBefore="true" />
</set>
And finally startAnimation() in code:
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
final ImageView ping = (ImageView) findViewById(R.id.ping);
final Animation scaleDown = AnimationUtils.loadAnimation(this, R.anim.scale_down);
final Animation scaleUp = AnimationUtils.loadAnimation(this, R.anim.scale_up);
scaleDown.setAnimationListener(new Animation.AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
ping.startAnimation(scaleUp);
}
#Override
public void onAnimationRepeat(Animation animation) {
}
});
scaleUp.setAnimationListener(new Animation.AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
ping.startAnimation(scaleDown);
}
#Override
public void onAnimationRepeat(Animation animation) {
}
});
ping.startAnimation(scaleUp);
}
I need to slow down an rotate animation over an imageview: it begin faster, then it should "decelerate" until end of animation (then rotation stop). I've write this:
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >
<rotate
android:duration="100"
android:fromDegrees="0"
android:interpolator="#android:anim/cycle_interpolator"
android:pivotX="50%"
android:pivotY="50%"
android:repeatCount="30"
android:repeatMode="restart"
android:toDegrees="360" />
</set>
then add listener to animation:
Animation rotate = AnimationUtils
.loadAnimation(activity, R.anim.rotate);
ImageView logo = (ImageView) SplashScreen.activity
.findViewById(R.id.logo);
rotate.setAnimationListener(new AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
// TODO Auto-generated method stub
}
#Override
public void onAnimationEnd(Animation animation) {
Intent intent = new Intent(SplashScreen.this,
LoginActivity.class);
SplashScreen.this.startActivity(intent);
}
#Override
public void onAnimationRepeat(Animation animation) {
if(animation.getRepeatCount() == 5) {
animation.setDuration(200);
} else if (animation.getRepeatCount() == 10) {
Log.i("ANIM", "10");
animation.setDuration(5000);
} else if (animation.getRepeatCount() == 15) {
animation.setDuration(800);
} else if (animation.getRepeatCount() == 20) {
animation.setDuration(1600);
} else if (animation.getRepeatCount() == 25) {
animation.setDuration(2000);
}
}
});
logo.setAnimation(rotate);
logo.startAnimation(rotate);
but animation has always the same velocity (code never go into onAnimationRepeat). What's wrong?
Simply use
android:interpolator="#android:anim/decelerate_interpolator"
in your animation xml file.
check this link for other interpolators http://developer.android.com/reference/android/view/animation/package-summary.html
also add
android:repeatCount="1"
because the default is 0.
Try this :
<set xmlns:android="http://schemas.android.com/apk/res/android" >
<rotate
android:duration="100"
android:fromDegrees="0"
android:interpolator="#android:anim/decelerate_interpolator"
android:pivotX="50%"
android:pivotY="50%"
android:repeatCount="30"
android:repeatMode="restart"
android:toDegrees="360" />
</set>
Change interpolator cycle_interpolator to decelerate_interpolator so that you get an effect which is faster at beginning and gradually slows down.