Grav是一个可以实现各种各样粒子动画的库,地址:https://github.com/glomadrian/Grav 。
下面是其文档的简单翻译。
这个库由几个generator组成,每个generator负责一件事情。不同的generator组合可以做出不同的效果。
有以下几个generator:
Point generator
Grav generator
Color generator
Animation generator
point generator制造出粒子的分布位置,通过如下属性设置point generator:
app:pointGenerator="classname"
有三种point generator可用:
基于单位和方差生成粒子。
app:pointGenerator="com.github.glomadrian.grav.generator.point.RegularPointGenerator" app:regular_cell_size="200" app:regular_variance="20"
(和 GravBallGeneartor一起使用)
基于一个圆内的单位和方差生成粒子。
app:pointGenerator="com.github.glomadrian.grav.generator.point.CircularPointGenerator" app:regular_cell_size="200" app:regular_variance="200"
(和 GravBallGeneartor一起使用)
根据百分比数组产生粒子。
app:pointGenerator="com.github.glomadrian.grav.generator.point.PercentPointGenerator" app:percent_points_array="@array/walla_points_percent_points"
arrays.xml中每组item代表一个点,其中一个item定义宽度上的百分比,另一个定义高度上的百分比:
<integer-array name="sample_points_percent_points"> <item>10</item> <item>60</item> <item>8</item> <item>30</item> <item>25</item> <item>10</item> </integer-array>
(和GravBallGeneartor一起使用)
Grav generator负责绘制每个点。通过设置如下属性来使用它:
app:gravGenerator="classname"
有两种Grav Generator可用
绘制一个球。
可以使用下面的属性让球的大小在一个范围内随机生成:
app:gravGenerator="com.github.glomadrian.grav.generator.grav.BallGenerator" app:ball_from_size="3dp" app:ball_to_size="16dp"
绘制矩形。
可以使用下面的属性来改变矩形的大小:
app:gravGenerator="com.github.glomadrian.grav.generator.grav.RectangleGenerator" app:rectangle_width="15dp" app:rectangle_height="10dp"
定义Grav是如何涂色的。
你需要设置如下属性来使用它:
appcolorGenerator="classname"
有两种 Color Generator可用。
绘制单一的颜色。
app:colorGenerator="com.github.glomadrian.grav.generator.paint.SingleColorGenerator" app:single_color="@color/colorPrimary"
使用颜色数组涂色
app:colorGenerator="com.github.glomadrian.grav.generator.paint.ArrayColorGenerator" app:array_colors="@array/Spectral"
animation generator负责位置,大小以及属性的动画。 animation generator 可以是一个animation generator或者animation generator数组。
通过下面的属性设置:
app:animationGenerator="classname"
通过下面的属性设置:
app:animationGenerators="@array/array_reference" <string-array name="array_reference"> <item>com.github.glomadrian.grav.generator.animation.PathAnimator</item> <item>com.github.glomadrian.grav.generator.animation.BallSizeAnimator</item> </string-array>
在一个区间内移动
app:animationGenerator=" com.github.glomadrian.grav.generator.animation.ShakeAnimator" //Min animation duration app:shake_min_duration="1000" //Max animation duration app:shake_max_duration="3000" //Direction horizontal or vertical app:shake_direction="horizontal" //The size of the movement app:shake_variance="15dp"
单位的移动从一边到另一边
app:animationGenerator="com.github.glomadrian.grav.generator.animation.SideToSideAnimator" //Min animation duration app:side_to_side_min_duration="1000" //Max animation duration app:side_to_side_max_duration="3000" //Direction leftToRight | rightToLeft | upToDown | downToUp app:side_to_side_direction="leftToRight"
你也可以设置一个插值器
side_to_side_interpolator="interpolator class"
对单位使用渐变动画
app:animationGenerator="com.github.glomadrian.grav.generator.animation.AlphaAnimator" //Min animation duration app:alpha_min_duration="1000" //Max animation duration app:alpha_max_duration="3000" //From and to in a range (0-255) app:alpha_from="0" app:alpha_to="255"
对球的大小进行动画。
app:animationGenerator="com.github.glomadrian.grav.generator.animation.BallSizeAnimator" //Min animation duration app:ball_size_min_duration="1000" //Max animation duration app:ball_size_max_duration="3000" app:ball_size_from_size="3dp" app:ball_size_to_size="8dp"
按照一个路径移动单位。
<string name="circle"> M527.023,71.8233 C780.213,71.8233,985.464,277.075,985.464,530.265 C985.464,783.455,780.213,988.707,527.023,988.707 C273.832,988.707,68.5809,783.455,68.5809,530.265 C68.5809,277.075,273.832,71.8233,527.023,71.8233 Z </string> <integer name="circle_original_width">1062</integer> <integer name="circle_original_height">1062</integer>
app:animationGenerator="com.github.glomadrian.grav.generator.animation.PathAnimator" //Variance is the random margin given to the grav app:path_variance_from="1dp" app:path_variance_to="20dp" //Min animation duration app:path_min_duration="2000" //Max animation duration app:path_max_duration="2300" //String that define the path app:path="@string/circle" app:path_original_width="@integer/circle_original_width" app:path_original_height="@integer/circle_original_height"
完整的例子可以在源码的demo app中找到。
<com.github.glomadrian.grav.GravView android:id="@+id/grav" android:layout_centerInParent="true" android:layout_width="400dp" android:layout_height="400dp" app:colorGenerator="com.github.glomadrian.grav.generator.paint.ArrayColorGenerator" app:array_colors="@array/red" app:pointGenerator="com.github.glomadrian.grav.generator.point.RegularPointGenerator" app:regular_cell_size="150" app:regular_variance="100" app:gravGenerator="com.github.glomadrian.grav.generator.grav.BallGenerator" app:ball_size_from_size="3dp" app:ball_size_to_size="6dp" app:animationGenerators="@array/path" app:path_variance_from="-10dp" app:path_variance_to="12dp" app:path="@string/circle" app:path_original_width="@integer/circle_original_width" app:path_original_height="@integer/circle_original_height" app:path_min_duration="5000" app:path_max_duration="6000" />
<com.github.glomadrian.grav.GravView android:id="@+id/grav" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_centerInParent="true" app:colorGenerator="com.github.glomadrian.grav.generator.paint.ArrayColorGenerator" app:array_colors="@array/bubble" app:pointGenerator="com.github.glomadrian.grav.generator.point.RegularPointGenerator" app:regular_cell_size="300" app:regular_variance="200" app:gravGenerator="com.github.glomadrian.grav.generator.grav.BallGenerator" app:ball_from_size="10dp" app:ball_to_size="20dp" app:animationGenerators="@array/BubbleAnimations" app:side_to_side_min_duration="10000" app:side_to_side_max_duration="10000" app:side_to_side_direction="leftToRight" app:shake_direction="vertical" app:shake_min_duration="10000" app:shake_max_duration="20000" app:shake_variance="500dp" />
<com.github.glomadrian.grav.GravView android:id="@+id/grav" android:layout_width="match_parent" android:layout_height="match_parent" app:colorGenerator="com.github.glomadrian.grav.generator.paint.ArrayColorGenerator" app:array_colors="@array/falcon" app:pointGenerator="com.github.glomadrian.grav.generator.point.RegularPointGenerator" app:regular_cell_size="100" app:regular_variance="200" app:gravGenerator="com.github.glomadrian.grav.generator.grav.RectangleGenerator" app:rectangle_width="15dp" app:rectangle_height="2dp" app:animationGenerators="@array/FalconAnimations" app:side_to_side_min_duration="400" app:side_to_side_max_duration="800" app:side_to_side_direction="rightToLeft" app:shake_variance="5dp" app:shake_direction="vertical" />
<com.github.glomadrian.grav.GravView android:id="@+id/grav" android:layout_width="match_parent" android:layout_height="match_parent" app:colorGenerator="com.github.glomadrian.grav.generator.paint.OneColorGenerator" app:single_color="#FFF" app:pointGenerator="com.github.glomadrian.grav.generator.point.PercentPointGenerator" app:ball_from_size="2dp" app:ball_to_size="5dp" app:animationGenerators="@array/WallaIcon" app:alpha_from="100" app:alpha_to="200" app:alpha_min_duration="1600" app:alpha_max_duration="3000" app:shake_direction="vertical" app:shake_variance="3dp" app:shake_min_duration="1100" app:shake_max_duration="3500" app:percent_points_array="@array/walla_points_percent_points" app:gravGenerator="com.github.glomadrian.grav.generator.grav.BallGenerator" />