This code switches the y-position of two Views (mView1 and mView2) on Button click via ObjectAnimator and AnimationSets. While the translate animation the alpha value of both views will be reduced and growth again. This is just a setup to play around a bit. The alpha animation is defined in XML and the translate animation is done with code.
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:ordering="sequentially">
<objectAnimator
android:propertyName="alpha"
android:duration="500"
android:valueTo="0.5"
android:valueType="floatType"/>
<objectAnimator
android:propertyName="alpha"
android:duration="500"
android:valueTo="1.0"
android:valueType="floatType"/>
</set>
#Override
public void onClick(View v) {
if (mView1 != null && mView2 != null) {
int top = mView2.getTop();
ObjectAnimator translateView1 = null;
ObjectAnimator translateView2 = null;
if (mView1.getTranslationY() == 0) {
translateView1 = ObjectAnimator.ofFloat(mView1, "translationY", top);
translateView2 = ObjectAnimator.ofFloat(mView2, "translationY", top*(-1));
} else {
translateView1 = ObjectAnimator.ofFloat(mView2, "translationY", 0);
translateView2 = ObjectAnimator.ofFloat(mView1, "translationY", 0);
}
translateView1.setDuration(1000L);
translateView2.setDuration(1000L);
AnimatorSet alpha1 = (AnimatorSet)AnimatorInflater.loadAnimator(mCtx, R.anim.switcher);
alpha1.setTarget(mView1);
AnimatorSet alpha2 = (AnimatorSet)AnimatorInflater.loadAnimator(mCtx, R.anim.switcher);
alpha2.setTarget(mView2);
AnimatorSet set = new AnimatorSet();
set.playTogether(translateView1, translateView2, alpha1, alpha2);
set.start();
}
}
Now, because this is working as expected, I wanna know how I can shorten the code?
Is it really necessary to have a seperate instance of an AnimatorSet for every View, which uses the animation from XML? Can I inflate the xml once and use it on different AnimatorSets / ObjectAnimators? Because I didn't found a setter which takes an Animator as an Argument.
Can I define multiple targets for one AnimationSet/ObjectAnimator? Or is the only way to define different ObjectAnimators for the Views and use them in a AnimationSet?
You will want to put the animation code inside the class that's animated ... like this :
public class FadingView extends View {
private ObjectAnimator fade, moveX, moveY;
private AnimatorSet moveSet;
public FadingView(Context context) {
super(context);
}
private void fade(int duration, float...values) {
if(fade==null) {
fade = ObjectAnimator.ofFloat(this, "alpha", values);
} else {
fade.setFloatValues(values);
}
fade.setDuration(duration);
fade.start();
}
private void move(int duration, int x, int y) {
if(moveX==null) {
moveX = ObjectAnimator.ofFloat(this, "translation_x", x);
} else {
moveX.setFloatValues(x);
}
if(moveY==null) {
moveY = ObjectAnimator.ofFloat(this, "translation_y", y);
} else {
moveY.setFloatValues(y);
}
if(moveSet == null) {
moveSet = new AnimatorSet();
moveSet.playTogether(moveX, moveY);
}
moveSet.setDuration(duration);
moveSet.start();
}
public void moveToUpperLeft(int duration) {
move(duration, 0,0);
}
public void show(int duration) {
fade(duration,1);
}
public void hide(int duration) {
fade(duration,0);
}
}
Just a basic example, but now you can call :
FadingView view = new FadingView(context);
view.hide(500);
view.moveToUpperLeft(500);
Of course you can customize and generalize this even more ...
Related
I'm trying to make an effect on two images, as if it were a flip card annimation. Image 1 = "botaoiniciar" and Image 2 = "botaosair". At the moment when I click on the initial, it turns the second, but then it gets stuck on the second image and I would like it to come back. I am using the following code. I thank you for your attention.
final ImageView botaoiniciar = (ImageView) findViewById(R.id.botaoiniciar);
botaoiniciar.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
final ObjectAnimator oa1 = ObjectAnimator.ofFloat(botaoiniciar, "scaleX", 1f, 0f);
final ObjectAnimator oa2 = ObjectAnimator.ofFloat(botaoiniciar, "scaleX", 0f, 1f);
oa1.setInterpolator(new DecelerateInterpolator());
oa2.setInterpolator(new AccelerateDecelerateInterpolator());
oa1.addListener(new AnimatorListenerAdapter() {
#Override
public void onAnimationEnd(Animator animation) {
super.onAnimationEnd(animation);
botaoiniciar.setImageResource(R.drawable.botaosair);
oa2.start();
}
});
oa1.start();
}
});
You need to keep animators and change them when card flips. A Boolean can keeps the fliping state. Here is my example:
public class MyFragment extends Fragment {
#OnClick(R.id.frmMain) //onclick for container of two sides
public void onClick() {
flipCard(); //call method that flips card base on current "mIsBackVisible" state
}
#BindView(R.id.card_front)
FrameLayout mCardFront;
#BindView(R.id.card_back)
FrameLayout mCardBack;
AnimatorSet animFront;
AnimatorSet animBack;
private boolean mIsBackVisible = false; //keeping card flip state
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
View root = inflater.inflate(R.layout.myLauyout, container, false);
ButterKnife.bind(this, root);
//important part is this two lines + onclick for container
loadAnimations(); //initialize animations
changeCameraDistance(); //optimize card appearance (optional)
return root;
}
private void changeCameraDistance() {
int distance = 8000;
float scale = getResources().getDisplayMetrics().density * distance;
mCardFront.setCameraDistance(scale);
mCardBack.setCameraDistance(scale);
}
private void loadAnimations() {
animBack = (AnimatorSet) AnimatorInflater.loadAnimator(getContext(), R.animator.flip_back);
animFront = (AnimatorSet) AnimatorInflater.loadAnimator(getContext(), R.animator.flip_front);
}
public void flipCard() {
if (!mIsBackVisible) {
animBack.setTarget(mCardFront);
animFront.setTarget(mCardBack);
animBack.start();
animFront.start();
mIsBackVisible = true;
} else {
animBack.setTarget(mCardBack);
animFront.setTarget(mCardFront);
animBack.start();
animFront.start();
mIsBackVisible = false;
}
}
}
and here is my animator in res/animator/flip_front.xml:
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<objectAnimator
android:valueFrom="-180"
android:valueTo="0"
android:propertyName="rotationY"
android:repeatMode="reverse"
android:duration="#integer/anim_length" />
<objectAnimator
android:valueFrom="0.0"
android:valueTo="1.0"
android:propertyName="alpha"
android:startOffset="#integer/anim_length_half"
android:duration="0" />
</set>
res/animator/flip_back.xml:
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<objectAnimator
android:valueFrom="0"
android:valueTo="180"
android:propertyName="rotationY"
android:duration="#integer/anim_length" />
<objectAnimator
android:valueFrom="1.0"
android:valueTo="0.0"
android:propertyName="alpha"
android:startOffset="#integer/anim_length_half"
android:duration="0" />
</set>
If have any question, just comment. ;)
I have two animations that are to occur one after the other. The first one works as expected, however, the 2nd animation jumps to the very top of the screen at the first animation's onAnimationEnd() call. A balloon ImageView "floats" up to the center of the screen, and it is supposed to expand (the rest will be implemented later. I'm just trying to get this part to work). The first animation is pure Java, not xml.
The second animation's xml (bounce.xml):
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<scale
android:duration="2000"
android:fromXScale="1.0"
android:toXScale="2.0"
android:fromYScale="1.0"
android:toYScale="2.0"
android:pivotX="50%"
android:pivotY="50%"/>
</set>
My BounceInterpolator class:
public class BounceInterpolator implements Interpolator {
private double mAmplitude = 1;
private double mFrequency = 10;
BounceInterpolator(double amplitude, double frequency) {
mAmplitude = amplitude;
mFrequency = frequency;
}
public float getInterpolation(float time) {
return (float) (-1 * Math.pow(Math.E, -time/ mAmplitude) * Math.cos(mFrequency * time) + 1);
}
}
And finally the class where it all happens:
public class CelebrateActivity extends AppCompatActivity {
ImageView purple_balloon_1;
Animation anim;
Animation bounceAnim;
RelativeLayout layout;
MediaPlayer mediaPlayer;
DisplayMetrics displayMetrics;
static int height;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_celebrate);
displayMetrics = new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(displayMetrics);
height = displayMetrics.heightPixels;
mediaPlayer = MediaPlayer.create(this, R.raw.first_love);
mediaPlayer.start();
layout = findViewById(R.id.relativeLayout);
purple_balloon_1 = findViewById(R.id.purple_balloon_1);
slideUp();
}
public void slideUp() {
Animation slide = null;
slide = new TranslateAnimation(0, 0, height, height / 2 - 100);
slide.setDuration(15000);
slide.setFillAfter(true);
slide.setFillEnabled(true);
purple_balloon_1.startAnimation(slide);
bounceAnim = AnimationUtils.loadAnimation(CelebrateActivity.this, R.anim.bounce);
BounceInterpolator interpolator = new BounceInterpolator(0.2, 20);
bounceAnim.setInterpolator(interpolator);
slide.setAnimationListener(new Animation.AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
purple_balloon_1.startAnimation(bounceAnim); //Where the 2nd animation is supposed to start. It works, but it jumps to the top of the screen.
}
#Override
public void onAnimationRepeat(Animation animation) {
}
});
}
}
Why does it jump to the top of the screen, and how can I set the Y coordinate to the location of the ImageView to prevent said jumping?
#pskink - Thank you for the tips. I went with ObjectAnimator and AnimatorSet. I got rid of both of my xml files and the BounceInterpolator class, which saved a lot of code in the process. The animation is working perfectly now.
Again, thank you.
public class CelebrateActivity extends AppCompatActivity {
ImageView purple_balloon_1;
//Animation slide;
//Animation grow;
AnimatorSet animatorSet;
RelativeLayout layout;
MediaPlayer mediaPlayer;
DisplayMetrics displayMetrics;
static int height;
public static final String TAG = "CelebrateActivity.this";
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_celebrate);
displayMetrics = new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(displayMetrics);
height = displayMetrics.heightPixels;
mediaPlayer = MediaPlayer.create(this, R.raw.first_love);
mediaPlayer.start();
layout = findViewById(R.id.relativeLayout);
purple_balloon_1 = findViewById(R.id.purple_balloon_1);
animatorSet = new AnimatorSet();
ObjectAnimator slide = ObjectAnimator.ofFloat(purple_balloon_1, "translationY", height, height / 2);
slide.setDuration(15000);
ObjectAnimator growX = ObjectAnimator.ofFloat(purple_balloon_1, "scaleX", 1.5f);
growX.setDuration(500);
ObjectAnimator growY = ObjectAnimator.ofFloat(purple_balloon_1, "scaleY", 1.5f);
growY.setDuration(500);
animatorSet.playTogether(growX, growY);
animatorSet.playSequentially(slide, growX);
animatorSet.start();
}
}
I used the following code to fade in only the Button Text. but it gives fadein for whole Button.
Animation animationFadeIn = AnimationUtils.loadAnimation(this, R.anim.fade_in);
//register btn listener
m_btn_register.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
m_btn_register.startAnimation(animationFadeIn);
}
});
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>
what is the correct way to acheive this?
Note : Having custom spans for button does not work on lollipop and above. So have this
<Button
android:textAllCaps="false"
My CustomSpan
public class CustomSpan extends CharacterStyle implements UpdateAppearance {
private int alpha;
public int getAlpha() {
return alpha;
}
public void setAlpha(int alpha) {
this.alpha = alpha;
}
public CustomSpan() {
}
#Override
public void updateDrawState(TextPaint paint) {
paint.setAlpha(alpha);
}
}
Custom Property
private static final Property<CustomSpan, Integer> FADE_INT_PROPERTY
= new Property<CustomSpan, Integer>(Integer.class, "FADE_INT_PROPERTY") {
#Override
public void set(CustomSpan span, Integer value) {
span.setAlpha(value);
}
#Override
public Integer get(CustomSpan object) {
return object.getAlpha();
}
};
Then
String text = button.getText().toString();
final CustomSpan span = new CustomSpan();
final SpannableString spannableString = new SpannableString(text);
int start = 0;
int end = text.length();
spannableString.setSpan(span, start, end, 0);
button.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
ObjectAnimator objectAnimator = ObjectAnimator.ofInt(
span, FADE_INT_PROPERTY, 0, 255);
objectAnimator.setEvaluator(new IntEvaluator());
objectAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
#Override
public void onAnimationUpdate(ValueAnimator animation) {
button.setText(spannableString);
}
});
objectAnimator.setDuration(10000);
objectAnimator.start();
}
});
Gif
Change your code to this way
<?xml version="1.0" encoding="UTF-8" ?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<scale android:duration="#android:integer/config_shortAnimTime"
android:pivotX="50.0%"
android:pivotY="50.0%"
android:fromXScale="1.0"
android:toXScale="0.9"
android:fromYScale="1.0"
android:toYScale="0.9"/>
<alpha android:duration="#android:integer/config_shortAnimTime"
android:fromAlpha="1.0"
android:toAlpha="0.7"/>
</set>
and one more thing declare Animation gloabal.
I don't think there is a solution using animation API because it works on the view and doesn't take care of the content of it.
So, I think you should create container view for the button and add your button background for the new container.
then set the button background to be transparent.
After that make the animation for the button only.
how can I display a layout in the center with slideUp when I press the button, and press again to hide ... slideDown in ANDROID
help me with that, thnkss
Create two animation xml under res/anim folder
slide_down.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >
<translate
android:duration="1000"
android:fromYDelta="0"
android:toYDelta="100%" />
</set>
slide_up.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >
<translate
android:duration="1000"
android:fromYDelta="100%"
android:toYDelta="0" />
</set>
Load animation Like bellow Code and start animation when you want According to your Requirement
//Load animation
Animation slide_down = AnimationUtils.loadAnimation(getApplicationContext(),
R.anim.slide_down);
Animation slide_up = AnimationUtils.loadAnimation(getApplicationContext(),
R.anim.slide_up);
// Start animation
linear_layout.startAnimation(slide_down);
I use these easy functions, it work like jquery slideUp slideDown, use it in an helper class, just pass your view :
public static void expand(final View v) {
v.measure(WindowManager.LayoutParams.MATCH_PARENT, WindowManager.LayoutParams.WRAP_CONTENT);
final int targetHeight = v.getMeasuredHeight();
// Older versions of android (pre API 21) cancel animations for views with a height of 0.
v.getLayoutParams().height = 1;
v.setVisibility(View.VISIBLE);
Animation a = new Animation()
{
#Override
protected void applyTransformation(float interpolatedTime, Transformation t) {
v.getLayoutParams().height = interpolatedTime == 1
? WindowManager.LayoutParams.WRAP_CONTENT
: (int)(targetHeight * interpolatedTime);
v.requestLayout();
}
#Override
public boolean willChangeBounds() {
return true;
}
};
// 1dp/ms
a.setDuration((int) (targetHeight / v.getContext().getResources().getDisplayMetrics().density));
v.startAnimation(a);
}
public static void collapse(final View v) {
final int initialHeight = v.getMeasuredHeight();
Animation a = new Animation()
{
#Override
protected void applyTransformation(float interpolatedTime, Transformation t) {
if(interpolatedTime == 1){
v.setVisibility(View.GONE);
}else{
v.getLayoutParams().height = initialHeight - (int)(initialHeight * interpolatedTime);
v.requestLayout();
}
}
#Override
public boolean willChangeBounds() {
return true;
}
};
// 1dp/ms
a.setDuration((int)(initialHeight / v.getContext().getResources().getDisplayMetrics().density));
v.startAnimation(a);
}
Above method is working, but here are more realistic slide up and slide down animations from the top of the screen.
Just create these two animations under the anim folder
slide_down.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >
<translate
android:duration="200"
android:fromYDelta="-100%"
android:toYDelta="0" />
</set>
slide_up.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >
<translate
android:duration="200"
android:fromYDelta="0"
android:toYDelta="-100%" />
</set>
Load animation in java class like this
imageView.startAnimation(AnimationUtils.loadAnimation(getContext(),R.anim.slide_up));
imageView.startAnimation(AnimationUtils.loadAnimation(getContext(),R.anim.slide_down));
This doesn't work for me, I want to to like jquery slideUp / slideDown function, I tried this code, but it only move the content wich stay at the same place after animation end, the view should have a 0dp height at start of slideDown and the view height (with wrap_content) after the end of the animation.
From JAVA file: Use this is the method.
public class ViewAnimatorSlideUpDown {
public static void slideDown(final View view) {
if (view != null) {
view.setVisibility(View.VISIBLE);
ViewGroup.LayoutParams layoutParams = view.getLayoutParams();
layoutParams.height = 1;
view.setLayoutParams(layoutParams);
view.measure(View.MeasureSpec.makeMeasureSpec(Resources.getSystem().getDisplayMetrics().widthPixels,
View.MeasureSpec.EXACTLY),
View.MeasureSpec.makeMeasureSpec(0,
View.MeasureSpec.UNSPECIFIED));
final int height = view.getMeasuredHeight();
ValueAnimator valueAnimator = ObjectAnimator.ofInt(1, height);
valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
#Override
public void onAnimationUpdate(ValueAnimator animation) {
int value = (int) animation.getAnimatedValue();
if (height > value) {
ViewGroup.LayoutParams layoutParams = view.getLayoutParams();
layoutParams.height = value;
view.setLayoutParams(layoutParams);
} else {
ViewGroup.LayoutParams layoutParams = view.getLayoutParams();
layoutParams.height = ViewGroup.LayoutParams.WRAP_CONTENT;
view.setLayoutParams(layoutParams);
}
}
});
valueAnimator.start();
}
}
public static void slideUp(final View view) {
if (view != null) {
view.post(new Runnable() {
#Override
public void run() {
final int height = view.getHeight();
ValueAnimator valueAnimator = ObjectAnimator.ofInt(height, 1);
valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
#Override
public void onAnimationUpdate(ValueAnimator animation) {
int value = (int) animation.getAnimatedValue();
if (value > 0) {
ViewGroup.LayoutParams layoutParams = view.getLayoutParams();
layoutParams.height = value;
view.setLayoutParams(layoutParams);
} else {
view.setVisibility(View.GONE);
}
}
});
valueAnimator.start();
}
});
}
}
}
======================================================================
And Use it into Java file ex.
if (binding.llTheme.getVisibility() == View.GONE) {
ViewAnimatorSlideUpDown.slideDown(binding.llTheme);
binding.llTheme.setVisibility(View.VISIBLE);
} else {
binding.llTheme.setVisibility(View.GONE);
ViewAnimatorSlideUpDown.slideUp(binding.llTheme);
}
Done. ☻♥ keep it up.
I had a similar requirement in the app I am working on. And, I found a third-party library which does a slide-up, slide-down and slide-right in Android.
Refer to the link for more details: https://github.com/mancj/SlideUp-Android
To set up the library(copied from the ReadMe portion of its Github page on request):
Get SlideUp library
Add the JitPack repository to your build file. Add it in your root build.gradle at the end of repositories:
allprojects {
repositories {
...
maven { url 'https://jitpack.io' }
maven { url "https://maven.google.com" } // or google() in AS 3.0
}
}
Add the dependency (in the Module gradle)
dependencies {
compile 'com.github.mancj:SlideUp-Android:2.2.1'
compile 'ru.ztrap:RxSlideUp2:2.x.x' //optional, for reactive listeners based on RxJava-2
compile 'ru.ztrap:RxSlideUp:1.x.x' //optional, for reactive listeners based on RxJava
}
To add the SlideUp into your project, follow these three simple steps:
Step 1:
create any type of layout
<LinearLayout
android:id="#+id/slideView"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
Step 2:
Find that view in your activity/fragment
View slideView = findViewById(R.id.slideView);
Step 3:
Create a SlideUp object and pass in your view
slideUp = new SlideUpBuilder(slideView)
.withStartState(SlideUp.State.HIDDEN)
.withStartGravity(Gravity.BOTTOM)
//.withSlideFromOtherView(anotherView)
//.withGesturesEnabled()
//.withHideSoftInputWhenDisplayed()
//.withInterpolator()
//.withAutoSlideDuration()
//.withLoggingEnabled()
//.withTouchableAreaPx()
//.withTouchableAreaDp()
//.withListeners()
//.withSavedState()
.build();
You may also refer to the sample project on the link. I found it quite useful.
I currently have a button that when clicked an animation begins that shows a LinearLayout above the button. The LinearLayout is directly above it. In the xml file the LinearLayouts visibility is set to GONE. So when the button is clicked the visibility is set to VISIBLE. Then the animation begins. The animation is a slidedown animation. Everything works perfectly. But When the button is clicked the button jumps to the bottom of where the LinearLayout ends. Even though the LinearLayout is still going through the animation. How can I make the button move with the LinearLayout animation? I want everything to be a smooth transition. But the button jumps and it doesn't look very smooth.
LInearLayout Animation
<?xml version="1.0" encoding="utf-8"?>
<!-- slide down -->
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:fillAfter="true">
<scale
android:duration="500"
android:fromXScale="1.0"
android:fromYScale="0.0"
android:interpolator="#android:anim/linear_interpolator"
android:toXScale="1.0"
android:toYScale="1.0" />
</set>
I just ran into a very similar situation today.
I used a custom animation that re sizes the view.
The required height is measured and saved. Initially the height is set to 0 and it grows as the animation goes on. Finally it reaches the measured height and then it is set to wrap content as it was originally.
public static void expand(final View v) {
v.measure(LayoutParams.FILL_PARENT, LayoutParams.WRAP_CONTENT);
final int targetHeight = v.getMeasuredHeight();
v.getLayoutParams().height = 0;
v.setVisibility(View.VISIBLE);
Animation a = new Animation()
{
#Override
protected void applyTransformation(float interpolatedTime, Transformation t) {
v.getLayoutParams().height = interpolatedTime == 1
? LayoutParams.WRAP_CONTENT
: (int)(targetHeight * interpolatedTime);
v.requestLayout();
}
#Override
public boolean willChangeBounds() {
return true;
}
};
// 1dp/ms
a.setDuration((int)(targetHeight / v.getContext().getResources().getDisplayMetrics().density));
v.startAnimation(a);
}
v should be the LinearLayout you would like to animate.
You can choose a fixed time duration if you preffer.
source: https://stackoverflow.com/a/13381228/1646326
Use custom animation, it's very easy you can change whatever you want in applytransformation,
interpolatedTime - this is current position like in % from start to end animation (and has float value from 0 to 1, so here using this interpolatedTime you can iterate anything you can imagine) ;)
static class HeightAnimation extends Animation{
private View view;
private int mViewHeightFrom;
private int mViewHeightTo;
public HeightAnimation(View view, int heightFrom, int heightTo){
this.view = view;
this.mViewHeightFrom = heightFrom;
this.mViewHeightTo = heightTo;
}
#Override
protected void applyTransformation(float interpolatedTime, Transformation t) {
RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, (int)((mViewHeightTo - mViewHeightFrom)*interpolatedTime+0.5));
view.setLayoutParams(params);
}
#Override
public boolean willChangeBounds() {
return true;
}
#Override
public boolean isFillEnabled() {
return true;
}
}
and the usage:
public static void applyAnimationHeightTransformation(Context context, View view, int viewHeightFrom, int viewHeightTo, int duration, int animationOffsetMilisec){
HeightAnimation anim = new HeightAnimation(view, viewHeightFrom, viewHeightTo);
anim.setStartOffset(animationOffsetMilisec);
anim.setDuration(duration);
//anim.setInterpolator(new OvershootInterpolator()); // here interpolators can be used
if(view != null) {
view.setAnimation(anim);
view.startAnimation(anim);
}
}
for height to make easier using - use values in dp via transform to pixels:
public static int dpToPx(int dp) {
return (int)(TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, dp, YourApplication.getMainContext().getResources().getDisplayMetrics()));
}