Advanced Android - Ken Burns effect



when you watching TV programs like documentary films, you notice that in some scenes, a photo was zooming carefully. This technology is called Ken Burns effect

Example

This example demostrate about how to integrate Android Ken Burns effect.

Step 1 − Create a new project in Android Studio, go to File ⇒ New Project and fill all required details to create a new project.

Step 2 − Add the following code to res/layout/activity_main.xml.

Here abcd indicates the logo of tutorialspoint.com
<?xml version = "1.0" encoding = "utf-8"?>
<RelativeLayout xmlns:android = "http://schemas.android.com/apk/res/android"
   xmlns:tools = "http://schemas.android.com/tools"
   android:layout_width = "match_parent"
   android:layout_height = "match_parent"
   android:paddingBottom = "@dimen/activity_vertical_margin"
   android:paddingLeft = "@dimen/activity_horizontal_margin"
   android:paddingRight = "@dimen/activity_horizontal_margin"
   android:paddingTop = "@dimen/activity_vertical_margin"
   tools:context = ".MainActivity">
   <com.flaviofaria.kenburnsview.KenBurnsView
      android:id = "@+id/image"
      android:layout_width = "match_parent"
      android:layout_height = "wrap_content"
      android:src = "@drawable/abcd" />
</RelativeLayout>

Step 3 − Add the following code to src/MainActivity.java

package myapplication.example.com.myapplication;

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.Menu;
import android.view.MenuInflater;
import android.view.MenuItem;
import android.view.animation.AccelerateDecelerateInterpolator;
import android.widget.Toast;

import com.flaviofaria.kenburnsview.KenBurnsView;
import com.flaviofaria.kenburnsview.RandomTransitionGenerator;
import com.flaviofaria.kenburnsview.Transition;


public class MainActivity extends AppCompatActivity {
   private KenBurnsView kenBurnsView;
   private boolean isPlay = true;
   
   @Override
   protected void onCreate(Bundle savedInstanceState) {
      super.onCreate(savedInstanceState);
      setContentView(R.layout.activity_main);
      kenBurnsView = (KenBurnsView) findViewById(R.id.image);
      
      AccelerateDecelerateInterpolator ACCELERATE_DECELERATE = new 
         AccelerateDecelerateInterpolator();
         
      RandomTransitionGenerator generator = new 
         RandomTransitionGenerator(5000, ACCELERATE_DECELERATE);
         
      kenBurnsView.setTransitionGenerator(generator); 
      //set new transition on kenburns view 
      
      kenBurnsView.setTransitionListener(onTransittionListener());
   } 
   
   private KenBurnsView.TransitionListener onTransittionListener() {
      return new KenBurnsView.TransitionListener() {
         @Override
         public void onTransitionStart(Transition transition) {
            Toast.makeText(MainActivity.this, "start", Toast.LENGTH_SHORT).show();
         } 
         @Override
         public void onTransitionEnd(Transition transition) {
            Toast.makeText(MainActivity.this, "end", Toast.LENGTH_SHORT).show();
         } 
      }; 
   } 
   
   @Override
   public boolean onCreateOptionsMenu(Menu menu) {
      MenuInflater inflater=getMenuInflater();
      inflater.inflate(R.menu.menu_main, menu);
      return true;
   } 
   
   @Override
   public boolean onOptionsItemSelected(MenuItem item) {
      if (item.getItemId() == R.id.play) {
         if (isPlay) {
            kenBurnsView.pause();
            isPlay = false;
         } else { 
            kenBurnsView.resume();
            isPlay = true;
         } 
      }
      return super.onOptionsItemSelected(item);
   }
}

Step 4 − Add the following code to menu_main.xml

<?xml version = "1.0" encoding = "utf-8"?>
<menu xmlns:android = "http://schemas.android.com/apk/res/android" 
   xmlns:app = "http://schemas.android.com/apk/res-auto">
   <item
      android:id = "@+id/play" 
      android:title = "@string/app_name"
      app:showAsAction = "always" />
</menu>

Step 5 − Add the following code to build.gradle.

dependencies {
   compile fileTree(dir: 'libs', include: ['*.jar'])
   testCompile 'junit:junit:4.12'
   compile 'com.android.support:appcompat-v7:24.2.1'
   compile 'com.flaviofaria:kenburnsview:1.0.6'
}

Step 6 − No need to change manifest.xml

Let's try to run your application. I assume you have connected your actual Android Mobile device with your computer. To run the app from android studio, open one of your project's activity files and click Run Eclipse Run Icon icon from the toolbar. Select your mobile device as an option and then check your mobile device which will display your default screen −

Ken Burn
Advertisements