CN106447749A - 基于iOS***的音乐频谱跳动动画的实现方法 - Google Patents

基于iOS***的音乐频谱跳动动画的实现方法 Download PDF

Info

Publication number
CN106447749A
CN106447749A CN201610846337.3A CN201610846337A CN106447749A CN 106447749 A CN106447749 A CN 106447749A CN 201610846337 A CN201610846337 A CN 201610846337A CN 106447749 A CN106447749 A CN 106447749A
Authority
CN
China
Prior art keywords
animation
careplicatorlayer
attribute
layer
calayer
Prior art date
Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
Pending
Application number
CN201610846337.3A
Other languages
English (en)
Inventor
王斌
万蕾
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Sichuan Changhong Electric Co Ltd
Original Assignee
Sichuan Changhong Electric Co Ltd
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by Sichuan Changhong Electric Co Ltd filed Critical Sichuan Changhong Electric Co Ltd
Priority to CN201610846337.3A priority Critical patent/CN106447749A/zh
Publication of CN106447749A publication Critical patent/CN106447749A/zh
Pending legal-status Critical Current

Links

Classifications

    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06T—IMAGE DATA PROCESSING OR GENERATION, IN GENERAL
    • G06T13/00—Animation

Landscapes

  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • Processing Or Creating Images (AREA)

Abstract

本发明涉及移动应用开发领域，提供一种基于iOS***的音乐频谱跳动动画的实现方法，该方法包括：创建至少一个CAReplicatorLayer对象；设置CAReplicatorLayer对象决定如何进行复制图层的属性；创建一个CALayer对象作为基础图层；创建一个能够实现上下移动动画效果的Core Animation动画对象；将CALayer对象添加到CAReplicatorLayer容器，根据配置的复制参数进行复制，将实现的动画效果进行显示。本发明提出的技术方案通过充分使用***原生提供的技术，简化了实现此类动画的流程。

Description

