Picture-in-Picture: Working in Android Oreo

From release of the Android O, which saw some exciting new additions for us to get our hands on! One of the most noticeable user-facing changes is the introduction of a picture in picture (PIP) option – similar to an Apple iPad feature added in iOS 9 – which should make multitasking easier in some circumstances.  PIP is a special type of multi-window mode mostly used for video playback. PIP mode is already available for Android TV; Android O makes the feature available on other Android devices. Let’s take a look at this exciting new feature and how we can implement it into our Android applications! To learn more about Picture-in-Picture I created a playground project to have a play with the new features. You can check this out for yourself here! What is Picture-In-Picture?Picture-in-Picture (PiP) allows you to keep videos open as they play on top of of another screen. This wouldn’t be the same as the multi-window feature which allows users to keep two apps open simultaneously, but instead…

Introduction to Spring Animation

When writing an application, it's important to consider exactly what your graphical demands will be. Varying graphical tasks are best accomplished with varying techniques. Android provides a variety of powerful APIs for applying animation to UI elements and drawing custom 2D and 3D graphics.
Dynamic-animation is a new module introduced in revision 25.3.0 of the Android Support Library. It provides a small set of classes for making realistic Physics-based Animations.

What is Physics-based Animation

Physics-based animation uses the fundamentals of physics to build animations. An animation is driven by force. The animation comes to rest when the force reaches equilibrium. The new set of animation APIs embeds physics to render a more natural-looking and flexible animation.

Spring Animation

Spring Animation is one of the animation API provided by the Dynamic-animation module. Physics-based animations are driven by force. Spring force, is one such force that guides interactivity and motion. In a spring-based animation, the value and the velocity are calculated based on the spring force that are applied on each frame.
To demonstrate, I am creating a simple app that animate a view with spring-based animation. Complete source code for the examples used in this tutorial is available on github.
Let’s start by creating a new project.

Creating New Project

Create a new project in Android Studio from File > New Project. When it prompts you to select the default activity, select Empty Activity and proceed.

Update Build Configuration

In order to use the physics-based support library, you must modify your app project's classpath dependencies within your development environment.
To add a support library to your application project:
  1. Open the build.gradle file of your application.
  2. Add the support library to the dependencies section.

Making a Spring Animation

Let’s start with how every Spring Animation is made.
  1. Create a SpringAnimation object for your View with a specified ViewProperty
  2. Create a SpringForce object and set your desired parameters
  3. Apply the created SpringForce to your SpringAnimation.
  4. Start the animation

Creating the Layout

So quickly create a layout with a ImageView placed center of the screen.

Create a SpringAnimation object

Open your MainActivity.java and create a method that returns SpringAnimation with SpringForce object and set your desired parameters. The method look like this:

Now create SpringAnimation objects for the ImageView.

Damping ratio The damping ratio describes a gradual reduction in a spring oscillation. By using the damping ratio, you can define how rapidly the oscillations decay from one bounce to the next.

Stiffness Stiffness defines the spring constant, which measures the strength of the spring. A stiff spring applies more force to the object that is attached when the spring is not at the rest position.

Drag the view. Springs back to its original position

Now we are going to drag the view around the screen and when it release the view springs back to its original position.

That's it :)


Popular posts from this blog

How to Use Kotlin in Your Android Projects

Android Debug Database: A Library for Debugging Android Databases and Shared Preferences

Reactive Programming with RxBinding

Exploring Android O: Fonts in XML

Exploring Android O: Autosizing TextViews

Kotlin: Do more with less code

Introduction to Android Bottom Navigation View

Getting started with Android Fingerprint Authentication

Picture-in-Picture: Working in Android Oreo