¡Continúe creando y acelerando el crecimiento! Este es el día 27 de mi participación en el "Nuggets Daily New Project·Desafío de actualización de octubre", haga clic para ver los detalles del evento , espero que me apoyen mucho, por favor denme un me gusta, ¡gracias!
prefacio
Cuando estaba trabajando hoy, de repente vi un control completamente desconocido en el diseño xml del proyecto. Al principio pensé que era una vista personalizada o algo así:
<com.airbnb.lottie.LottieAnimationView
android:id="@+id/lt_gift"
android:layout_width="200dp"
android:layout_height="200dp"
app:lottie_autoPlay="true"
app:lottie_fileName="lottie/gift.json"
app:lottie_loop="true"
app:lottie_repeatMode="restart"/>
复制代码Pero mirando el nombre del paquete y luego combinando el efecto de visualización de este control con el nombre en el diseño, pensé que se usaba para cargar animaciones GIF, pero después de buscar en línea, consulté algunos blogs y visité el proyecto GitHub de Lottie. Después de la dirección, tuve una impresión general: resulta que esta es una herramienta para nosotros, los desarrolladores, para ahorrarnos preocupaciones y mantener a los diseñadores de UI ocupados con la carga de animaciones.
articulo principal
Como dije al principio, mi conocimiento de esta biblioteca también es limitado. Este artículo es solo para referencia. Si hay algún error, ¡espero que me puedas corregir!
introducir
De hecho, la mejor presentación es la autopresentación oficial, de la siguiente manera:
El significado general es que, en primer lugar, se puede utilizar en el desarrollo de múltiples sistemas, como: Android, Apple IOS, Windows, React Native y la Web.
Y la presentación oficial también es muy graciosa:
Lottie es una biblioteca móvil para Android e iOS que puede analizar animaciones AE (Adobe After Effects) exportadas a json usando Bodymovin y renderizarlas de forma nativa en dispositivos móviles. Por primera vez, los diseñadores pueden crear y distribuir estas hermosas animaciones sin necesidad de que los ingenieros las recreen minuciosamente de forma manual. Dicen que una imagen vale 1000 palabras, así que 13000 palabras aquí.
En resumen, no necesitamos pasar mucho tiempo depurando animaciones con código, pero dejemos que el diseño de la interfaz de usuario sea un buen producto y podemos usarlo directamente.
como poner en proyecto
Primero, debido a que es una biblioteca nueva, debemos importar el paquete a nuestra build.gradle (aplicación):
implementation 'com.airbnb.android:lottie:5.2.0'
复制代码Luego está el código al comienzo del artículo, debemos colocarlo en la posición adecuada del diseño XML:
<com.airbnb.lottie.LottieAnimationView 使用Lottie
android:id="@+id/lt_gift" id名
android:layout_width="200dp" 控件宽度
android:layout_height="200dp" 控件高度
app:lottie_autoPlay="true" 自动播放动画（default: false）
app:lottie_fileName="lottie/gift.json" 目录下的json文件名（json文件可以直接放到assets目录下，比如“gift.json”，也可新建子目录，比如"lottie/gift.json"）
app:lottie_loop="true" 循环播放（default:false）
app:lottie_repeatMode="restart" 循环模式（default:restart）
/>
复制代码Resumir
En esta sección, hemos visto cómo poner a Lottie en nuestro proyecto de Android y escribirlo en XML. En la siguiente sección, continuaremos viendo cómo se usa en el código lógico. ¡Gracias por mirar!