Welcome to the forum.
In future please only post in English as that is the only language allowed on this forum.
Thank you for your epic comment
1 Like
Cool! 
Nice extension!
2 Likes
Nice Extension
2 Likes
Thank you @UnknownBeast , made blinking text with your extension…
with your extension i have created timer (linked with online time)
4 Likes
Can i have the apk for Flubbie?
its usage is so simple, you dont need one, just put one block and compile apk 
1 Like
Well Guys what must I do?
- Add it to flubbie
- Make and publish new Seprate extension named Wavie
0 voters
1 Like
It is needed for future use for create app and see which animation is good to go, So please provide apk.
1 Like
Thanks for Support, Flubbie on Top 3rd on Community 1.3k Views 40 likes, its my first extension to attain that
2 Likes
V2 Coming soon with interpolators, optimzations, velocity, star x/y, end x/y & More 
6 Likes
Flubbie V2 is out !
Interpolators
BZR_EASE_INBZR_EASE_OUTBZR_EASE_IN_OUTBZR_LINEARBZR_SPRINGBZR_EASE_IN_SINEBZR_EASE_OUT_SINEBZR_EASE_IN_OUT_SINEBZR_EASE_IN_QUADBZR_EASE_OUT_QUADBZR_EASE_IN_OUT_QUADBZR_EASE_IN_CUBICBZR_EASE_OUT_CUBICBZR_EASE_IN_OUT_CUBICBZR_EASE_IN_QUARTBZR_EASE_OUT_QUARTBZR_EASE_IN_OUT_QUARTBZR_EASE_IN_QUINTBZR_EASE_OUT_QUINTBZR_EASE_IN_OUT_QUINTBZR_EASE_IN_EXPOBZR_EASE_OUT_EXPOBZR_EASE_IN_OUT_EXPOBZR_EASE_IN_CIRCBZR_EASE_OUT_CIRCBZR_EASE_IN_OUT_CIRCBZR_EASE_IN_BACKBZR_EASE_OUT_BACKBZR_EASE_IN_OUT_BACKSPRINGLINEAR
Animations
SLIDE_LEFTSLIDE_RIGHTSLIDE_DOWNSLIDE_UPSQUEEZE_LEFTSQUEEZE_RIGHTSQUEEZE_DOWNSQUEEZE_UPFADE_INFADE_OUTFADE_OUT_INFADE_IN_LEFTFADE_IN_RIGHTFADE_IN_DOWNFADE_IN_UPZOOM_INZOOM_OUTFALLSHAKEPOPFLIP_XFLIP_YMORPHSQUEEZEFLASHWOBBLESWINGALPHAROTATIONTRANSLATION_XTRANSLATION_YSCALE_XSCALE_Y
Download V2
Flubbie (25).aix (97.7 KB)
12 Likes
So, Dont Kill me, V2 Was full of bugs, So V3 is now here !
Repeat Mode added in aix, u can use reverse or restart
Added one property for infinite animation time
Fixed NullPointer Exceptions
5 Likes
Lets Make Flubbie Open Source ? 
- Yes
- No
0 voters
4 Likes
Flubbie is now Open Source !
Source code :
package com.kabby.v2.Flubbie;
import android.app.Activity;
import android.content.Context;
import com.google.appinventor.components.annotations.*;
import com.google.appinventor.components.common.ComponentCategory;
import com.google.appinventor.components.runtime.AndroidNonvisibleComponent;
import com.google.appinventor.components.runtime.ComponentContainer;
import com.google.appinventor.components.runtime.EventDispatcher;
import android.app.Activity;
import android.content.Context;
import com.google.appinventor.components.annotations.*;
import com.google.appinventor.components.common.*;
import com.google.appinventor.components.runtime.*;
import com.appolica.flubber.Flubber;
import android.view.View;
import static com.appolica.flubber.Flubber.AnimationPreset;
import static com.appolica.flubber.Flubber.InterpolatorProvider;
import com.appolica.flubber.listener.SimpleAnimatorListener;
import android.animation.Animator;
@DesignerComponent(
version = 1,
description = "",
category = ComponentCategory.EXTENSION,
nonVisible = true,
iconName = "")
@SimpleObject(external = true)
//Libraries
@UsesLibraries(libraries = "flubbie.jar")
//Permissions
@UsesPermissions(permissionNames = "")
public class Flubbie extends AndroidNonvisibleComponent {
//Activity and Context
private Context context;
private Activity activity;
private int animationDuration = 2000;
private int animationRepeatCount = 3;
private boolean animationAutoStart = true;
private int animationForce = 100;
private int animationVelocity = 10;
private float animationScaleX = 0.5f;
private float animationScaleY = 0.9f;
private float animationTranslateX = 0.5f;
private float animationTranslateY = 0.9f;
private int animationDelay = 100;
private int animationDamping = 100;
public Flubbie(ComponentContainer container){
super(container.$form());
this.activity = container.$context();
this.context = container.$context();
}
@DesignerProperty(
defaultValue = "2000",
editorType = PropertyTypeConstants.PROPERTY_TYPE_INTEGER)
@SimpleProperty
public void Duration(int duration){
animationDuration = duration;
}
@DesignerProperty(
defaultValue = "3",
editorType = PropertyTypeConstants.PROPERTY_TYPE_INTEGER)
@SimpleProperty
public void RepeatCount(int count){
animationRepeatCount = count;
}
@DesignerProperty(
defaultValue = "100",
editorType = PropertyTypeConstants.PROPERTY_TYPE_INTEGER)
@SimpleProperty
public void Force(int force){
animationForce = force;
}
@DesignerProperty(
defaultValue = "10",
editorType = PropertyTypeConstants.PROPERTY_TYPE_INTEGER)
@SimpleProperty
public void Velocity(int velocity){
animationVelocity = velocity;
}
@DesignerProperty(
defaultValue = "100",
editorType = PropertyTypeConstants.PROPERTY_TYPE_INTEGER)
@SimpleProperty
public void Delay(int delay){
animationDelay = delay;
}
@DesignerProperty(
defaultValue = "100",
editorType = PropertyTypeConstants.PROPERTY_TYPE_INTEGER)
@SimpleProperty
public void Damping(int damp){
animationDamping = damp;
}
@DesignerProperty(
defaultValue = "0.5",
editorType = PropertyTypeConstants.PROPERTY_TYPE_NON_NEGATIVE_FLOAT)
@SimpleProperty
public void ScaleX(float scalex){
animationScaleX = scalex;
}
@DesignerProperty(
defaultValue = "0.9",
editorType = PropertyTypeConstants.PROPERTY_TYPE_NON_NEGATIVE_FLOAT)
@SimpleProperty
public void ScaleY(float scaley){
animationScaleY = scaley;
}
@DesignerProperty(
defaultValue = "0.5",
editorType = PropertyTypeConstants.PROPERTY_TYPE_NON_NEGATIVE_FLOAT)
@SimpleProperty
public void TranslateX(float translatex){
animationTranslateX = translatex;
}
@DesignerProperty(
defaultValue = "0.9",
editorType = PropertyTypeConstants.PROPERTY_TYPE_NON_NEGATIVE_FLOAT)
@SimpleProperty
public void TranslateY(float translatey){
animationTranslateY = translatey;
}
@DesignerProperty(defaultValue = "False", editorType = PropertyTypeConstants.PROPERTY_TYPE_BOOLEAN)
@SimpleProperty
public void AutoStart(boolean auto) {
animationAutoStart = auto;
}
@SimpleFunction
public void AnimateView(AndroidViewComponent view, Object animation, Object interpolator, int repeatMode){
AnimationPreset anim = AnimationPreset.class.cast(animation);
InterpolatorProvider inter = InterpolatorProvider.class.cast(interpolator);
Flubber.with()
.animation(anim) // Slide up animation
.interpolator(inter)
.repeatCount(animationRepeatCount)
.autoStart(animationAutoStart) // Repeat once
.duration(animationDuration)
.velocity(animationVelocity)
.scaleX(animationScaleX)
.scaleY(animationScaleY)
.translateX(animationTranslateX)
.repeatMode(repeatMode)
.translateY(animationTranslateY)
.delay(animationDelay)
.damping(animationDamping)
.force(animationForce)
.listener(new Animator.AnimatorListener(){
@Override
public void onAnimationStart(Animator animation){
AnimationStarted();
}
@Override
public void onAnimationRepeat(Animator animation){
AnimationRepeated();
}
@Override
public void onAnimationCancel(Animator animation){
AnimationCancelled();
}
@Override
public void onAnimationEnd(Animator animation){
AnimationEnded();
}
}) // Last for 1000 milliseconds(1 second)
.createFor(view.getView()) // Apply it to the view
.start();
}
@SimpleProperty
public int Restart(){
return android.animation.ValueAnimator.RESTART;
}
@SimpleProperty
public int Reverse(){
return android.animation.ValueAnimator.REVERSE;
}
@SimpleProperty
public int Infinite(){
return android.animation.ValueAnimator.INFINITE;
}
@SimpleProperty
public Object SlideUp(){
return Flubber.AnimationPreset.SLIDE_UP;
}
@SimpleProperty
public Object SlideLeft(){
return Flubber.AnimationPreset.SLIDE_LEFT;
}
@SimpleProperty
public Object SlideRight(){
return Flubber.AnimationPreset.SLIDE_RIGHT;
}
@SimpleProperty
public Object SlideDown(){
return Flubber.AnimationPreset.SLIDE_DOWN;
}
@SimpleProperty
public Object SqueezeLeft(){
return Flubber.AnimationPreset.SQUEEZE_LEFT;
}
@SimpleProperty
public Object SqueezeRight(){
return Flubber.AnimationPreset.SQUEEZE_RIGHT;
}
@SimpleProperty
public Object SqueezeDown(){
return Flubber.AnimationPreset.SQUEEZE_DOWN;
}
@SimpleProperty
public Object SqueezeUp(){
return Flubber.AnimationPreset.SQUEEZE_UP;
}
@SimpleProperty
public Object FadeIn(){
return Flubber.AnimationPreset.FADE_IN;
}
@SimpleProperty
public Object FadeOut(){
return Flubber.AnimationPreset.FADE_OUT;
}
@SimpleProperty
public Object FadeOutIn(){
return Flubber.AnimationPreset.FADE_OUT_IN;
}
@SimpleProperty
public Object FadeInLeft(){
return Flubber.AnimationPreset.FADE_IN_LEFT;
}
@SimpleProperty
public Object FadeInRight(){
return Flubber.AnimationPreset.FADE_IN_RIGHT;
}
@SimpleProperty
public Object FadeInDown(){
return Flubber.AnimationPreset.FADE_IN_DOWN;
}
@SimpleProperty
public Object FadeInUp(){
return Flubber.AnimationPreset.FADE_IN_UP;
}
@SimpleProperty
public Object ZoomIn(){
return Flubber.AnimationPreset.ZOOM_IN;
}
@SimpleProperty
public Object ZoomOut(){
return Flubber.AnimationPreset.ZOOM_OUT;
}
@SimpleProperty
public Object Fall(){
return Flubber.AnimationPreset.FALL;
}
@SimpleProperty
public Object Shake(){
return Flubber.AnimationPreset.SHAKE;
}
@SimpleProperty
public Object Pop(){
return Flubber.AnimationPreset.POP;
}
@SimpleProperty
public Object FlipX(){
return Flubber.AnimationPreset.FLIP_X;
}
@SimpleProperty
public Object FlipY(){
return Flubber.AnimationPreset.FLIP_Y;
}
@SimpleProperty
public Object Morph(){
return Flubber.AnimationPreset.MORPH;
}
@SimpleProperty
public Object Squeeze(){
return Flubber.AnimationPreset.SQUEEZE;
}
@SimpleProperty
public Object Flash(){
return Flubber.AnimationPreset.FLASH;
}
@SimpleProperty
public Object Wobble(){
return Flubber.AnimationPreset.WOBBLE;
}
@SimpleProperty
public Object Swing(){
return Flubber.AnimationPreset.SWING;
}
@SimpleProperty
public Object Alpha(){
return Flubber.AnimationPreset.ALPHA;
}
@SimpleProperty
public Object Rotation(){
return Flubber.AnimationPreset.ROTATION;
}
@SimpleProperty
public Object TranslationX(){
return Flubber.AnimationPreset.TRANSLATION_X;
}
@SimpleProperty
public Object TranslationY(){
return Flubber.AnimationPreset.TRANSLATION_Y;
}
@SimpleProperty
public Object ScaleX(){
return Flubber.AnimationPreset.SCALE_X;
}
@SimpleProperty
public Object ScaleY(){
return Flubber.AnimationPreset.SCALE_Y;
}
@SimpleProperty
public Object BzrEaseIn(){
return Flubber.Curve.BZR_EASE_IN;
}
@SimpleProperty
public Object BzrEaseOut(){
return Flubber.Curve.BZR_EASE_OUT;
}
@SimpleProperty
public Object BzrEaseInOut(){
return Flubber.Curve.BZR_EASE_IN_OUT;
}
@SimpleProperty
public Object BzrLinear(){
return Flubber.Curve.BZR_LINEAR;
}
@SimpleProperty
public Object BzrSpring(){
return Flubber.Curve.BZR_SPRING;
}
@SimpleProperty
public Object BzrEaseInSine(){
return Flubber.Curve.BZR_EASE_IN_SINE;
}
@SimpleProperty
public Object BzrEaseOutSine(){
return Flubber.Curve.BZR_EASE_OUT_SINE;
}
@SimpleProperty
public Object BzrEaseInOutSine(){
return Flubber.Curve.BZR_EASE_IN_OUT_SINE;
}
@SimpleProperty
public Object BzrEaseInQuad(){
return Flubber.Curve.BZR_EASE_IN_QUAD;
}
@SimpleProperty
public Object BzrEaseOutQuad(){
return Flubber.Curve.BZR_EASE_OUT_QUAD;
}
@SimpleProperty
public Object BzrEaseInOutQuad(){
return Flubber.Curve.BZR_EASE_IN_OUT_QUAD;
}
@SimpleProperty
public Object BzrEaseInCubie(){
return Flubber.Curve.BZR_EASE_IN_CUBIC;
}
@SimpleProperty
public Object BzrEaseOutCubie(){
return Flubber.Curve.BZR_EASE_OUT_CUBIC;
}
@SimpleProperty
public Object BzrEaseInOutCubie(){
return Flubber.Curve.BZR_EASE_IN_OUT_CUBIC;
}
@SimpleProperty
public Object BzrEaseInQuart(){
return Flubber.Curve.BZR_EASE_IN_QUART;
}
@SimpleProperty
public Object BzrEaseOutQuart(){
return Flubber.Curve.BZR_EASE_OUT_QUART;
}
@SimpleProperty
public Object BzrEaseInOutQuart(){
return Flubber.Curve.BZR_EASE_IN_OUT_QUART;
}
@SimpleProperty
public Object BzrEaseInQuint(){
return Flubber.Curve.BZR_EASE_IN_QUINT;
}
@SimpleProperty
public Object BzrEaseOutQuint(){
return Flubber.Curve.BZR_EASE_OUT_QUINT;
}
@SimpleProperty
public Object BzrEaseInOutQuint(){
return Flubber.Curve.BZR_EASE_IN_OUT_QUINT;
}
@SimpleProperty
public Object BzrEaseInExpo(){
return Flubber.Curve.BZR_EASE_IN_EXPO;
}
@SimpleProperty
public Object BzrEaseOutExpo(){
return Flubber.Curve.BZR_EASE_OUT_EXPO;
}
@SimpleProperty
public Object BzrEaseInOutExpo(){
return Flubber.Curve.BZR_EASE_IN_OUT_EXPO;
}
@SimpleProperty
public Object BzrEaseInBack(){
return Flubber.Curve.BZR_EASE_IN_BACK;
}
@SimpleProperty
public Object BzrEaseOutBack(){
return Flubber.Curve.BZR_EASE_OUT_BACK;
}
@SimpleProperty
public Object BzrEaseInOutBack(){
return Flubber.Curve.BZR_EASE_IN_OUT_BACK;
}
@SimpleProperty
public Object Spring(){
return Flubber.Curve.SPRING;
}
@SimpleProperty
public Object Linear(){
return Flubber.Curve.LINEAR;
}
@SimpleEvent
public void AnimationStarted() {
EventDispatcher.dispatchEvent(this, "AnimationStarted");
}
@SimpleEvent
public void AnimationRepeated() {
EventDispatcher.dispatchEvent(this, "AnimationRepeated");
}
@SimpleEvent
public void AnimationCancelled() {
EventDispatcher.dispatchEvent(this, "AnimationCancelled");
}
@SimpleEvent
public void AnimationEnded() {
EventDispatcher.dispatchEvent(this, "AnimationEnded");
}
}
Library :
https://mvnrepository.com/artifact/com.appolica/flubber/1.0.1
9 Likes
is it possibble to make some thing like the sidebar? slide from left side to center of screen, then after some operation, slide out back to left?How?
Its easy, align your sidebar layout to center of screen use slide in animation for showing sidebar and slide out for dismissing it
But i did not find slide in and slide out aimation, only found slide up and slide down animation.
I have put the layout in center the screen, and use slide in animtion, its working good. but when use slide down, it’s not from center to bottom, but from top to center.
Use BZR ease out interpolator