Android ImageViews animated by Ken Burns Effect

Overview

KenBurnsView

Android library that provides an extension to ImageView that creates an immersive experience by animating its drawable using the Ken Burns Effect.

Example Image

Overview

KenBurnsView provides the following advantages:

  • Control: you can change the duration and the interpolator of transitions and pause/resume them. You can also listen to events like onTransitionStart() and onTransitionEnd();
  • Highly extensible: you can define how the rectangles to be zoomed and panned will be generated;
  • Libs friendly: since KenBurnsView is a direct extension of ImageView, it seamlessly works out of the box with your favorite image loader library;
  • Easy to use: you can start using it right away. All you need to do is to drop the JAR file into your project and replace ImageView elements in your XML layout files by com.flaviofaria.kenburnsview.KenBurnsView ones.

Changelog

Latest version: 1.0.7

Gradle integration

If you're using Gradle, you can declare this library as a dependency:

dependencies {
    compile 'com.flaviofaria:kenburnsview:1.0.7'
}

Basic usage

For a working implementation, see the sample/ folder.

The simplest way to use KenBurnsView is by dropping the library JAR file into your project adding a view to an XML layout file:

<com.flaviofaria.kenburnsview.KenBurnsView
    android:id="@+id/image"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:src="@drawable/your_drawable" />

Advanced usage

  1. You can set a listener to your view:
KenBurnsView kbv = (KenBurnsView) findViewById(R.id.image);
kbv.setTransitionListener(new TransitionListener() {
    @Override
    public void onTransitionStart(Transition transition) {

    }
    @Override
    public void onTransitionEnd(Transition transition) {

    }
});
  1. You can pause the animation by calling kbv.pause() and resume it by calling kbv.resume();

  2. You can change the duration and the interpolator of transitions:

RandomTransitionGenerator generator = new RandomTransitionGenerator(duration, interpolator);
kbv.setTransitionGenerator(generator);
  1. If you're willing to have even more control over transitions, you can implement your own TransitionGenerator.

Questions

You can ask any question on Stack Overflow using the android-kenburnsview tag.

License

Apache Version 2.0

