Skip to content

Instantly share code, notes, and snippets.

@wislon
Last active August 29, 2015 14:15
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save wislon/a571feb66eaab29dab0f to your computer and use it in GitHub Desktop.
Save wislon/a571feb66eaab29dab0f to your computer and use it in GitHub Desktop.
Animation code samples
<?xml version="1.0" encoding="utf-8" ?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<alpha android:fromAlpha="0.0" android:toAlpha="1.0" android:duration="1000" />
</set>
<?xml version="1.0" encoding="utf-8" ?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<alpha android:fromAlpha="1.0" android:toAlpha="0.0" android:duration="1000" />
</set>
<?xml version="1.0" encoding="utf-8" ?>
<set
xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/overshoot_interpolator">
<translate android:fromYDelta="100%" android:toYDelta="0%" android:fillAfter="true" android:duration="750"/>
<alpha android:fromAlpha="0.0" android:toAlpha="1.0" android:duration="750" />
</set>
<?xml version="1.0" encoding="utf-8" ?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate android:fromYDelta="0%" android:toYDelta="100%" android:fillAfter="true" android:duration="750"/>
<alpha android:fromAlpha="1.0" android:toAlpha="0.0" android:duration="750" />
</set>
void RunFinalAnimation()
{
// uses our custom ViewExtensions.BringViewInWithAnimation with inAnimation
// defined as inAnimation = AnimationUtils.LoadAnimation(Activity, Resource.Animation.bottom_slide_in);
relativeLayout.BringViewInWithAnimation(inAnimation);
// 'fluent' animation of an image view. moves it verrtically upwards by 110dip while
// shrinking it by 10%, over 750ms. Sort of like star wars intro scrolling text
imgNavBarLogo.Animate()
.TranslationYBy(-110f)
.ScaleXBy(-0.1f)
.ScaleYBy(-0.1f)
.SetDuration(750)
.Start();
// fades the textview out to complete transparency over 750ms
textView.Animate().Alpha(0f).SetDuration(750).Start();
textView.Visibility = ViewStates.Gone; // yes, we can use WithEndAction too...
// shrinks a cardview vertically, top and bottom squeeze toward middle, as if it's in a vice.
// ValueAnimator scaleAnimator = ValueAnimator.OfFloat(new[] {1f, 0f});
// scaleAnimator.SetDuration(2000);
// scaleAnimator.Update += (sender, args) =>
// {
// cardview.ScaleY = (float) args.Animation.AnimatedValue;
// };
// scaleAnimator.Start();
// shrinks a cardview vertically, top stays where it is, bottom moves towards top, kind of like a roll-up
// ScaleAnimation scale = new ScaleAnimation((float)1.0, (float)1.0, (float)1.0, (float)0.5)
// {
// FillAfter = true,
// Duration = 1000,
// };
// cardview.StartAnimation(scale);
// code to get window width just pasted here for clarity
var size = new Point();
Activity.WindowManager.DefaultDisplay.GetSize(size);
windowWidth = size.X;
// slides the cardview off screen, left to right, over 2500ms (takes a while)
// and then collapses the space it took up
cardview.Animate()
.TranslationXBy(windowWidth)
.SetDuration(2500)
.SetStartDelay(3000)
.WithEndAction(new Runnable(() =>
{
cardview.Visibility = ViewStates.Gone;
}))
.Start();
}
using Android.Content;
using Android.Views;
using Android.Views.Animations;
namespace Mobile.Droid.Extensions
{
// invoke with anyView.BringViewInWithAnimation/TakeViewOutWithAnimation
// where animation param is predefined animations from xml, code, etc.
// e.g. inAnimation = AnimationUtils.LoadAnimation(Activity, Resource.Animation.bottom_slide_in);
public static class ViewExtensions
{
/// <summary>
/// Bring view on to screen. You may need to enable the 'RunOnUiThread' depending
/// on where you're calling this from
/// </summary>
/// <param name="viewToAnimate">the view</param>
/// <param name="animation"></param>
public static void BringViewInWithAnimation(this View viewToAnimate, Animation animation)
{
//RunOnUiThread(() =>
//{
animation.Interpolator = new OvershootInterpolator(1.0f);
viewToAnimate.Visibility = ViewStates.Visible;
viewToAnimate.StartAnimation(animation);
//});
}
/// <summary>
/// Take view out of screen. You may need to enable the 'RunOnUiThread' depending
/// on where you're calling this from
/// </summary>
/// <param name="viewToAnimate">the view</param>
/// <param name="animation"></param>
public static void TakeViewOutWithAnimation(this View viewToAnimate, Animation outAnimation)
{
//RunOnUiThread(() =>
//{
viewToAnimate.BringToFront();
outAnimation.Interpolator = new AccelerateInterpolator();
viewToAnimate.StartAnimation(outAnimation);
viewToAnimate.Visibility = ViewStates.Gone;
// });
}
/// <summary>
/// 'Pop' view out from nothing (or whatever you had it scaled to, before)
/// </summary>
/// <param name="viewToAnimate">the view</param>
/// <param name="animation"></param>
public static ViewPropertyAnimator WormholeEnter(this View viewToAnimate, float maxScale)
{
return viewToAnimate.Animate()
.ScaleX(maxScale)
.ScaleY(maxScale)
.SetDuration(500)
.WithEndAction(new Runnable(() => viewToAnimate.Visibility = ViewStates.Visible));
}
/// <summary>
/// View disappears (or visibly shrinks) down to whatever you scale it to, and then disappears.
/// Designed to pull views off-screen
/// </summary>
/// <param name="viewToAnimate">the view</param>
/// <param name="animation"></param>
public static ViewPropertyAnimator WormholeExit(this View viewToAnimate)
{
return viewToAnimate.Animate()
.ScaleX(0f)
.ScaleY(0f)
.SetDuration(500)
.WithEndAction(new Runnable(() => viewToAnimate.Visibility = ViewStates.Gone));
}
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment