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
Animated SVG Drawing for Android

AnimatedSvgView Animated SVG Drawing for Android Usage Get SVG path data and add it to a string array: <string-array name="google_glyph_strings"> <i

Jared Rummler 2k Dec 12, 2022
ExpandableSelector is an Android library created to show a list of Button/ImageButton widgets inside a animated container which can be collapsed or expanded.

ExpandableSelector ExpandableSelector is an Android library created to show a list of Button/ImageButton widgets inside a animated container which can

Karumi 699 Nov 19, 2022
SmileyRating is a simple rating bar for android. It displays animated smileys as rating icon.

Smiley Rating SmileyRating is a simple rating bar for android. It displays animated smileys as rating icon. Drawn completely using android canvas Insp

Sujith Niraikulathan 1.1k Dec 22, 2022
View that imitates Ripple Effect on click which was introduced in Android L (for Android 2.3+)

RippleView View that imitates Ripple Effect on click which was introduced in Android L. Usage For a working implementation, Have a look at the Sample

Muthuramakrishnan Viswanathan 1.2k Dec 30, 2022
A Tinder-like Android library to create the swipe cards effect. You can swipe left or right to like or dislike the content.

Swipecards Travis master: A Tinder-like cards effect as of August 2014. You can swipe left or right to like or dislike the content. The library create

Dionysis Lorentzos 2.3k Dec 9, 2022
Android StackBlur is a library that can perform a blurry effect on a Bitmap based on a gradient or radius, and return the result. The library is based on the code of Mario Klingemann.

Android StackBlur Android StackBlur is a library that can perform a blurry effect on a Bitmap based on a gradient or radius, and return the result. Th

Enrique López Mañas 3.6k Dec 29, 2022
A TagView library for Android. Customize your own & Drag effect.

AndroidTagView An Android TagView library. You can customize awesome TagView by using this library. Screenshots Usage Step 1 Add below dependency in y

lujun 1.7k Dec 29, 2022
This is a android custom view , like a scratch card effect!

ScratchView This is a android custom view , like a scratch card effect! Last Update 采纳DearZack童鞋的优化思路,把计算擦除面积比例的操作放在手指离开屏幕时,以降低对CPU的占用。 Articles Scrat

D_clock爱吃葱花 316 Nov 29, 2022
This is a picker view for android , support linkage effect, timepicker and optionspicker.(时间选择器、省市区三级联动)

Android-PickerView English Document 注意事项、详请使用方式、更新日志等,请查看 Wiki文档 Wiki文档,Wiki文档,Wiki文档 !~ 重要的事情说三遍 对于使用上有任何疑问或优化建议等,欢迎加入QQ群讨论交流技术问题。 交流群1: 387051294(推荐

Bigkoo 13.2k Jan 6, 2023
Simple and fantastic wheel view in realistic effect for android.

Overview ![Size](https://img.shields.io/badge/Size-17 KB-e91e63.svg) Contact Preview Demo WheelPicke.APK Include Compile compile 'cn.aigestudio.wheelp

Aige 2.5k Jan 6, 2023
JetCompose - Blur Effect in Android 12 with motion layout carousel

JetCompose Blur Effect in Android 12 with motion layout carousel

Vikas Singh 4 Jul 27, 2022
Glass-break effect for views

BrokenView Glass-break effect for views. Demo Download APK Usage Android Studio dependencies { compile 'com.zys:brokenview:1.0.3' } Eclipse Just pu

null 858 Jan 6, 2023
Pop animation with circular dust effect for any view updation

Popview-Android Pop animation with circular dust effect for any view updation Getting Started In your build.gradle dependencies { compile 'rb.popv

R B Krishna 489 Dec 28, 2022
An Index Side Bar With Wave Effect

WaveSideBar You can use WaveSideBar in the contacts page of your application. Refer to AlexLiuSheng/AnimSideBar. Screenshot Include the WaveSideBar to

郭佳哲 1.3k Dec 12, 2022
Squishy button effect with kotlin

Squishy Usage Add squishy() modifier on your composable element. Text( text = "Squishhhhyyyyy", modifier = Modifier .size(200.dp, 100.dp

null 43 Jul 9, 2022
Android library used to create an awesome Android UI based on a draggable element similar to the last YouTube graphic component.

Draggable Panel DEPRECATED. This project is not maintained anymore. Draggable Panel is an Android library created to build a draggable user interface

Pedro Vicente Gómez Sánchez 3k Dec 6, 2022
TourGuide is an Android library that aims to provide an easy way to add pointers with animations over a desired Android View

TourGuide TourGuide is an Android library. It lets you add pointer, overlay and tooltip easily, guiding users on how to use your app. Refer to the exa

Tan Jun Rong 2.6k Jan 5, 2023
Bubbles for Android is an Android library to provide chat heads capabilities on your apps. With a fast way to integrate with your development.

Bubbles for Android Bubbles for Android is an Android library to provide chat heads capabilities on your apps. With a fast way to integrate with your

Txus Ballesteros 1.5k Jan 2, 2023
A new canvas drawing library for Android. Aims to be the Fabric.js for Android. Supports text, images, and hand/stylus drawing input. The library has a website and API docs, check it out

FabricView - A new canvas drawing library for Android. The library was born as part of a project in SD Hacks (www.sdhacks.io) on October 3rd. It is cu

Antwan Gaggi 1k Dec 13, 2022