基于iOS***的音乐频谱跳动动画的实现方法
技术领域
本发明属于移动应用开发领域，特别涉及一种基于iOS***的音乐频谱跳动动画的实现方法。
背景技术
随着移动互联网的快速发展，移动应用更注重人性化体验，而在移动应用的开发过程中动画效果越来越多的被使用，一款有着人性化体验动画的App自然能留住更多用户，在App的某个图文页面上，通过动画展示来描述了一个产品或场景比文字描述更加让App显得有生命力。因此，基于iOS***开发一款应用程序时，会经常使用到动画效果，在iOS***进行软件开发，若需要实现动画效果，可通过Core Animation库提供的各类方法属性制作出各种动画效果，这些动画效果需要添加到一个CALayer对象上面并显示，才能展示出所开发的动画，虽然Core Animation等库提供给开发者很多的基础动画，但是它不能够直接提供一些我们想要的复杂动画，所以需要我们利用iOS提供的这些基础动画库去配合开发实现自定义的动画。
当需要开发一款类似于音频频谱跳动的动画时，比如应用正在播放音频时，为了有一个标示正在播放中的状态，一个模仿音频频谱持续跳动的动画自然会让用户知晓当前音频正在播放中，这可代替了生硬的文字描述，给用户提供更优越的体验。虽然可以通过添加多个CALayer来实现，但是该方法会使***代码变得很复杂，而且也无法充分利用iOS操作***提供的既有技术，不能提供良好的动画性能。
发明内容
【要解决的技术问题】
本发明的目的是提供一种基于iOS***的音乐频谱跳动动画的实现方法，以解决以上技术问题之一。
【技术方案】
本发明是通过以下技术方案实现的。
本发明涉及一种基于iOS***的音乐频谱跳动动画的实现方法，该方法包括以下步骤：
A、创建至少一个CAReplicatorLayer对象，设置CAReplicatorLayer对象的大小位置和背景颜色，所述CAReplicatorLayer对象作为复制图层的容器；
B、设置CAReplicatorLayer对象决定如何进行复制图层的属性；
C、创建一个CALayer对象作为基础图层，设置其相对于容器的属性，所述属性至少包括位置、大小、颜色参数；
D、创建一个能够实现上下移动动画效果的Core Animation动画对象；
E、将CALayer对象添加到CAReplicatorLayer容器，根据步骤A配置的复制参数进行复制，将步骤D中实现的动画效果进行显示。
作为一种优选的实施方式，所述创建的CAReplicatorLayer对象位置大小通过配置frame、bounds、position属性设置，所述创建的CAReplicatorLayer对象的背景颜色通过backgroundColor属性设置。
作为另一种优选的实施方式，所述步骤B包括以下步骤：
通过instanceCount设置复制多少个图层；
通过instanceTransform属性设置复制的图层副本之间的距离和旋转；
通过instanceDelay属性设置图层副本间的延迟；
通过masksToBounds设置裁剪超出图层容器的子图层。
作为另一种优选的实施方式，所述创建的CALayer对象相对于CAReplicatorLayer容器的位置和大小通过frame、bounds、position属性设置，所述创建的CALayer对象的颜色通过backgroundColor属性设置，所述创建的CALayer对象的圆角半径通过cornerRadius属性设置。
【有益效果】
本发明提出的技术方案具有以下有益效果：
本发明基于iOS***中的CAReplicatorLayer来实现模拟音频频谱跳动动画，通过充分使用***原生提供的技术，简化了实现此类动画的流程，提高了代码后期维护的灵活性，同时也增强了动画性能稳定性，能够大大提升用户体验。
附图说明
图1为本发明的实施例一提供的基于iOS***的音乐频谱跳动动画的实现方法的流程图。
具体实施方式
为使本发明的目的、技术方案和优点更加清楚，下面将对本发明的具体实施方式进行清楚、完整的描述。
实施例一
图1为本发明实施例一提供的基于iOS***的音乐频谱跳动动画的实现方法的流程图。如图1所示，该步骤包括步骤S1至步骤S5，下面分别对各个步骤进行详细介绍。
步骤S1：创建一个CAReplicatorLayer对象作为图层容器，设置CAReplicatorLayer对象的大小位置和背景颜色。
本实施例中，CAReplicatorLayer对象作为复制图层的容器。具体地，创建的CAReplicatorLayer对象位置大小通过配置frame、bounds、position属性设置，创建的CAReplicatorLayer对象的背景颜色通过backgroundColor属性设置。
步骤S2：设置CAReplicatorLayer对象决定如何进行复制图层的属性。
具体地，本实施例中，设置CAReplicatorLayer对象决定如何进行复制图层的属性包括：
通过instanceCount设置复制多少个图层；
通过instanceTransform属性设置复制的图层副本之间的距离和旋转；
通过instanceDelay属性设置图层副本间的延迟；
通过masksToBounds设置裁剪超出图层容器的子图层。
步骤S3：创建一个CALayer对象作为基础图层，设置其相对于容器的属性。
其中，属性包括位置、大小、颜色参数，具体地，本实施例中，创建的CALayer对象相对于CAReplicatorLayer容器的位置和大小通过frame、bounds、position属性设置，创建的CALayer对象的颜色通过backgroundColor属性设置，创建的CALayer对象的圆角半径通过cornerRadius属性设置。
步骤S4：创建一个能够实现上下移动动画效果的Core Animation动画对象。
在本实施例中可以通过创建CABasicAnimation对象，设置KeyPath为position.y，通过改变keyPath的值实现上下移动动画；添加到CALayer对象上后即可使CALayer对象具有上下移动的动画效果，CAReplicatorLayer容器复制时会把动画也进行复制。
步骤S5：将CALayer对象添加到CAReplicatorLayer容器，实现动画效果的显示。
具体地，将CALayer对象添加到CAReplicatorLayer容器，根据步骤S1配置的复制参数进行复制，将步骤S4中实现的动画效果进行显示。通过屏幕显示后，就能实现模拟音频频谱跳动动画效果。
需要说明，在实施例一的基础上，在具体的开发过程中，也可以根据开发者不同的需求创建多个CAReplicatorLayer容器、多个CALayer对象，添加多个动画效果，以实现更为复杂的动画效果。
从以上实施例可以看出，本发明实施例首先创建一个CAReplicatorLayer对象作为Layer的容器，然后创建了一个CALayer对象并通过Core Animation添加自定义的不断上下移动的动画效果，由于添加到容器上的子Layer可以复制若干份，所以将创建的Layer添加到该容器中后，设定子Layer复制份数、与复制Layer副本之间的距离、透明度、颜色、旋转、位置等状态属性后，即可实现一个模仿音频频谱跳动的动画效果，并能保证动画效果的性能较好，内存使用很低。
本发明实施例基于iOS***中的CAReplicatorLayer来实现模拟音频频谱跳动动画，通过充分使用***原生提供的技术，简化了实现此类动画的流程，提高了代码后期维护的灵活性，同时也增强了动画性能稳定性，能够大大提升用户体验。
需要说明，上述描述的实施例是本发明的一部分实施例，而不是全部实施例，也不是对本发明的限制。基于本发明的实施例，本领域普通技术人员在不付出创造性劳动前提下所获得的所有其他实施例，都属于本发明的保护范围。

