Create scanning animation using android studio

scan animation android github
move animation in android
android path animation example
android animation xml generator
android animate view from one position to another
translate animation android
android transition animation example
types of animation in android

i'm having troubles creating a scanning animation on my android application.For instance, i have come across this application 'Fingerprint love scanner prank' which has the scanning animation and i would like to implement the same on my android app. I have tried to implement the same on my android application but in vain. This is my android code snippet.

Animation.Java Activity

          scan.setOnTouchListener(new View.OnTouchListener() {
                @Override
                public boolean onTouch(View view, MotionEvent motionEvent) {


                    final CountDownTimer start = new CountDownTimer(4000, 1000) {

                        public void onTick(long millisUntilFinished) {
                            scanner.setVisibility(View.VISIBLE);
                            anim1 = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.progress);
                            scanner.startAnimation(anim1);


                        }

                        public void onFinish() {

                            scanner.setVisibility(View.INVISIBLE);

                        }
                    }.start();
                    return false;
                }


            });

Animation.xml

Contains the scanner image defined by the imageView as shown below

<LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="40dp"
            android:id="@+id/scan"
            android:background="@drawable/bgscanner">

            <ImageView
                android:layout_width="100dp"
                android:layout_height="wrap_content"
                android:src="@drawable/scanner"
                android:id="@+id/scanner1"
                android:layout_marginTop="20dp"
                android:visibility="invisible"
                />
        </LinearLayout>

My Animation drawable

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:interpolator="@android:anim/linear_interpolator"
    android:fillAfter="true">

    <translate
        android:fromYDelta="0%p"
        android:toYDelta="75%p"
        android:duration="800"
        />
</set>

My big issue is, on touch event, the animation does not execute. That is, the image bar does not oscillate along the vertical axis. I kindly request any assistance from stackoverflow

Edited

This problem can be solved with a very small code.

First, change your XML animation code to this:

<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:interpolator="@android:anim/accelerate_decelerate_interpolator"
    android:fillAfter="false">

    <translate
        android:fromYDelta="0%p"
        android:toYDelta="100%p"
        android:duration="1000"
        android:repeatCount="infinite"
        android:repeatMode="restart"
        />
</set>

Your layout should be something like this:

<LinearLayout
        android:id="@+id/image"
        android:layout_width="200dp"
        android:layout_height="200dp"
        android:background="@mipmap/ic_launcher">

        <View
            android:id="@+id/bar"
            android:layout_width="200dp"
            android:layout_height="6dp"
            android:visibility="gone"
            android:background="@android:color/black"
            android:src="@mipmap/ic_launcher"/>
    </LinearLayout>

And in your activity, the code can be like this:

LinearLayout imageView = (LinearLayout) findViewById(R.id.image);
        final View bar = findViewById(R.id.bar);
        final Animation animation = AnimationUtils.loadAnimation(MainActivity.this, R.anim.anim);
        animation.setAnimationListener(new Animation.AnimationListener() {
            @Override
            public void onAnimationStart(Animation animation) {}

            @Override
            public void onAnimationEnd(Animation animation) {
                bar.setVisibility(View.GONE);
            }

            @Override
            public void onAnimationRepeat(Animation animation) {}
        });

        imageView.setOnTouchListener(new View.OnTouchListener() {
            @Override
            public boolean onTouch(View view, MotionEvent motionEvent) {
                bar.setVisibility(View.VISIBLE);
                bar.startAnimation(animation);
                return false;
            }
        });

And this way you are going to have this result:

I used a View instead of a ImageView to make the scan bar, but you can change the code to your needs.

I hope it helps!

EDIT 2:

If you want the animation to happen only if your image is pressed, change the code to this:

imageView.setOnTouchListener(new View.OnTouchListener() {
        @Override
        public boolean onTouch(View view, MotionEvent motionEvent) {
            if(motionEvent.getAction() == MotionEvent.ACTION_DOWN){
                bar.setVisibility(View.VISIBLE);
                bar.startAnimation(animation);
            } else if(motionEvent.getAction() == MotionEvent.ACTION_UP){
                bar.setVisibility(View.GONE);
                animation.cancel();
            }

            return false;
        }
    });

