如何使用 Android 构建一个简单的电子饼干应用程序？

先决条件：

• 面向初学者的 Android 应用开发基础知识
• 安装和设置 Android Studio 指南
• 如何在 Android Studio 中创建/启动新项目？
• 运行您的第一个 Android 应用程序
• 如何在 Android 应用中添加 Lottie 动画
• Android 中的 MediaPlayer 类

在本文中，我们将构建一个简单的 e-Crackers 应用程序。它由一个RelativeLayout 组成。它的背景设置为黑色。然后我们将在布局上随机填充星星的图像，以获得天空的感觉。然后我们将 OnTouchListener 添加到布局中，以检测点击。一旦用户点击屏幕，它就会爆发烟花。我们将获取触摸位置的 X 和 Y 坐标，并使用 Lottie 文件制作烟花，以及使用 MediaPlayer 类制作音效。我们将使用Java在 Android 中构建整个应用程序。

分步实施

第 1 步：创建一个新项目

要在 Android Studio 中创建新项目，请参阅如何在 Android Studio 中创建/启动新项目。请注意，选择Java作为编程语言。

第 2 步：添加依赖项

在转到编码部分之前，让我们添加必要的依赖项。我们必须为项目添加的唯一依赖项是Lottie 文件。 Lottie 是一种开源动画文件格式，可以在我们的应用程序中使用。转到应用级build.gradle文件并添加以下依赖项，然后单击立即同步。

def lottieVersion = "3.4.0"
implementation "com.airbnb.android:lottie:$lottieVersion"

这是一个参考，

第三步：添加资源文件

让我们添加必要的矢量资源和可绘制资源文件。转到app > res > drawable并为星星添加以下矢量文件。

star.xml （星形图标）

预览：

星号.xml

现在转到资源文件夹，右键单击 > 新建 > Android 资源目录。

出现一个对话框。将目录命名为raw并将资源类型设置为raw 。

现在将以下 JSON 文件添加到原始目录。

烟花.json

