- Notifications
You must be signed in to change notification settings - Fork257
💪 Rich Android Path. 🤡 Draw as you want. 🎉 Animate much as you can.
tarek360/RichPath
Folders and files
| Name | Name | Last commit message | Last commit date | |
|---|---|---|---|---|
Repository files navigation
💪 Rich Android Path. 🤡 Draw as you want. 🎉 Animate much as you can.
- Full Animation Control on Paths and VectorDrawables:Animate any attribute in a specific path in the VectorDrawable
fillColor,strokeColor,strokeAlpha,fillAlpha,size,width,height,scale,scaleX,scaleY,rotation,translationX,translationY,trimPathStart,trimPathEnd,trimPathOffset.
- Path morphing:
RichPathAnimator.animate(richPath) .pathData(pathData1,pathData2, ...) .start();
<com.richpath.RichPathViewandroid:layout_width="wrap_content"android:layout_height="wrap_content"app:vector="@drawable/vector_drawable" />
// by path nameRichPathrichPath =richPathView.findRichPathByName("path_name");// or if it contains one pathRichPathrichPath =richPathView.findFirstRichPath();// or by indexRichPathrichPath =richPathView.findRichPathByIndex(0);
RichPathAnimator.animate(richPath) .trimPathEnd(value1,value2, ...) .fillColor(value1,value2, ...) .start();
<vectorxmlns:android="http://schemas.android.com/apk/res/android"android:width="32dp"android:height="32dp"android:viewportHeight="32.0"android:viewportWidth="32.0"> <groupandroid:pivotX="16"android:pivotY="6.25"> <pathandroid:name="top"android:fillColor="#FFF7F7F7"android:pathData="M22,19.8v-5c0-3.1-1.6-5.6-4.5-6.3V7.8c0-0.8-0.7-1.5-1.5-1.5s-1.5,0.7-1.5,1.5v0.7c-2.9,0.7-4.5,3.2-4.5,6.3v5l-2,2v1h16v-1L22,19.8z" /> <pathandroid:name="bottom"android:fillColor="#FFF7F7F7"android:pathData="M16,25.8c1.1,0,2-0.9,2-2h-4C14,24.9,14.9,25.8,16,25.8z" /> </group></vector>
<com.richpath.RichPathViewandroid:id="@+id/ic_notifications"android:layout_width="wrap_content"android:layout_height="wrap_content"app:vector="@drawable/ic_notifications" />
RichPathtop =notificationsRichPathView.findRichPathByName("top");RichPathbottom =notificationsRichPathView.findRichPathByName("bottom");RichPathAnimator.animate(top) .interpolator(newDecelerateInterpolator()) .rotation(0,20, -20,10, -10,5, -5,2, -2,0) .duration(4000) .andAnimate(bottom) .interpolator(newDecelerateInterpolator()) .rotation(0,10, -10,5, -5,2, -2,0) .startDelay(50) .duration(4000) .start();
Add the following dependency to your modulebuild.gradle file:
dependencies {...implementation'com.github.tarek360.RichPath:animator:0.1.1'}
Add this to your rootbuild.gradle file (not your modulebuild.gradle file) :
allprojects {repositories {...maven { url"https://jitpack.io" }}}
- Animate multiple paths sequentially or at the same time
RichPathAnimator .animate(richPath1,richPath2) .rotation(value1,value2, ...)//Animate the same path or another with different animated attributes. .andAnimate(richPath3) .scale(value1,value2, ...)//Animate after the end of the last animation. .thenAnimate(richPath4) .strokeColor(value1,value2, ...)// start your animation 🎉 .start();
- Which one of the paths is clicked?
richPathView.setOnPathClickListener(newRichPath.OnPathClickListener() {@OverridepublicvoidonClick(RichPathrichPath) {if (richPath.getName().equals("path_name")) {//TODO do an action when a specific path is clicked. } }});
Clickable path(Done)- Support clip-path
- Path animation (animate a RichPath on a path)
- Reverse animation
- ...
If you have any suggestion please open an issue for it.
- florent37 He is the creator ofViewAnimator which gave me the idea of this project. Some core concepts and ideas were reused, but everything is written from scratch.
- Android Some code is reused form the android source code and the VectorDrawableCompat support library.
- Alex Lockwood The paths of the morphing sample is extracted from theShape Shifter demo.
- Ahmed Tarek
- tarek360.github.io
Copyright 2017 Tarek360
Licensed under the Apache License, Version 2.0 (the "License");you may not use this file except in compliance with the License.You may obtain a copy of the License at
Unless required by applicable law or agreed to in writing, softwaredistributed under the License is distributed on an "AS IS" BASIS,WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.See the License for the specific language governing permissions andlimitations under the License.
About
💪 Rich Android Path. 🤡 Draw as you want. 🎉 Animate much as you can.