This is an Android library to make a simple way to animate your views on Android with Rx.
Add RxAnimation library via Gradle:
implementation 'com.mikhaellopez:rxanimation:1.0.0'
- Animate your views and handle it in Completable. For example
alpha()andresize():
view1.alpha(1f)
.andThen(view2.resize(100, 100))
- If you want to apply animation in the same time you can used
RxAnimation.together():
RxAnimation.together(
view1.fadeIn(),
view1.translation(20f, 30f),
view2.backgroundColor(
ContextCompat.getColor(this, R.color.accent),
ContextCompat.getColor(this, R.color.primary)
),
view2.resize(100, 100)
)
- If you want to apply animation one by one you can used
RxAnimation.sequentially()instead of multiandThen():
RxAnimation.sequentially(
view1.fadeIn(),
view1.translation(20f, 30f),
view2.backgroundColor(
ContextCompat.getColor(this, R.color.accent),
ContextCompat.getColor(this, R.color.primary)
),
view2.resize(100, 100)
)
- You can also used
RxAnimation.from(view)if you want to update multi properties one by one in the same view:
RxAnimation.from(view)
.fadeIn()
.translation(20f, 30f)
.backgroundColor(
ContextCompat.getColor(this, R.color.accent),
ContextCompat.getColor(this, R.color.primary)
)
.resize(100, 100)
- You can also use the
range()function to animate a change on a custom property:
(4f to 20f).rangeFloatToCompletable {
circularImageView.borderWidth = it
}
// or
RxAnimation.from(circularImageView)
.rangeFloat(4f, 20f) { circularImageView?.borderWidth = it }- Use
reverseproperties to back to the initial value in all methods:
view.fadeIn(reverse = true)- If you want to repeat an animation you can use the native method
repeatfrom Rx like this:
RxAnimation.from(view)
.fadeIn()
.shake()
.fadeOut()
.repeat(NB_REPEAT)
.subscribe()| Properties | View to Completable | RxAnimation.from(view) |
|---|---|---|
| alpha | alpha | alpha |
| translationX | translationX | translationX |
| translationY | translationY | translationY |
| translation X + Y | translation(X, Y) | translation(X, Y) |
| scaleX | scaleX | scaleX |
| scaleY | scaleY | scaleY |
| scale X = Y | scale | scale |
| rotation | rotation | rotation |
| rotationX | rotationX | rotationX |
| rotationY | rotationY | rotationY |
| X | x | x |
| Y | y | y |
| Z | z | z |
| X + Y + Z | xyz | xyz |
| backgroundColor | backgroundColor | backgroundColor |
| width | width | width |
| height | height | height |
| width + height | resize | resize |
| ValueAnimator | start | startValueAnimator |
| ViewPropertyAnimator | animate | - |
| View to Completable | RxAnimation.from(view) |
|---|---|
| rangeFloatToCompletable | rangeFloat |
| rangeIntToCompletable | rangeInt |
| Animation | View to Completable | RxAnimation.from(view) |
|---|---|---|
| alpha=1f | fadeIn | fadeIn |
| alpha=0f | fadeOut | fadeOut |
| shake | shake | shake |
| press | press | press |
| text | text | text |
ℹ️ All the functions have duration: Long, interpolator: TimeInterpolator, startDelay: Long and reverse: Boolean properties.
Find this library useful? Support it by joining stargazers for this repository ⭐️
And follow me for my next creations 👍
RxAnimation by Lopez Mikhael is licensed under a Apache License 2.0.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent