Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/lopspower/rxanimation
Simple way to animate your views on Android with Rx 🚀
https://github.com/lopspower/rxanimation
android animation animation-library rxanimations rxjava2 rxkotlin rxkotlin-android
Last synced: about 21 hours ago
JSON representation
Simple way to animate your views on Android with Rx 🚀
- Host: GitHub
- URL: https://github.com/lopspower/rxanimation
- Owner: lopspower
- License: apache-2.0
- Created: 2019-06-18T15:59:51.000Z (over 5 years ago)
- Default Branch: master
- Last Pushed: 2022-11-25T11:37:58.000Z (almost 2 years ago)
- Last Synced: 2024-11-07T08:20:45.534Z (8 days ago)
- Topics: android, animation, animation-library, rxanimations, rxjava2, rxkotlin, rxkotlin-android
- Language: Kotlin
- Homepage:
- Size: 4.33 MB
- Stars: 593
- Watchers: 8
- Forks: 47
- Open Issues: 4
-
Metadata Files:
- Readme: README.md
- Funding: .github/FUNDING.yml
- License: LICENSE
- Codeowners: .github/CODEOWNERS
Awesome Lists containing this project
README
[](http://developer.android.com/index.html)
[](https://android-arsenal.com/api?level=16)
[](https://search.maven.org/artifact/com.mikhaellopez/rxanimation)
[](http://twitter.com/lopezmikhael)
This is an Android library to make a simple way to animate your views on Android with Rx.
USAGE
-----
Add RxAnimation library under **Rx3** with Gradle:
```groovy
implementation 'com.mikhaellopez:rxanimation:2.1.1'
```
:warning: If you use **Rx2** you need to implement the following version (just on jcenter):
```groovy
implementation 'com.mikhaellopez:rxanimation:1.0.0'
```
KOTLIN
-----
- Animate your views and handle it in [Completable](http://reactivex.io/RxJava/3.x/javadoc/io/reactivex/rxjava3/core/Completable.html). For example **`alpha()`** and **`resize()`**:
```kotlin
view1.alpha(1f)
.andThen(view2.resize(100, 100))
```
- If you want to apply animation in the same time you can used **`RxAnimation.together()`**:
```kotlin
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 multi `andThen()`:
```kotlin
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:
```kotlin
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:
```kotlin
(4f to 20f).rangeFloatToCompletable {
circularImageView.borderWidth = it
}
// or
RxAnimation.from(circularImageView)
.rangeFloat(4f, 20f) { circularImageView?.borderWidth = it }
```
- Use `reverse` properties to back to the initial value in all methods:
```kotlin
view.fadeIn(reverse = true)
```
- If you want to repeat an animation you can use the native method [`repeat`](http://reactivex.io/documentation/operators/repeat.html) from Rx like this:
```kotlin
RxAnimation.from(view)
.fadeIn()
.shake()
.fadeOut()
.repeat(NB_REPEAT)
.subscribe()
```
ALL PROPERTIES
-----
### Default
| 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 | - |
### Custom Properties
| View to Completable | RxAnimation.from(view) |
| ----------------------- | ---------------------- |
| rangeFloatToCompletable | rangeFloat |
| rangeIntToCompletable | rangeInt |
### Smart function
| Animation | View to Completable | RxAnimation.from(view) |
| --------- | ------------------- | ---------------------- |
| alpha=1f | fadeIn | fadeIn |
| alpha=0f | fadeOut | fadeOut |
| shake | shake | shake |
| press | press | press |
| text | text | text |
:information_source: All the functions have `duration: Long`, `interpolator: TimeInterpolator`, `startDelay: Long` and `reverse: Boolean` properties.
SUPPORT ❤️
-----
Find this library useful? Support it by joining [**stargazers**](https://github.com/lopspower/RxAnimation/stargazers) for this repository ⭐️
And [**follow me**](https://github.com/lopspower?tab=followers) for my next creations 👍
LICENCE
-----
RxAnimation by [Lopez Mikhael](http://mikhaellopez.com/) is licensed under a [Apache License 2.0](http://www.apache.org/licenses/LICENSE-2.0).