Comments
  • IncompatibleRatioException being thrown with RandomTransitionGenerator

    IncompatibleRatioException being thrown with RandomTransitionGenerator

    Hi,

    When using your lib, it's crashing at com.flaviofaria.kenburnsview.Transition. (Transition.java:53)

    I saw it's because of an exception you throw, but I'd like to know where it comes from exactly and maybe how to fix it.

    bug 
    opened by quentin23soleil 26
  • RandomTransitionGenerator gets outside of image's content sometimes, or does too much zooming sometimes

    RandomTransitionGenerator gets outside of image's content sometimes, or does too much zooming sometimes

    I'm trying to have a POC project that has the following features:

    • fading action bar, using this library: https://github.com/flavienlaurent/NotBoringActionBar
    • imageView that change their sizes in parallel (top and bottom) , as you scroll.
    • the imageViews are actually KenBurnsView, and they switch between multiple images that might be from the Internet.
    • all in fragments and action-bar-navigation is supported.

    here's the project: https://drive.google.com/file/d/0B_nrUhQ0MIgwUGZ3cjJwZVpVbkU/

    the problem is that even though everything works , the RandomTransitionGenerator sometimes go outside of the content of the image being shown, so empty area is shown too. Also, sometimes, the zoom factor gets really large. of course, I had to change some stuff on both libraries in order for this to work, but most of the code remained intact.

    bug 
    opened by AndroidDeveloperLB 18
  • Starts outside the imageboundries

    Starts outside the imageboundries

    Sometimes the transitioning starts outside of the image boundries, not in the center, this results in white borders being showed. Is there is any way to fix this or is this a known bug and is there a bugfix for it in the works?

    opened by ghost 8
  • Changing current drawable

    Changing current drawable

    I am using your lib from yesterday, and I'm loving it! ;)

    There's just one thing I can't get rid of: When I start with one image, and it's already animating, then I call my image loading library to load another one from web, and the result of network call is a drawable with different size. Then KenBurnsView zooms out or in from the previous drawable rectangle to the new rectangle, to get max rectangle size to fill the viewport. The problem is that I don't want that zoom - I want to have my new drawable in imageView instantly panning left and right (beacuse that's how I set my transition generator), in its own drawable size, and foget about old rectangle. I just can't get rid of that initial zoom in my transistion generator.

    bug 
    opened by bgorkowy 8
  • Ripple effect on Buttons placed over KenBurnsView doesn't work

    Ripple effect on Buttons placed over KenBurnsView doesn't work

    I have the KenBurnsView and a button over it in a FrameLayout. Now, I am using a Ripple Effect on the button when clicked.

    Previously before using KenBurnsView (I just had a simple ImageView) the ripple used to draw over the ImageView.

    But now as I replaced the ImageView with this, the ripple draws below it. How can this be solved?

    opened by aritraroy 5
  • Suggestion: freeze / unfreeze view

    Suggestion: freeze / unfreeze view

    I stumbled upon some errors while I'm performing ObjectAnimator animations on kenburnsview, mainly, I was expanding/collapsing the view. Each time the height field changed, the image view was stuttering, reloading the image or transition on it. I always got IncompatibleRatioException: can't perform effect on rects with distinct aspect ratios. I tried to resolve it by setting the image to null, then by setting the transition generator to null (but that didn't work so instead I set it to a new generator with method to return; immediately without calculations, but that also crashed for another reason, because the library needs values from that method).

    Eventually I thought about suggesting a method which freezes the layout so that no calculations or redraws are done. This is helpful in advanced situations such as collapsing/expanding/animating the bounds of kenburnsview, even with height/width of zero. Of course, an unfreeze method after animations are completed.

    opened by usernotnull 4
  • KenBurnsView disable backpress.

    KenBurnsView disable backpress.

    I just realise adding KenBurnsView at my activity will cause the phone physical back button stop working.

    Override onBackPressed() no response as well.

    opened by DoubleTime 4
  • OutOfMemoryError

    OutOfMemoryError

    Hi,

    We are getting OutOfMemoryError very frequently while loading bitmap from KenBurnsView library. Here is the complete error logcat:

    java.lang.OutOfMemoryError at android.graphics.BitmapFactory.nativeDecodeAsset(BitmapFactory.java) at android.graphics.BitmapFactory.decodeStream(BitmapFactory.java:677) at android.graphics.BitmapFactory.decodeResourceStream(BitmapFactory.java:507) at android.graphics.drawable.Drawable.createFromResourceStream(Drawable.java:872) at android.content.res.Resources.loadDrawable(Resources.java:3054) at android.content.res.Resources.getDrawable(Resources.java:1613) at android.widget.ImageView.resolveUri(ImageView.java:648) at android.widget.ImageView.setImageResource(ImageView.java:377) at com.flaviofaria.kenburnsview.KenBurnsView.setImageResource(KenBurnsView.java:125)

    Can you tell me the root cause? It seems that bitmap is not getting recycled as soon as the Activity killed by OS. Somehow bitmap remains in memory.

    Thanks, Sanjay

    opened by sanjay-tinyowl 4
  • Pausing the KenBurnsView animaiton makes the image inside too small

    Pausing the KenBurnsView animaiton makes the image inside too small

    When the animation plays, its perfectly fine. But when I use view.pause() then the animations stops but the image becomes very small in size.

    How can this problem be solved? I need to give the users a way to stop the animation of this View if they want to.

    opened by aritraroy 4
  • When window is resized IncompatibleRatioException is thrown.

    When window is resized IncompatibleRatioException is thrown.

    Here is a temporary dirty fix but it takes a second to adjust:

    RandomTransitionGenerator.java
    try {
        mLastGenTrans = new Transition(srcRect, dstRect, mTransitionDuration,
            mTransitionInterpolator);
    } catch (IncompatibleRatioException e) {
    // Most likely the window was resized.
    srcRect = generateRandomRect(drawableBounds, viewport);
    mLastGenTrans = new Transition(srcRect, dstRect, mTransitionDuration,
            mTransitionInterpolator);
    }
    
    opened by jaredrummler 4
  • haveSameAspectRatio

    haveSameAspectRatio

    I had a weird crash when I rotated my tablet several times with the view enabled. I have pinpointed it to the MathUtils.haveSameAspectRatio() function, and the truncation...

    If my previous destRect had a ratio of 0.637 and my new viewPort has a rect ratio of 0.625 The function will say that the viewPortRatio has not changed. (even if we can tell right now that the difference between the two is more than 0.01)

    If the random rect generator, provided with a viewport with a 0.625 ratio then returns a rect with a ratio of 0.624999, this will raise the IncompatibleRatioException in the Transition constructor.

    I believe the truncating is not that good of an idea when you are comparing the aspect ratios. Imho, it should at least be one decimal further than the comparison itself.

    opened by alaeri 3
  • Implied READ_PHONE_STATE permission

    Implied READ_PHONE_STATE permission

    Hi,

    Encountered an issue when trying to upload a new build of an app to Google Play Console:

    New permissions added Warning:

    Users that have the APK with version code XX may need to accept the android.permission.READ_PHONE_STATE permission, which may result in them not upgrading to this version of the app.

    Tip:

    Ensure that the new permissions are necessary, and consider mentioning these permissions in the What's new in this release text.

    Since this is a permission I did not explicitly add I investigated the AndroidManifest.xml of my app and Google was right.

    The manifest merger report stated:

    uses-permission#android.permission.READ_PHONE_STATE IMPLIED from /Users/jesper/Developer/_android/iap-core-android/app/src/main/AndroidManifest.xml:2:1-18:12 reason: com.flaviofaria.kenburnsview has a targetSdkVersion < 4

    I'd imagine this is unintended and would love to have a fix for where the targetSdkVersion is 4 or higher.

    Note for anyone else having this issue, there is a quickfix: <uses-permission android:name="android.permission.READ_PHONE_STATE" tools:node="remove"/>

    opened by liljeblad 0
  • I'm having Problem in with KenBurnsView and viewpager.

    I'm having Problem in with KenBurnsView and viewpager.

    My scenario is actually i'm using this kenBurnsView in collapsing toolbar and bellow collapsing toolbar i have viewpager and tablayout. I'm changing the image as

    mViewPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {
                @Override
                public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
                    changeHeaderImage(position);
                }
    

    the problem is when i touch the screen for swiping viewpager image moves arbitrarily until i stop touching it.

    opened by chnouman 0
  • Getting Binary XML file line #0 error.

    Getting Binary XML file line #0 error.

    Unable to start activity as it giving RuntimeException plus Error in inflating class com.flaviofaria.kenburnsview.KenBurnsView. Error caused by android.view.InflateException.

    Please resolve.

    opened by DivanshuR 1
  • Does not play well if KenBurnsView size is changing

    Does not play well if KenBurnsView size is changing

    I was playing with this but found when the KenBurnsView size is being animated (I'm actually animating the weight of other views which is causing the KenBurnsView to resize) it goes kind of crazy. It seems the drawing does not take into account the fact that the KenBurnsView size has changed between frames :-(

    opened by burningthumb 3
Owner
Flávio Faria
Previously at @Zwift, @Winnin and Dot Legend.
Flávio Faria
Allows the easy creation of animated transition effects when the state of Android UI has changed

android-transition Android-Transition allows the easy creation of view transitions that reacts to user inputs. The library is designed to be general e

Kai 615 Nov 14, 2022
DuGuang 1k Dec 14, 2022
Extended Android Tab Layout with animated indicators that have continuous feedback.

Dachshund Tab Layout Introduction Boosted Android Tab Layout with custom animated indicators including "Dachshund" animation inspired by this. Sample

Andrii 859 Nov 10, 2022
A simple animated step view for Android

StepView A simple animated step view for Android. Backward and forward animations is supported. Usage Add jcenter() to repositories block in your grad

Bogdan Kornev 833 Dec 30, 2022
Simple android library to present an animated ferris wheel

Ferris Wheel View Overview An Android Library used to implement an animated Ferris Wheel in android. API SDK 15+ Written in Kotlin Supports landscape

Igor Lashkov 318 Dec 7, 2022
How to improve the user experience using animated icons with vector drawables on Android

Android Animated Icons How to improve the user experience using animated icons with vector drawables on Android English version https://medium.com/@an

André Mion 116 Nov 25, 2022
Android animated recording view

AnimatedRecordingView Android animated recording view .中文版 Preview Gradle compile 'com.haozhang.libary:android-animated-recording-view:1.0' How to use

Hand Zhang 348 Nov 16, 2022
This a demo application with animated SVG animation of Smiley

Animated-Smiley-Rating Animated Customer feedback and rating UI ?? License Copyright 2021 Aiman Muzafar Licensed under the Apache License, Version 2.0

Aiman Muzafar 12 Aug 12, 2021
🍭🚀💗 Tutorials about animations with Animators, Animated Vector Drawables, Shared Transitions, and more

?????? Tutorials about animations with Animators, Animated Vector Drawables, Shared Transitions, and more

Smart Tool Factory 696 Dec 28, 2022
Animated-splash-screen - Animate your Splash Screen using Lottie files.

Animated Splash Screen This small project shows how you can add animation into your android projects or create beautiful looking Splash Screen or Laun

Aashish Ace 0 Jan 2, 2022
Backarrow-animation-example - Animate back arrow to close button in Compose using animated drawables

Animate Back Arrow to Close Icon in Compose This is a simple demo for animated v

Jose Mateo 3 Feb 17, 2022
Custom-view-animated-file-downloader - Custom Views, Animations, Broadcast Receivers, Notifications

Downloader App Custom views , Drawing with Canvas, Animations (with motionlayout

null 2 Jun 24, 2022
Animated LazyColumn/LazyRow

Animated LazyColumn/LazyRow POC of how you can animate LazyColumn/LazyRow insertions/deletions/moving Note, this is not production ready or a library,

Roudi Korkis Kanaan 33 Dec 24, 2022
A program that converts an SGF-file to an animated GIF a la Hayauchi Super Igo style.

sgf2gif A program that converts an SGF-file to an animated GIF. The animated GIF is highly inspired by the classic game Hayauchi Super Igo for NES. Us

null 12 Jul 6, 2022
A component for flip animation on Android, which is similar to the effect in Flipboard iPhone/Android

android-flip Aphid FlipView is a UI component to accomplish the flipping animation like Flipboard does. A pre-built demo APK file for Android OS 2.2+

Bo 2.8k Dec 21, 2022
Android L Ripple effect wrapper for Views

Material Ripple Layout Ripple effect wrapper for Android Views Including in your project compile 'com.balysv:material-ripple:1.0.2' Check for latest v

Balys Valentukevicius 2.3k Dec 29, 2022
Implementation of Ripple effect from Material Design for Android API 9+

RippleEffect ExpandableLayout provides an easy way to create a view called header with an expandable view. Both view are external layout to allow a ma

Robin Chutaux 4.9k Dec 30, 2022
EtsyBlur is an Android library that allows developers to easily add a glass-like blur effect implemented in the Etsy app.

EtsyBlur EtsyBlur is an Android library that allows developers to easily add a glass-like blur effect implemented in the past Etsy app. Try out the sa

Manabu S. 755 Dec 29, 2022
[] Easily have blurred and transparent background effect on your Android views.

##[DEPRECATED] BlurBehind Easily have blurred and transparent background effect on your Android views. Before API level 14 there was a Window flag cal

Gokberk Ergun 516 Nov 25, 2022