Claims (4)

1.一种基于iOS***的音乐频谱跳动动画的实现方法，其特征在于包括以下步骤：
A、创建至少一个CAReplicatorLayer对象，设置CAReplicatorLayer对象的大小位置和背景颜色，所述CAReplicatorLayer对象作为复制图层的容器；
B、设置CAReplicatorLayer对象决定如何进行复制图层的属性；
C、创建一个CALayer对象作为基础图层，设置其相对于容器的属性，所述属性至少包括位置、大小、颜色参数；
D、创建一个能够实现上下移动动画效果的Core Animation动画对象；
E、将CALayer对象添加到CAReplicatorLayer容器，根据步骤A配置的复制参数进行复制，将步骤D中实现的动画效果进行显示。
2.根据权利要求1所述的基于iOS***的音乐频谱跳动动画的实现方法，其特征在于所述创建的CAReplicatorLayer对象的位置大小通过配置frame、bounds、position属性设置，所述创建的CAReplicatorLayer对象的背景颜色通过backgroundColor属性设置。
3.根据权利要求1所述的基于iOS***的音乐频谱跳动动画的实现方法，其特征在于所述步骤B包括以下步骤：
通过instanceCount设置复制多少个图层；
通过instanceTransform属性设置复制的图层副本之间的距离和旋转；
通过instanceDelay属性设置图层副本间的延迟；
通过masksToBounds设置裁剪超出图层容器的子图层。
4.根据权利要求1所述的基于iOS***的音乐频谱跳动动画的实现方法，其特征在于所述创建的CALayer对象相对于CAReplicatorLayer容器的位置和大小通过frame、bounds、position属性设置，所述创建的CALayer对象的颜色通过backgroundColor属性设置，所述创建的CALayer对象的圆角半径通过cornerRadius属性设置。
CN201610846337.3A 2016-09-23 2016-09-23 基于iOS***的音乐频谱跳动动画的实现方法 Pending CN106447749A (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN201610846337.3A CN106447749A (zh) 2016-09-23 2016-09-23 基于iOS***的音乐频谱跳动动画的实现方法

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201610846337.3A CN106447749A (zh) 2016-09-23 2016-09-23 基于iOS***的音乐频谱跳动动画的实现方法

Publications (1)

Publication Number Publication Date
CN106447749A true CN106447749A (zh) 2017-02-22

Family

ID=58167261

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201610846337.3A Pending CN106447749A (zh) 2016-09-23 2016-09-23 基于iOS***的音乐频谱跳动动画的实现方法

Country Status (1)

Country Link
CN (1) CN106447749A (zh)

Cited By (1)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN106971413A (zh) * 2017-03-13 2017-07-21 武汉斗鱼网络科技有限公司 动画信息展示方法及装置

Citations (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20100302254A1 (en) * 2009-05-28 2010-12-02 Samsung Electronics Co., Ltd. Animation system and methods for generating animation based on text-based data and user information
CN102938158A (zh) * 2011-10-18 2013-02-20 微软公司 通过直接操纵来构建动画时间线
CN104123742A (zh) * 2014-07-21 2014-10-29 徐才 一种将静态漫画图片转化为二维动画的方法和播放器

Patent Citations (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20100302254A1 (en) * 2009-05-28 2010-12-02 Samsung Electronics Co., Ltd. Animation system and methods for generating animation based on text-based data and user information
CN102938158A (zh) * 2011-10-18 2013-02-20 微软公司 通过直接操纵来构建动画时间线
CN104123742A (zh) * 2014-07-21 2014-10-29 徐才 一种将静态漫画图片转化为二维动画的方法和播放器

Non-Patent Citations (1)

* Cited by examiner, † Cited by third party
Title
付宇轩: "CALayer动画实践（二）：CAReplicatorLayer的用法", 《URL：HTTPS://WWW.CSDN.NET/ARTICLE/2015-09-09/2825659/1》 *

Cited By (1)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN106971413A (zh) * 2017-03-13 2017-07-21 武汉斗鱼网络科技有限公司 动画信息展示方法及装置

Similar Documents

Publication Publication Date Title
US10880595B2 (en) Method and apparatus for adjusting virtual reality scene, and storage medium
CN104007967B (zh) 一种基于可扩展标记语言的用户界面生成方法和装置
CN106126733A (zh) 一种更换css样式的方法及***
CN108933895A (zh) 三维粒子特效生成方法、装置和电子设备
US20150138211A1 (en) Method and Device for Loading and Unloading Object Hierarchically in Three-Dimensional Virtual Reality Scene
CN104778735B (zh) 一种基于不规则图形的动画生成方法和装置
CN107077746A (zh) 用于网络传输和实时渲染的3d纹理模型的自动优化的***、方法和计算机程序产品
CN106447749A (zh) 基于iOS***的音乐频谱跳动动画的实现方法
CN107077347A (zh) 视图管理架构
CN104407893B (zh) 展示动画的方法及装置
CN107230244A (zh) 一种动画文件的生成方法和渲染***
CN111145318A (zh) 一种基于ngui的渲染方法及装置
Li [Retracted] Visualization Display System of Gannan Hakka Paper‐Cut Works Based on Computer Graphics Algorithm
CN107277633B (zh) 一种展示直播间礼物效果的方法及装置
CN106372200A (zh) 显示图片资源的方法和装置
KR20150085869A (ko) 계층형 구조 및 타임라인을 이용한 앱북 빌더 시스템
TW201913351A (zh) 視圖組件的佈局方法及設備
CN103544263A (zh) 一种移动终端的渲染方法及装置
TWI273459B (en) Graphics rendering system and method thereof
Wong et al. Flow‐Based Automatic Generation of Hybrid Picture Mazes
CN104361011A (zh) 一种动态显示颜色的实现方法和装置
Jacob Beyond the flatline
Fregonese et al. The French Cultural Strategy and the Japanese Paradigm: How to Seduce in International Relations in the 21st Century?
Wang Research on the development path of local opera communication in the age of convergence media
CN108510563A (zh) 一种模仿装饰艺术风格Art-Deco进行的图案快速生成方法

Legal Events

Date Code Title Description
C06 Publication
PB01 Publication
C10 Entry into substantive examination
SE01 Entry into force of request for substantive examination
RJ01 Rejection of invention patent application after publication
RJ01 Rejection of invention patent application after publication

Application publication date: 20170222