It you trigger the animation when the image is pressed (MotionEvent.ACTION_DOWN) and it is going to stop the animation when the image is released (MotionEvent.ACTION_UP)

Demonstrating an animation for scanning a fingerprint and showing , you may not use this file except in compliance with the License. xmlns:android​="http://schemas.android.com/apk/res/android" import android.animation. i'm having troubles creating a scanning animation on my android application.For instance, i have come across this application 'Fingerprint love scanner prank' which has the scanning animation and i

Instead of countDownTimer use value animator for the animation in onTouch listner.

scan.setOnTouchListener(new View.OnTouchListener() {
  @Override
  public boolean onTouch(View view, MotionEvent motionEvent) {
   if(motionEvent.getAction==MotionEvent.ACTION_DOWN){ 
     ValueAnimator valueAnimator=ValueAnimator.ofFloat(0,75);
     valueAnimator.setDuration(4000);
     valueAnimator.setInterpolator(new DecelerateInterpolator());
     valueAnimator.addListener(new Animator.AnimatorListener() {
        @Override
        public void onAnimationStart(Animator animation) {
           scanner.setVisibilty(View.VISIBLE);
        }
        @Override
        public void onAnimationEnd(Animator animation) {
            scanner.setVisibilty(View.INVISIBLE);
        }
        @Override
        public void onAnimationCancel(Animator animation) {
             scanner.setVisibilty(View.INVISIBLE);
        }
        @Override
        public void onAnimationRepeat(Animator animation) {
         }
        });
     valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener()      {
           @Override
           public void onAnimationUpdate(ValueAnimator animation) {
              float translate= (float) animation.getAnimatedValue();
              scanner.setTranslationY(translate);//translate scanner in Y direction
           }
       });
    valueAnimator.start();
   }
 return true;
}

Animate drawable graphics, Android provides a couple options for animating drawables. specify several static drawable files that will be displayed one at a time to create an animation. The second option is to use an Animated Vector Drawable, which lets Developer guides · Design guides · API reference · Samples · Android Studio. Learn how to create image scaling animation in the android studio.It uses Animation class. You can use this in any app to make your app attractive and beautiful. Get new tutorial every Sunday

Try this:

@Override
public boolean onTouch(View view, MotionEvent motionEvent) {

      final CountDownTimer start = new CountDownTimer(4000, 1000) {

     anim1 = AnimationUtils.loadAnimation(getApplicationContext(),
            R.anim.progress);

    // set animation listener
    anim1.setAnimationListener(this);

    // button click event
    scan.setOnClickListener(new View.OnClickListener() {

        @Override
        public void onTick(View v) {
            scanner.setVisibility(View.VISIBLE);

            // start the animation
            scanner.startAnimation(anim1);
        }            
    });

}
@Override
public void onAnimationEnd(Animation animation) {
    // Take any action after completing the animation

    // check for fade in animation
    if (animation == anim1) {
        Toast.makeText(getApplicationContext(), "Animation Stopped",
                Toast.LENGTH_SHORT).show();
    }

}

Move a View with Animation, On Android 4.4 (API level 19) and higher, you can use the transition framework to create animations when you swap the layout within the current  Animation Tutorial With Example In Android Studio. Property Animation API was introduced by Google in Android 3.0 which gives us the flexibility to change object properties over a certain time interval. The Animations Framework allows us to create visually attractive animations and transitions in our apps.

For animation on android , i advice you to use Animation Drawable , it's simple to implement : https://developer.android.com/reference/android/graphics/drawable/AnimationDrawable.html First steps to display a animation (Gif by example) , we split it to pngs (online by example i have use http://ezgif.com/ , then i apply the initialisation on xml drawable :

<!-- Animation frames are wheel0.png through wheel5.png
     files inside the res/drawable/ folder -->
 <animation-list android:id="@+id/selected" android:oneshot="false">
    <item android:drawable="@drawable/wheel0" android:duration="50" />
    <item android:drawable="@drawable/wheel1" android:duration="50" />
    <item android:drawable="@drawable/wheel2" android:duration="50" />
    <item android:drawable="@drawable/wheel3" android:duration="50" />
    <item android:drawable="@drawable/wheel4" android:duration="50" />
    <item android:drawable="@drawable/wheel5" android:duration="50" />
 </animation-list>

Finally i load it on my defined class :

// Load the ImageView that will host the animation and
 // set its background to our AnimationDrawable XML resource.
 ImageView img = (ImageView)findViewById(R.id.spinning_wheel_image);
 img.setBackgroundResource(R.drawable.spin_animation);

 // Get the background, which has been compiled to an AnimationDrawable object.
 AnimationDrawable frameAnimation = (AnimationDrawable) img.getBackground();

 // Start the animation (looped playback by default).
 frameAnimation.start();

Introduction to animations, Animation in android apps is the process of creating motion and shape change. The basic ways of animation that we'll look upon in this tutorial are: Fade In  To create a splash screen in android studio with animations we need to create some Java classes and some xml layout classes. So we need. Create a new Project in Android Studio; Change the style of an app to NoActionBar to remove Action Bar; Remove the title bar. Design the .xml file of first Activity for Splash Screen

change your animation to this

<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:interpolator="@android:anim/linear_interpolator"
    duration="4000"
    android:repeatMode="reverse"
    android:fillAfter="false">

    <translate
        android:fromYDelta="0%p"
        android:toYDelta="75%p"
        android:duration="800"/>
</set>

and your code

scan.setOnTouchListener(new View.OnTouchListener() {
                @Override
                public boolean onTouch(View view, MotionEvent motionEvent) {

                            scanner.setVisibility(View.VISIBLE);
                            anim1 = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.progress);
                            anim1.setAnimationListener(new Animation.AnimationListener() {
                                @Override
                                public void onAnimationStart(Animation animation) {

                                }

                                @Override
                                public void onAnimationEnd(Animation animation) {
                                scanner.setVisibility((View.INVISIBLE)
                                }

                                @Override
                                public void onAnimationRepeat(Animation animation) {

                                }
                            });
                            scanner.startAnimation(anim1);

                 }
            });

Android Animation Example, Android Shared Element Transition Animation · 72. In this tutorial, we'll be discussing and implementing the Barcode API present in the Google Mobile Vision API. 2.1 Configuring Android Studio for Barcode Library; 2.2 QR Code Scanner from To share and access the files created by other applications we need to add  Assalam o Alaikum Friends in this tutorial i will show you how to scan bar code or QR Code by Camera using Zxing Library in Android Studio. Zxing and Google Play Services Library

QR Code Scanner - Barcode Scanner for Android, Building an Animated QR Scanner Viewfinder - Like Whatsapp's SurfaceView is what you use to display the camera layer in Android. First, create you activity XML; you need a FrameLayout, as it allows it to a vector drawable using Android Studio's "Vector Asset Studio" you may use a PNG image. Creating scan barcode and QRcode programmatically in android example Step 1: Create a new project in Android Studio. When you are making new activity, select empty activity as a default activity. Step 2: Updating build.gradle(Module:app) file. Add following code into dependencies{} compile 'me.dm7.barcodescanner:zbar:1.8.4'

Building an Animated QR Scanner Viewfinder, Animation.xml. Contains the scanner image defined by the imageView as shown below <LinearLayout android:layout_width="wrap_content"  Hello friends, in this post I will discuss about how to create a barcode code detection program in Android Studio. So, this program will scan a barcode using a camera and will display the results. First, open Android Studio and create a new project. When done, go to dependencies section and enter the following libraries.

Create a scan animation using an Android studio, Android QR Code / Bar Code Scanner with examples of Activity and Intent, Fragments, Menu, Service, Create an activity_main.xml and add the following code. To make a scene transition animation between two activities that have more than one shared element, define the shared elements in both layouts with the android:transitionName attribute (or use the View.setTransitionName() function in both activities), and create an ActivityOptions object as follows:

Comments
  • Thanks Leandro ... it worked ... how can you make it to be continous
  • Do you mean make it repeat infinitely? Change the android:repeatCount=4 to android:repeatCount="infinite". If you want to show the animation only when the image is pressed, follow the EDIT 2
  • Fabulous! Thank You mate :)
  • let me try the above, Thanks for response
  • Now, the animation bar is getting off focus. It hides from the view on touch event
  • Still it is not working . What im i not doing?? Please assist. I'm really stuck
  • better describe your problem. Still it is not working isnt very helpfull
  • The animation bar still does not oscillate, it remains on the same position