Your Web News in One Place

Help Webnuz

Referal links:

Sign up for GreenGeeks web hosting
March 27, 2022 07:35 am GMT

Animating Android views

Hello World!,
Android app without animation looks incomplete, and with rapid growth in architecture android we are missing out animations but lets remember some core roots

This consist of 4 major categories of animation -

  1. Scale Animation - change size of view
  2. Rotate Animation - rotate the view in clockwise and anticlockwise
  3. Translate Animation - change in x & y position in layout
  4. Alpha Animation - change in transparency

I would like to cover the Translate animation and moving any views in directions for this blog taking imageViews moving up.
Animation Layer: It is a simple frame layout lying on top of any of the fragment where our views will be created and animated.

<FrameLayout        android:id="@+id/animation_holder"        android:layout_width="match_parent"        android:layout_height="match_parent"        />

This layout class contains basic 3 functions
create: Here we create a imageView and attach to the animation_holder

fun create(): FrameLayout? {        val imageView = ImageView(activity)        imageView.setImageBitmap(mBitmap)        val minWidth = mBitmap!!.width        val minHeight = mBitmap!!.height        imageView.measure(            View.MeasureSpec.makeMeasureSpec(minWidth, View.MeasureSpec.AT_MOST),            View.MeasureSpec.makeMeasureSpec(minHeight, View.MeasureSpec.AT_MOST)        )        var params = imageView.layoutParams        if (params == null) {            params = FrameLayout.LayoutParams(                FrameLayout.LayoutParams.WRAP_CONTENT,                FrameLayout.LayoutParams.WRAP_CONTENT,                Gravity.TOP            )            imageView.layoutParams = params        }        val xPosition = mDrawLocation[0]        val yPosition = mDrawLocation[1]        params.width = minWidth        params.height = minHeight        params = params as FrameLayout.LayoutParams        params.leftMargin = xPosition        params.topMargin = yPosition        imageView.layoutParams = params        val animationLayer = FrameLayout(activity)        val topLayerParam = FrameLayout.LayoutParams(            FrameLayout.LayoutParams.MATCH_PARENT,            FrameLayout.LayoutParams.MATCH_PARENT,            Gravity.TOP        )        animationLayer.layoutParams = topLayerParam        animationLayer.addView(imageView)        attachingView!!.addView(animationLayer)        mCreatedAnimationLayer = animationLayer        return mCreatedAnimationLayer    }

applyAnimation: here we start the animation on the imageView Added

fun applyAnimation(animation: Animation?) {        if (mCreatedAnimationLayer != null) {            val drawnImageView = mCreatedAnimationLayer!!.getChildAt(0) as ImageView            drawnImageView.startAnimation(animation)        }    }

setBitmap: here will set the bitmap to global variable which is referenced above

fun setBitmap(bitmap: Bitmap?, location: IntArray?): AnimationLayer {        var location = location        if (location == null) {            location = intArrayOf(0, 0)        } else if (location.size != 2) {            throw AnimationLayerException("Requires location as an array of length 2 - [x,y]")        }        mBitmap = bitmap        mDrawLocation = location        return this    }

Now, we can create a animation with properties needed

// here destination is part where we want to fly the view //upto in x & y for us it is height of the layout  val animation = TranslateAnimation(                    0F,                    destinationX, 0f, DestinationY                )//amount of time to travel the distanceanimation.duration = duration.toLong()//animation will start after this much timeanimation.startOffset = 0L// create instance of above layer and apply animationval layer = AnimationLayer() val animationLayer = layer.with(activity)                    .attachTo(parentView)                    .setBitmap(scaledBitmap, startingPoints)                    .create()// after all the part is ready we can call applyanimationlayer.applyAnimation(animation)

Process is completed you can get the animation like

Image description


Original Link: https://dev.to/himanshut0305/animating-android-views-1nki

Share this article:    Share on Facebook
View Full Article

Dev To

An online community for sharing and discovering great ideas, having debates, and making friends

More About this Source Visit Dev To