Android spring animation example using facebook rebound animation

   Facebook rebound project is giving support for android studio so decided to rewrite file for eclipse
    You can go through the original lib http://facebook.github.io/rebound/ here .
   But if you are eclipse user and need support for this you can download  this library 
    FacebookReboundForEclipse from here.


Press and release the photo to toggle a Spring from zero to one and observe the spring model drive a scaling animation. This demo is built using a JavaScript port of Rebound.

Press and Hold
 
 


   ---- sample Activity will look like 

  public class MainActivity extends Activity {
  private final BaseSpringSystem mSpringSystem = SpringSystem.create();
  private final ExampleSpringListener mSpringListener = new ExampleSpringListener();
  private FrameLayout mRootView;
  private Spring mScaleSpring;
  private View mImageView;


  @Override
  public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);

    setContentView(R.layout.main);
    mRootView = (FrameLayout) findViewById(R.id.root_view);
    mImageView = mRootView.findViewById(R.id.image_view);

    // Create the animation spring.
    mScaleSpring = mSpringSystem.createSpring();

    // Add an OnTouchListener to the root view.
    mRootView.setOnTouchListener(new View.OnTouchListener() {
      @Override
      public boolean onTouch(View v, MotionEvent event) {
        switch (event.getAction()) {
          case MotionEvent.ACTION_DOWN:
            // When pressed start solving the spring to 1.
            mScaleSpring.setEndValue(1);
            break;
          case MotionEvent.ACTION_UP:
          case MotionEvent.ACTION_CANCEL:
            // When released start solving the spring to 0.
            mScaleSpring.setEndValue(0);
            break;
        }
        return true;
      }
    });
  }

  @Override
  public void onResume() {
    super.onResume();
    // Add a listener to the spring when the Activity resumes.
    mScaleSpring.addListener(mSpringListener);
  }

  @Override
  public void onPause() {
    super.onPause();
    // Remove the listener to the spring when the Activity pauses.
    mScaleSpring.removeListener(mSpringListener);
  }

  private class ExampleSpringListener extends SimpleSpringListener {
    @Override
    public void onSpringUpdate(Spring spring) {
      // On each update of the spring value, we adjust the scale of the image view to match the
      // springs new value. We use the SpringUtil linear interpolation function mapValueFromRangeToRange
      // to translate the spring's 0 to 1 scale to a 100% to 50% scale range and apply that to the View
      // with setScaleX/Y. Note that rendering is an implementation detail of the application and not
      // Rebound itself. If you need Gingerbread compatibility consider using NineOldAndroids to update
      // your view properties in a backwards compatible manner.
      float mappedValue = (float) SpringUtil.mapValueFromRangeToRange(spring.getCurrentValue(), 0, 1, 1, 0.5);
      mImageView.setScaleX(mappedValue);
      mImageView.setScaleY(mappedValue);
    }
  }  
    
-----layout of this file look like.

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
             android:id="@+id/root_view"
             android:orientation="vertical"
             android:layout_width="fill_parent"
             android:layout_height="fill_parent"
  >
  <ImageView
    android:id="@+id/image_view"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:src="@drawable/landscape"
    android:scaleType="centerCrop"
    />
  <com.facebook.rebound.ui.SpringConfiguratorView
    android:id="@+id/spring_configurator"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="bottom"
    />
</FrameLayout>


Previous
Next Post »