{"v":"5.3.4","fr":24,"ip":0,"op":55,"w":1000,"h":1000,"nm":"Comp 1","ddd":0,"assets":[{"id":"comp_0","layers":[{"ddd":0,"ind":1,"ty":0,"nm":"roj","refId":"comp_1","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":1,"k":[{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"n":["0p833_0p833_0p167_0p167"],"t":6,"s":[0],"e":[84]},{"t":23}],"ix":10},"p":{"a":0,"k":[500,500,0],"ix":2},"a":{"a":0,"k":[500,500,0],"ix":1},"s":{"a":1,"k":[{"i":{"x":[0.833,0.833,0.833],"y":[0.833,0.833,0.833]},"o":{"x":[0.167,0.167,0.167],"y":[0.167,0.167,0.167]},"n":["0p833_0p833_0p167_0p167","0p833_0p833_0p167_0p167","0p833_0p833_0p167_0p167"],"t":6,"s":[100,100,100],"e":[157,157,100]},{"t":10}],"ix":6}},"ao":0,"w":1000,"h":1000,"ip":6,"op":36,"st":6,"bm":0},{"ddd":0,"ind":2,"ty":0,"nm":"Ama","refId":"comp_3","sr":1,"ks":{"o":{"a":1,"k":[{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"n":["0p833_0p833_0p167_0p167"],"t":20,"s":[100],"e":[1]},{"t":29}],"ix":11},"r":{"a":1,"k":[{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"n":["0p833_0p833_0p167_0p167"],"t":4,"s":[0],"e":[85]},{"t":29}],"ix":10},"p":{"a":0,"k":[497.25,498.5,0],"ix":2},"a":{"a":0,"k":[496.75,500.5,0],"ix":1},"s":{"a":1,"k":[{"i":{"x":[0.833,0.833,0.833],"y":[0.833,0.833,0.833]},"o":{"x":[0.167,0.167,0.167],"y":[0.167,0.167,0.167]},"n":["0p833_0p833_0p167_0p167","0p833_0p833_0p167_0p167","0p833_0p833_0p167_0p167"],"t":4,"s":[54,54,100],"e":[100,100,100]},{"i":{"x":[0.833,0.833,0.833],"y":[0.833,0.833,0.833]},"o":{"x":[0.167,0.167,0.167],"y":[0.167,0.167,0.167]},"n":["0p833_0p833_0p167_0p167","0p833_0p833_0p167_0p167","0p833_0p833_0p167_0p167"],"t":8,"s":[100,100,100],"e":[134,134,100]},{"i":{"x":[0.833,0.833,0.833],"y":[0.833,0.833,0.833]},"o":{"x":[0.167,0.167,0.167],"y":[0.167,0.167,0.167]},"n":["0p833_0p833_0p167_0p167","0p833_0p833_0p167_0p167","0p833_0p833_0p167_0p167"],"t":17,"s":[134,134,100],"e":[96,96,100]},{"t":19}],"ix":6}},"ao":0,"w":1000,"h":1000,"ip":4,"op":34,"st":4,"bm":0},{"ddd":0,"ind":3,"ty":0,"nm":"nar","refId":"comp_5","sr":1,"ks":{"o":{"a":1,"k":[{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"n":["0p833_0p833_0p167_0p167"],"t":15,"s":[100],"e":[0]},{"t":20}],"ix":11},"r":{"a":1,"k":[{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"n":["0p833_0p833_0p167_0p167"],"t":5,"s":[0],"e":[46]},{"t":21}],"ix":10},"p":{"a":0,"k":[497.5,499.25,0],"ix":2},"a":{"a":0,"k":[497.5,499.25,0],"ix":1},"s":{"a":1,"k":[{"i":{"x":[0.833,0.833,0.833],"y":[0.833,0.833,0.833]},"o":{"x":[0.167,0.167,0.167],"y":[0.167,0.167,0.167]},"n":["0p833_0p833_0p167_0p167","0p833_0p833_0p167_0p167","0p833_0p833_0p167_0p167"],"t":1,"s":[30,30,100],"e":[100,100,100]},{"i":{"x":[0.833,0.833,0.833],"y":[0.833,0.833,0.833]},"o":{"x":[0.167,0.167,0.167],"y":[0.167,0.167,0.167]},"n":["0p833_0p833_0p167_0p167","0p833_0p833_0p167_0p167","0p833_0p833_0p167_0p167"],"t":5,"s":[100,100,100],"e":[123,123,100]},{"i":{"x":[0.833,0.833,0.833],"y":[0.833,0.833,0.833]},"o":{"x":[0.167,0.167,0.167],"y":[0.167,0.167,0.167]},"n":["0p833_0p833_0p167_0p167","0p833_0p833_0p167_0p167","0p833_0p833_0p167_0p167"],"t":8,"s":[123,123,100],"e":[273.393,273.393,100]},{"t":14}],"ix":6}},"ao":0,"w":1000,"h":1000,"ip":0,"op":30,"st":0,"bm":0}]},{"id":"comp_1","layers":[{"ddd":0,"ind":1,"ty":0,"nm":"ROJO","refId":"comp_2","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":-301.855,"ix":10},"p":{"a":0,"k":[497.875,499.375,0],"ix":2},"a":{"a":0,"k":[496.944,499.56,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"w":1000,"h":1000,"ip":0,"op":30,"st":0,"bm":0},{"ddd":0,"ind":2,"ty":0,"nm":"ROJO","refId":"comp_2","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":-252.88,"ix":10},"p":{"a":0,"k":[497.875,499.375,0],"ix":2},"a":{"a":0,"k":[496.944,499.56,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"w":1000,"h":1000,"ip":0,"op":30,"st":0,"bm":0},{"ddd":0,"ind":3,"ty":0,"nm":"ROJO","refId":"comp_2","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":-198.233,"ix":10},"p":{"a":0,"k":[497.875,499.375,0],"ix":2},"a":{"a":0,"k":[496.944,499.56,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"w":1000,"h":1000,"ip":0,"op":30,"st":0,"bm":0},{"ddd":0,"ind":4,"ty":0,"nm":"ROJO","refId":"comp_2","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":-149.663,"ix":10},"p":{"a":0,"k":[497.875,499.375,0],"ix":2},"a":{"a":0,"k":[496.944,499.56,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"w":1000,"h":1000,"ip":0,"op":30,"st":0,"bm":0},{"ddd":0,"ind":5,"ty":0,"nm":"ROJO","refId":"comp_2","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":-99.267,"ix":10},"p":{"a":0,"k":[497.875,499.375,0],"ix":2},"a":{"a":0,"k":[496.944,499.56,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"w":1000,"h":1000,"ip":0,"op":30,"st":0,"bm":0},{"ddd":0,"ind":6,"ty":0,"nm":"ROJO","refId":"comp_2","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":-45.613,"ix":10},"p":{"a":0,"k":[497.875,499.375,0],"ix":2},"a":{"a":0,"k":[496.944,499.56,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"w":1000,"h":1000,"ip":0,"op":30,"st":0,"bm":0},{"ddd":0,"ind":7,"ty":0,"nm":"ROJO","refId":"comp_2","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":10.106,"ix":10},"p":{"a":0,"k":[497.875,499.375,0],"ix":2},"a":{"a":0,"k":[496.944,499.56,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"w":1000,"h":1000,"ip":0,"op":30,"st":0,"bm":0}]},{"id":"comp_2","layers":[{"ddd":0,"ind":1,"ty":4,"nm":"Shape Layer 1","sr":1,"ks":{"o":{"a":1,"k":[{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"n":["0p833_0p833_0p167_0p167"],"t":11,"s":[100],"e":[0]},{"t":14}],"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[500,500,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":1,"k":[{"i":{"x":0.833,"y":0.833},"o":{"x":0.167,"y":0.167},"n":"0p833_0p833_0p167_0p167","t":1,"s":[{"i":[[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0]],"v":[[0.75,-5.625],[-3.625,0],[3.375,-0.75]],"c":true}],"e":[{"i":[[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0]],"v":[[5.125,-10.125],[-3.625,0],[9.875,-1.75]],"c":true}]},{"i":{"x":0.833,"y":0.833},"o":{"x":0.167,"y":0.167},"n":"0p833_0p833_0p167_0p167","t":3,"s":[{"i":[[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0]],"v":[[5.125,-10.125],[-3.625,0],[9.875,-1.75]],"c":true}],"e":[{"i":[[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0]],"v":[[19.625,-19.625],[5.875,-4.5],[25.375,-7.75]],"c":true}]},{"i":{"x":0.833,"y":0.833},"o":{"x":0.167,"y":0.167},"n":"0p833_0p833_0p167_0p167","t":5.412,"s":[{"i":[[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0]],"v":[[19.625,-19.625],[5.875,-4.5],[25.375,-7.75]],"c":true}],"e":[{"i":[[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0]],"v":[[67.125,-43.625],[30.875,-18.5],[71.375,-36.25]],"c":true}]},{"i":{"x":0.833,"y":0.833},"o":{"x":0.167,"y":0.167},"n":"0p833_0p833_0p167_0p167","t":7.529,"s":[{"i":[[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0]],"v":[[67.125,-43.625],[30.875,-18.5],[71.375,-36.25]],"c":true}],"e":[{"i":[[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0]],"v":[[135.625,-79.625],[73.875,-42],[136.375,-77.25]],"c":true}]},{"i":{"x":0.833,"y":0.833},"o":{"x":0.167,"y":0.167},"n":"0p833_0p833_0p167_0p167","t":11,"s":[{"i":[[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0]],"v":[[135.625,-79.625],[73.875,-42],[136.375,-77.25]],"c":true}],"e":[{"i":[[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0]],"v":[[219.125,-134.125],[194.125,-119.75],[219.375,-133.5]],"c":true}]},{"t":14}],"ix":2},"nm":"Path 1","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"st","c":{"a":0,"k":[0,0,0,1],"ix":3},"o":{"a":0,"k":100,"ix":4},"w":{"a":0,"k":0,"ix":5},"lc":1,"lj":1,"ml":4,"ml2":{"a":0,"k":4,"ix":8},"nm":"Stroke 1","mn":"ADBE Vector Graphic - Stroke","hd":false},{"ty":"fl","c":{"a":0,"k":[0.125670728496,0.339342573577,0.65306372549,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transformar"}],"nm":"Shape 1","np":3,"cix":2,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":30,"st":0,"bm":0}]},{"id":"comp_3","layers":[{"ddd":0,"ind":1,"ty":0,"nm":"AMARILLO","refId":"comp_4","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":298.463,"ix":10},"p":{"a":0,"k":[497.75,500.5,0],"ix":2},"a":{"a":0,"k":[497.731,499.593,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"w":1000,"h":1000,"ip":0,"op":30,"st":0,"bm":0},{"ddd":0,"ind":2,"ty":0,"nm":"AMARILLO","refId":"comp_4","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":257.603,"ix":10},"p":{"a":0,"k":[497.75,500.5,0],"ix":2},"a":{"a":0,"k":[497.731,499.593,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"w":1000,"h":1000,"ip":0,"op":30,"st":0,"bm":0},{"ddd":0,"ind":3,"ty":0,"nm":"AMARILLO","refId":"comp_4","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":211.954,"ix":10},"p":{"a":0,"k":[497.75,500.5,0],"ix":2},"a":{"a":0,"k":[497.731,499.593,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"w":1000,"h":1000,"ip":0,"op":30,"st":0,"bm":0},{"ddd":0,"ind":4,"ty":0,"nm":"AMARILLO","refId":"comp_4","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":166.163,"ix":10},"p":{"a":0,"k":[497.75,500.5,0],"ix":2},"a":{"a":0,"k":[497.731,499.593,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"w":1000,"h":1000,"ip":0,"op":30,"st":0,"bm":0},{"ddd":0,"ind":5,"ty":0,"nm":"AMARILLO","refId":"comp_4","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":119.533,"ix":10},"p":{"a":0,"k":[497.75,500.5,0],"ix":2},"a":{"a":0,"k":[497.731,499.593,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"w":1000,"h":1000,"ip":0,"op":30,"st":0,"bm":0},{"ddd":0,"ind":6,"ty":0,"nm":"AMARILLO","refId":"comp_4","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":69.838,"ix":10},"p":{"a":0,"k":[497.75,500.5,0],"ix":2},"a":{"a":0,"k":[497.731,499.593,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"w":1000,"h":1000,"ip":0,"op":30,"st":0,"bm":0},{"ddd":0,"ind":7,"ty":0,"nm":"AMARILLO","refId":"comp_4","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":24.35,"ix":10},"p":{"a":0,"k":[497.75,500.5,0],"ix":2},"a":{"a":0,"k":[497.731,499.593,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"w":1000,"h":1000,"ip":0,"op":30,"st":0,"bm":0},{"ddd":0,"ind":8,"ty":0,"nm":"AMARILLO","refId":"comp_4","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":-22.692,"ix":10},"p":{"a":0,"k":[497.75,500.5,0],"ix":2},"a":{"a":0,"k":[497.731,499.593,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"w":1000,"h":1000,"ip":0,"op":30,"st":0,"bm":0}]},{"id":"comp_4","layers":[{"ddd":0,"ind":1,"ty":4,"nm":"Shape Layer 1","sr":1,"ks":{"o":{"a":1,"k":[{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"n":["0p833_0p833_0p167_0p167"],"t":13,"s":[100],"e":[0]},{"t":16}],"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[496.25,499.875,0],"ix":2},"a":{"a":0,"k":[-3.75,-0.125,0],"ix":1},"s":{"a":1,"k":[{"i":{"x":[0.833,0.833,0.833],"y":[0.833,0.833,0.833]},"o":{"x":[0.167,0.167,0.167],"y":[0.167,0.167,0.167]},"n":["0p833_0p833_0p167_0p167","0p833_0p833_0p167_0p167","0p833_0p833_0p167_0p167"],"t":2,"s":[229,229,100],"e":[176,176,100]},{"t":15}],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":1,"k":[{"i":{"x":0.833,"y":0.833},"o":{"x":0.167,"y":0.167},"n":"0p833_0p833_0p167_0p167","t":3,"s":[{"i":[[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0]],"v":[[0.75,-5.625],[-3.625,0],[3.375,-0.75]],"c":true}],"e":[{"i":[[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0]],"v":[[5.125,-10.125],[-3.625,0],[9.875,-1.75]],"c":true}]},{"i":{"x":0.833,"y":0.833},"o":{"x":0.167,"y":0.167},"n":"0p833_0p833_0p167_0p167","t":5,"s":[{"i":[[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0]],"v":[[5.125,-10.125],[-3.625,0],[9.875,-1.75]],"c":true}],"e":[{"i":[[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0]],"v":[[19.625,-19.625],[5.875,-4.5],[25.375,-7.75]],"c":true}]},{"i":{"x":0.833,"y":0.833},"o":{"x":0.167,"y":0.167},"n":"0p833_0p833_0p167_0p167","t":7.412,"s":[{"i":[[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0]],"v":[[19.625,-19.625],[5.875,-4.5],[25.375,-7.75]],"c":true}],"e":[{"i":[[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0]],"v":[[67.125,-43.625],[30.875,-18.5],[71.375,-36.25]],"c":true}]},{"i":{"x":0.833,"y":0.833},"o":{"x":0.167,"y":0.167},"n":"0p833_0p833_0p167_0p167","t":9.529,"s":[{"i":[[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0]],"v":[[67.125,-43.625],[30.875,-18.5],[71.375,-36.25]],"c":true}],"e":[{"i":[[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0]],"v":[[135.625,-79.625],[73.875,-42],[136.375,-77.25]],"c":true}]},{"i":{"x":0.833,"y":0.833},"o":{"x":0.167,"y":0.167},"n":"0p833_0p833_0p167_0p167","t":13,"s":[{"i":[[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0]],"v":[[135.625,-79.625],[73.875,-42],[136.375,-77.25]],"c":true}],"e":[{"i":[[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0]],"v":[[219.125,-134.125],[194.125,-119.75],[219.375,-133.5]],"c":true}]},{"t":16}],"ix":2},"nm":"Path 1","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"st","c":{"a":0,"k":[0,0,0,1],"ix":3},"o":{"a":0,"k":100,"ix":4},"w":{"a":0,"k":0,"ix":5},"lc":1,"lj":1,"ml":4,"ml2":{"a":0,"k":4,"ix":8},"nm":"Stroke 1","mn":"ADBE Vector Graphic - Stroke","hd":false},{"ty":"fl","c":{"a":0,"k":[0.985922181373,0.777212404737,0.310502085966,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transformar"}],"nm":"Shape 1","np":3,"cix":2,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":30,"st":0,"bm":0}]},{"id":"comp_5","layers":[{"ddd":0,"ind":1,"ty":0,"nm":"NARANJA","refId":"comp_6","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":-329.986,"ix":10},"p":{"a":0,"k":[498.25,499.75,0],"ix":2},"a":{"a":0,"k":[498.25,499.75,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"w":1000,"h":1000,"ip":0,"op":30,"st":0,"bm":0},{"ddd":0,"ind":2,"ty":0,"nm":"NARANJA","refId":"comp_6","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":-296.86,"ix":10},"p":{"a":0,"k":[498.25,499.75,0],"ix":2},"a":{"a":0,"k":[498.25,499.75,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"w":1000,"h":1000,"ip":0,"op":30,"st":0,"bm":0},{"ddd":0,"ind":3,"ty":0,"nm":"NARANJA","refId":"comp_6","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":-266.081,"ix":10},"p":{"a":0,"k":[498.25,499.75,0],"ix":2},"a":{"a":0,"k":[498.25,499.75,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"w":1000,"h":1000,"ip":0,"op":30,"st":0,"bm":0},{"ddd":0,"ind":4,"ty":0,"nm":"NARANJA","refId":"comp_6","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":-236.454,"ix":10},"p":{"a":0,"k":[498.25,499.75,0],"ix":2},"a":{"a":0,"k":[498.25,499.75,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"w":1000,"h":1000,"ip":0,"op":30,"st":0,"bm":0},{"ddd":0,"ind":5,"ty":0,"nm":"NARANJA","refId":"comp_6","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":-208.651,"ix":10},"p":{"a":0,"k":[498.25,499.75,0],"ix":2},"a":{"a":0,"k":[498.25,499.75,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"w":1000,"h":1000,"ip":0,"op":30,"st":0,"bm":0},{"ddd":0,"ind":6,"ty":0,"nm":"NARANJA","refId":"comp_6","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":-180.777,"ix":10},"p":{"a":0,"k":[498.25,499.75,0],"ix":2},"a":{"a":0,"k":[498.25,499.75,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"w":1000,"h":1000,"ip":0,"op":30,"st":0,"bm":0},{"ddd":0,"ind":7,"ty":0,"nm":"NARANJA","refId":"comp_6","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":-153.807,"ix":10},"p":{"a":0,"k":[498.25,499.75,0],"ix":2},"a":{"a":0,"k":[498.25,499.75,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"w":1000,"h":1000,"ip":0,"op":30,"st":0,"bm":0},{"ddd":0,"ind":8,"ty":0,"nm":"NARANJA","refId":"comp_6","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":-124.081,"ix":10},"p":{"a":0,"k":[498.25,499.75,0],"ix":2},"a":{"a":0,"k":[498.25,499.75,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"w":1000,"h":1000,"ip":0,"op":30,"st":0,"bm":0},{"ddd":0,"ind":9,"ty":0,"nm":"NARANJA","refId":"comp_6","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":-95.258,"ix":10},"p":{"a":0,"k":[498.25,499.75,0],"ix":2},"a":{"a":0,"k":[498.25,499.75,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"w":1000,"h":1000,"ip":0,"op":30,"st":0,"bm":0},{"ddd":0,"ind":10,"ty":0,"nm":"NARANJA","refId":"comp_6","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":-64.449,"ix":10},"p":{"a":0,"k":[498.25,499.75,0],"ix":2},"a":{"a":0,"k":[498.25,499.75,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"w":1000,"h":1000,"ip":0,"op":30,"st":0,"bm":0},{"ddd":0,"ind":11,"ty":0,"nm":"NARANJA","refId":"comp_6","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":-31.972,"ix":10},"p":{"a":0,"k":[498.25,499.75,0],"ix":2},"a":{"a":0,"k":[498.25,499.75,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"w":1000,"h":1000,"ip":0,"op":30,"st":0,"bm":0},{"ddd":0,"ind":12,"ty":0,"nm":"NARANJA","refId":"comp_6","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[498.25,499.75,0],"ix":2},"a":{"a":0,"k":[498.25,499.75,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"w":1000,"h":1000,"ip":0,"op":30,"st":0,"bm":0}]},{"id":"comp_6","layers":[{"ddd":0,"ind":1,"ty":4,"nm":"Shape Layer 1","sr":1,"ks":{"o":{"a":1,"k":[{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"n":["0p833_0p833_0p167_0p167"],"t":19,"s":[100],"e":[0]},{"t":24}],"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[500,500,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":1,"k":[{"i":{"x":0.833,"y":0.833},"o":{"x":0.167,"y":0.167},"n":"0p833_0p833_0p167_0p167","t":2,"s":[{"i":[[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0]],"v":[[5.125,-10.125],[-3.625,0],[9.875,-1.75]],"c":true}],"e":[{"i":[[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0]],"v":[[19.625,-19.625],[5.875,-4.5],[25.375,-7.75]],"c":true}]},{"i":{"x":0.833,"y":0.833},"o":{"x":0.167,"y":0.167},"n":"0p833_0p833_0p167_0p167","t":7,"s":[{"i":[[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0]],"v":[[19.625,-19.625],[5.875,-4.5],[25.375,-7.75]],"c":true}],"e":[{"i":[[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0]],"v":[[67.125,-43.625],[30.875,-18.5],[71.375,-36.25]],"c":true}]},{"i":{"x":0.833,"y":0.833},"o":{"x":0.167,"y":0.167},"n":"0p833_0p833_0p167_0p167","t":12,"s":[{"i":[[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0]],"v":[[67.125,-43.625],[30.875,-18.5],[71.375,-36.25]],"c":true}],"e":[{"i":[[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0]],"v":[[135.625,-79.625],[73.875,-42],[136.375,-77.25]],"c":true}]},{"i":{"x":0.833,"y":0.833},"o":{"x":0.167,"y":0.167},"n":"0p833_0p833_0p167_0p167","t":19,"s":[{"i":[[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0]],"v":[[135.625,-79.625],[73.875,-42],[136.375,-77.25]],"c":true}],"e":[{"i":[[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0]],"v":[[219.125,-134.125],[194.125,-119.75],[219.375,-133.5]],"c":true}]},{"t":25}],"ix":2},"nm":"Path 1","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"st","c":{"a":0,"k":[0,0,0,1],"ix":3},"o":{"a":0,"k":100,"ix":4},"w":{"a":0,"k":0,"ix":5},"lc":1,"lj":1,"ml":4,"ml2":{"a":0,"k":4,"ix":8},"nm":"Stroke 1","mn":"ADBE Vector Graphic - Stroke","hd":false},{"ty":"fl","c":{"a":0,"k":[0.151382551006,0.753048406863,0.606834680894,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transformar"}],"nm":"Shape 1","np":3,"cix":2,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":30,"st":0,"bm":0}]}],"layers":[{"ddd":0,"ind":1,"ty":0,"nm":"1","refId":"comp_0","sr":1.15,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[672,664,0],"ix":2},"a":{"a":0,"k":[500,500,0],"ix":1},"s":{"a":0,"k":[76,76,100],"ix":6}},"ao":0,"w":1000,"h":1000,"ip":25,"op":66.4,"st":25,"bm":0},{"ddd":0,"ind":2,"ty":0,"nm":"1","refId":"comp_0","sr":1.15,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[332,676,0],"ix":2},"a":{"a":0,"k":[500,500,0],"ix":1},"s":{"a":0,"k":[76,76,100],"ix":6}},"ao":0,"w":1000,"h":1000,"ip":13,"op":54.4,"st":13,"bm":0},{"ddd":0,"ind":3,"ty":0,"nm":"1","refId":"comp_0","sr":1.15,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[280,288,0],"ix":2},"a":{"a":0,"k":[500,500,0],"ix":1},"s":{"a":1,"k":[{"i":{"x":[0.833,0.833,0.833],"y":[0.833,0.833,0.833]},"o":{"x":[0.167,0.167,0.167],"y":[0.167,0.167,0.167]},"n":["0p833_0p833_0p167_0p167","0p833_0p833_0p167_0p167","0p833_0p833_0p167_0p167"],"t":28.2,"s":[132.4,132.4,100],"e":[61.4,61.4,100]},{"t":39.7004882881608}],"ix":6}},"ao":0,"w":1000,"h":1000,"ip":19,"op":60.4,"st":19,"bm":0},{"ddd":0,"ind":4,"ty":0,"nm":"1","refId":"comp_0","sr":1.15,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[668,304,0],"ix":2},"a":{"a":0,"k":[500,500,0],"ix":1},"s":{"a":0,"k":[72.4,72.4,100],"ix":6}},"ao":0,"w":1000,"h":1000,"ip":5,"op":46.4,"st":5,"bm":0},{"ddd":0,"ind":5,"ty":0,"nm":"1","refId":"comp_0","sr":1.15,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[497.438,499.5,0],"ix":2},"a":{"a":0,"k":[497.438,499.5,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"w":1000,"h":1000,"ip":11,"op":52.4,"st":11,"bm":0},{"ddd":0,"ind":6,"ty":0,"nm":"1","refId":"comp_0","sr":1.15,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[497.438,499.5,0],"ix":2},"a":{"a":0,"k":[497.438,499.5,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"w":1000,"h":1000,"ip":31,"op":72.4,"st":31,"bm":0},{"ddd":0,"ind":7,"ty":0,"nm":"1","refId":"comp_0","sr":1.15,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[497.438,499.5,0],"ix":2},"a":{"a":0,"k":[497.438,499.5,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"w":1000,"h":1000,"ip":0,"op":41.4,"st":0,"bm":0}],"markers":[]}

然后将您自己的任何 mp3 文件添加到声音效果的raw目录并将其命名为burst.mp3。将firefox.json 文件和 Burst.mp3文件添加到 raw 目录后，它看起来像这样，

第 4 步：使用 activity_main.xml 文件

我们已经为我们正在构建的应用程序添加了必要的资源文件。现在，让我们为我们的应用程序设计 UI。将此 XML 文件添加到app > res > layout 。下面是activity_main.xml文件的代码。

预览：

现在我们已经添加了所有必要的资源文件。

第 5 步：使用 主要活动。Java

现在是时候初始化 MainActivity 中的所有内容并实现填充星星和实现 ontouchlistener 的函数了。这是 MainActivity 的完整代码。下面是MainActivity 的代码。 Java文件。代码中添加了注释以更详细地理解代码。

Java

package com.cs.ecrackers;
  
import androidx.appcompat.app.AppCompatActivity;
  
import android.annotation.SuppressLint;
import android.content.pm.ActivityInfo;
import android.graphics.Point;
import android.media.MediaPlayer;
import android.os.Bundle;
import android.util.Log;
import android.view.Display;
import android.view.MotionEvent;
import android.widget.ImageView;
import android.widget.RelativeLayout;
import android.widget.Toast;
  
import com.airbnb.lottie.LottieAnimationView;
  
import java.util.Random;
  
public class MainActivity extends AppCompatActivity {
  
    int maxX,maxY;
    RelativeLayout layout;
    RelativeLayout.LayoutParams lp;
  
    @SuppressLint("ClickableViewAccessibility")
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
          
          // to hide action bar
        getSupportActionBar().hide();
          
          // to set orientation to potrait
        setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_PORTRAIT);
  
        // to get max value for x, y coordinates
        setMaxCoordinates();
  
        // initializing relative layout
        layout = (RelativeLayout) findViewById(R.id.layout);
          
          // layout params
        lp = new RelativeLayout.LayoutParams(maxX, maxY);
  
        // to populate stars randomly on screen
        populateStarsRandomly();
  
        // on touch listener for relative layout
        layout.setOnTouchListener((view, motionEvent) -> {
            // get coordinates
            int x = (int) motionEvent.getX() - 250;
            int y = (int) motionEvent.getY() - 250;
  
            // on touch
            if (motionEvent.getAction() == MotionEvent.ACTION_DOWN) {
                    burstFireworks(x,y);
            }
            return true;
        });
  
    }
  
    // to burst fireworks
    private void burstFireworks(int x, int y) {
        RelativeLayout.LayoutParams lp = new RelativeLayout.LayoutParams(maxX, maxY);
        // creating lottieAnimation view
        LottieAnimationView cracker = new LottieAnimationView(this);
        cracker.setLayoutParams(lp);
        // initializing lottie view from json file
        cracker.setAnimation(R.raw.fireworks);
        // setting height and width of lottie file
        cracker.getLayoutParams().height = 500;
        cracker.getLayoutParams().width = 500;
        // setting positions of lottie file
        cracker.setX(x);
        cracker.setY(y);
        // adding lottieanimationview to relative layout
        layout.addView(cracker);
        cracker.playAnimation();
        // function to generate sound
        burstSound();
    }
  
    // function to generate crackers sound
    private void burstSound() {
        MediaPlayer mp = MediaPlayer.create(this,R.raw.burst);
        mp.start();
    }
  
    // function to populate stars randomly on screen
    private void populateStarsRandomly() {
  
        float x,y;
  
        // random class to generate random coordinates
        Random random = new Random();
        // for loop to place 100 stars randomly
        for(int i=0; i<100; ++i){
            // generating random x coordinate
            x = random.nextInt(maxX);
            // generating random y coordinate
            y = random.nextInt(maxY);
            // placing star in x,y coordinate
            populateXY(x,y);
        }
    }
  
    // function to create and place star in x,y coordinates
    private void populateXY(float x, float y) {
        // creating imageview
        ImageView ivStar = new ImageView(this);
        ivStar.setLayoutParams(lp);
        // initializing image from drawable
        ivStar.setImageResource(R.drawable.star);
        // setting height and width of image
        ivStar.getLayoutParams().height = 15;
        ivStar.getLayoutParams().width = 15;
        // setting positions of image
        ivStar.setX(x);
        ivStar.setY(y);
        // adding imageview to relative layout
        layout.addView(ivStar);
    }
  
    // setting max coordinates of screen
    private void setMaxCoordinates() {
        Display disp = getWindowManager().getDefaultDisplay();
        Point mdispSize = new Point();
        disp.getSize(mdispSize);
        maxX = mdispSize.x;
        maxY = mdispSize.y;
    }
}

就是这样。现在我们可以运行应用程序了。确保您的项目包含以下所有文件。

这是最终应用程序的预览。

输出：