Airbnb在GitHub上面開源了一個(gè)項(xiàng)目lottie-android，最近火的不要不要的，牢牢占據(jù)Trending排行榜（日、周、月）首位，下面我們就見識一下這個(gè)項(xiàng)目。 首先放上Lottie在GitHub上面的項(xiàng)目地址：Android，iOS, 和React Native。
Lottie是一個(gè)為Android和IOS設(shè)備提供的一個(gè)開源框架，它能夠解析通過Adobe After Effects 軟件做出來的動畫，動畫文件通過Bodymovin導(dǎo)出json文件，就可以通過Lottie中的LottieAnimationView來使用了。 Bodymovin是一個(gè)After Effects的插件，它由Hernan Torrisi開發(fā)。 我們先看看官方給出的實(shí)現(xiàn)的動畫效果：
這些動畫如果讓你實(shí)現(xiàn)起來，你可能會覺得很麻煩，但是通過Lottie這一切就變得很容易。 想了解更多請參考官方介紹
首先由視覺設(shè)計(jì)師通過Adobe After Effects做好這些動畫，這個(gè)比我們用代碼來實(shí)現(xiàn)會容易的很多，然后Bodymovin導(dǎo)出json文件，這些json文件描述了該動畫的一些關(guān)鍵點(diǎn)的坐標(biāo)以及運(yùn)動軌跡，然后把json文件放到項(xiàng)目的app/src/main/assets目錄下，代碼中在build.gradle中添加依賴：
dependencies { compile 'com.airbnb.android:lottie:1.0.1'}在布局文件上加上：
<com.airbnb.lottie.LottieAnimationView android:id="@+id/animation_view" android:layout_width="wrap_content" android:layout_height="wrap_content" app:lottie_fileName="hello-world.json" app:lottie_loop="true"或者代碼中實(shí)現(xiàn)：
LottieAnimationView animationView = (LottieAnimationView) findViewById(R.id.animation_view);animationView.setAnimation("hello-world.json");animationView.loop(true);此方法將加載文件并在后臺解析動畫，并在完成后異步開始呈現(xiàn)動畫。 Lottie只支持Jellybean (API 16)或以上版本。 通過源碼我們可以發(fā)現(xiàn)LottieAnimationView是繼承自AppCompatImageView，我們可以像使用其他View一樣來使用它。
甚至可以從網(wǎng)絡(luò)上下載json數(shù)據(jù)：
LottieComposition composition = LottieComposition.fromJson(getResources(), jsonObject, (composition) -> { animationView.setComposition(composition); animationView.playAnimation(); });或者使用
setAnimation(JSONObject);我們還可以控制動畫或者添加監(jiān)聽器：
animationView.addAnimatorUpdateListener((animation) -> { // Do something.});animationView.playAnimation();...if (animationView.isAnimating()) { // Do something.}...animationView.setPRogress(0.5f);...// Custom animation speed or duration.ValueAnimator animator = ValueAnimator.ofFloat(0f, 1f) .setDuration(500);animator.addUpdateListener(animation -> { animationView.setProgress(animation.getAnimatedValue());});animator.start();...animationView.cancelAnimation();LottieAnimationView是使用LottieDrawable來渲染動畫的，如果有必要，還可以直接使用LottieDrawable：
如果動畫會被頻繁的復(fù)用，LottieAnimationView有一套緩存策略，可以使用
來實(shí)現(xiàn)它，CacheStrategy可以是Strong，Weak或者是None，這樣LottieAnimationView就可以持有一個(gè)已經(jīng)加載和解析動畫的強(qiáng)引用或者弱引用。
先簡單介紹到這里，稍后會帶來Lottie的源碼分析……
新聞熱點(diǎn)
疑難解答
