一、增强 Android 应用:使用新媒体素材
欢迎来到 Android Studio 新媒体基础。这本书将带你了解新媒体原则和概念的基础,让你对 Android Studio 和 Android OS 在新媒体支持领域所提供的东西有一个坚实的基础。新媒体,有时被称为富媒体或多媒体,跨越了许多专业的艺术家职业,这就是为什么一个多媒体制作人必须擅长制作所有形式的新媒体。这本书旨在增强您对新媒体基础知识的了解,以及它们如何应用于 Android Studio,以便您可以制作更刺激感官的 Android 应用,从而更受欢迎!
在这一章中,你将看到 Android 操作系统支持的不同形式的新媒体,以及它们如何帮助你的应用在竞争中脱颖而出。您还将为每种新媒体类型安装专业质量的开源软件应用,以便能够为 Android 应用制作新的媒体内容。
本书假设您已经熟悉了 Android Studio 及其特性集——您已经下载并安装了它,并且正忙于编写 Android 应用。我写这本书是为了增强你对 Android Studio 等式的新媒体部分的知识,这样你就能够向你的 Android 应用添加定制的多媒体资源,而不是使用操作系统自带的 UI 组件。
在本书的其余部分,每种新媒体类型(流派)有两个章节,让您快速了解基础知识,并了解 Android Studio 如何支持这些新媒体类型;您还将了解数据占用优化的原则。
这本书没有涉及 Android Studio,至少没有直接涉及;我假设您已经下载并安装了 Android Studio,并且您知道一些基础知识。如果你需要这些基础知识,我有一本《绝对初学者的 Android 应用》( Apress,2014)涵盖了这些主题。
新媒体类型:多媒体饼图切片
有许多不同类型(或流派)的新媒体,所有这些都在 Java 和 JavaFX(支持 Android 和 Linux 内核)以及 Android OS 中得到支持。这些支持把我喜欢称之为新媒体的“素材”添加到 Android 应用代码中。我猜大多数你都很熟悉:像 Pinterest 或 Instagram 上的数字图像,或者像 Spotify 或 Pandora 上的数字音频。数字视频可以用来播放电影或你喜欢的电视节目。不太多产的新媒体类型包括 2D 矢量或看起来像 2D 卡通的数字插图媒体,以及 3D 矢量或交互式 3D 媒体,就像你看到的人们在 Xbox 等流行的游戏机上玩体育或冒险游戏。所有这些例子都是高感官用户体验,所以在你的 Android 应用开发过程中添加新的媒体素材或元素就是如何让你的应用更上一层楼!
将你的应用从人群中分离出来:新媒体
在 Android Studio 中,将新媒体素材整合到您的 Android 应用开发中的主要优势是您可以添加到应用中的视觉和听觉“惊喜因素”。这使它有别于其他应用,并代表你的用户产生口碑营销效果,而你不必为此付费。这就是我所说的“意外之财”,这也是本书的目标,即带给你 Android 应用开发知识库和 Android Studio 内容制作的新媒体素材。例如,在涉及数字图像时,不要使用纯色背景,而是使用柔和的纹理或微妙的颜色渐变,这实际上是数字插图,你会在本书的课程中学到这一点(没有双关语)。
就数字音频而言,自定义音频用户界面声音用于用户交互反馈,用户会感觉他们更紧密地联系在一起,或者是你的 Android 应用的一部分。数字音频比您可能给予的高质量音频信用更能增强用户体验!
数字视频和交互式 3D 更多地是在应用增强频谱的内容制作方面,而不是在用户界面设计方面;然而,它们同样重要。经过良好优化的数字视频可以通过较慢的连接更流畅地播放,除了流行的 3D 游戏,交互式 3D 或 i3D 应用很少。
接下来让我们看看 Android 操作系统包含的新媒体文件格式。我所说的“包含”是指文件格式的编解码器(code-decode)实际上是 Android 操作系统的一部分,并且已经安装在硬件上了!
Android Studio 新媒体支持:文件格式
将新媒体内容制作与 Android Studio 开发环境联系起来的关键是 Android 5 或更高版本当前支持的新媒体文件格式。大部分都是 Android 4 支持的。Android 的早期版本也支持其中的许多功能,如 1.6、2.37 和 3.2。运行这些版本 Android 的设备变得越来越难找;很快你所要担心的就是 32 位的 Android 4.4 和 64 位的 Android 5.4。Android 的专业版本(如 Android Wear、Android TV 或 Android Auto SDK)支持这些相同的新媒体文件(数据)格式和编解码器。所以不用担心!表 1-1 总结了这些流行的新媒体文件格式。
表 1-1。
Android New Media File Format Support by Version
| 新媒体文件格式 | 新媒体类型 | Android 操作系统版本级别 | | --- | --- | --- | | PNG8, PNG24, PNG32 | 数字图像 | 所有操作系统版本 | | 联合图像专家组 | 数字图像 | 所有操作系统版本 | | WebP | 数字图像 | Android OS 4.0+ | | GIF 格式 | 数字图像 | 所有操作系统版本 | | 挽救(saving 的简写) | 数字插图 | 所有操作系统版本 | | 计算机图形学 | 三维(three dimension 的缩写) | 所有操作系统版本 | | WebM (VP8、VP9) | 数字视频 | Android OS 2.3.3+ | | MPEG-4 | 数字视频和音频 | 所有操作系统版本 | | MPEG-3 | 数字音频 | 所有操作系统版本 | | 还有沃比斯 | 数字音频 | 所有操作系统版本 | | 无损音频编解码器 | 数字音频 | Android OS 3.1+ | | 波浪 | 数字音频 | 所有操作系统版本 | | 伊法夫 | 数字音频 | 所有操作系统版本 | | 自主移动机器人(Adaptive Multi-Rate 的缩写) | 数字音频 | 所有操作系统版本 |Android Studio 数字图像支持目前包括 JPEG、PNG、GIF 和 WebP。您将在第三章了解每种格式的属性,该章涵盖了数字图像优化,但我相信您知道 JPEG 是使用最广泛的数字图像格式,CompuServe GIF 是最古老的数字图像格式,而 PNG(便携式网络图形)是最新的数字图像格式。WebP 是与您的 WebM 视频编解码器相同的编解码器,除了它是压缩一帧,通常称为“静止”图像。
Android Studio 数字音频支持目前包括 MPEG4 音频(M4A)、MPEG3 音频(MP3)、免费无损音频编解码器(FLAC)、OGG Vorbis、Windows Wave (WAV)音频、Macintosh 音频交错文件格式(AIFF)以及许多其他格式。在第五章中,您将了解每种技术的属性,这一章涵盖了数字音频数据足迹优化。
Android Studio 数字视频支持目前包括 MPEG4 AVC 和 WebM (VP8 和 VP9)。虽然数字音频支持范围很广,但数字视频支持仅包括两种编解码器产品,即 HTML5 中支持的两种编解码器。这两种编解码器都是开源的,因为谷歌收购了 ON2,并将 VP8 和 VP9 (WebM)编解码器开源。MPEG 专利将于 2027 年到期(全部),尽管有些已经到期。HTML5 和 Android 已经授权 MPEG4,所以你可以在 Android 中使用。您将在第七章中了解这些编解码器,其中涵盖了数字视频数据占用空间优化。
Android Studio 使用可缩放矢量图形(SVG)来支持数字插图;事实上,Java(通过 JavaFX)支持一个完整的类库,允许您创建、读取、呈现 SVG 数字插图数据并制作动画。在第九章中,当讨论到数字插图数据占用优化时,您将了解到其中每一个的属性。
3D 建模和动画支持 OpenGL,以及 OpenGL 导入程序支持的所有 3D 数据格式,如。FBX。DAE (Collada)、. 3DS (3D Studio)、。OBJ(波前),. X3D,.STL(立体平版印刷)和其他开放的 3D 几何格式。你将在第十章中找到每一种 i3D 数据格式,其中涵盖了 3D 建模、渲染和动画概念。
下载并安装您的软件
在这一章的后半部分,我将用几页的篇幅向大家展示一个专业级的开源软件包,分别适用于本书中涉及的五种新媒体类型。这样,如果您没有涵盖这种新媒体开发类型的软件包,您可以下载并安装一个免费的商业使用软件包,它具有付费软件包所具有的所有专业功能。一旦您安装并启动这些软件包,您将会惊讶于它们所提供的价值。
数字图像编辑和合成:GIMP
你需要有一个这样或那样的数字成像软件包。如果您没有任何数字成像软件,您可以使用免费的商业版 GIMP 2.8.14,这是当前的稳定版本,至少在 2016 年 GIMP 3.0 问世之前是如此。
要下载 GIMP 2.8.14,进入 www.gimp.org
网站,点击橙色的下载按钮;或者,点击下载链接,如图右侧 1-1 所示。
图 1-1。
Go to gimp.org and click the Download button
为您的操作系统下载 GIMP-2.8.14.exe 安装程序文件,双击它开始安装。安装程序可以确定您是需要 32 位版本还是 64 位版本,因此您所要做的就是选择您希望在软件中使用的语言,然后单击“确定”按钮。您将看到一个 GIMP 安装对话框,在这里您单击 Install 按钮开始安装过程。
如果您想要自定义安装,可以单击“自定义”按钮,并准确选择要在系统上安装的组件。我建议您使用完全安装。这为您提供了一个基本的 GIMP 软件安装,包括所有稳定的插件、过滤器和文件导出支持。
安装过程完成后,单击 Finish 按钮,为您的操作系统的快速启动任务栏创建一个快捷图标,这样您就可以通过单击来启动 GIMP。
数字音频编辑和效果:大胆
您需要一个数字音频编辑和效果软件包来处理音频。如果你没有自己的理由,你可以使用开源的 Audacity 2.1 软件。
要下载 Audacity 2.1.1,这是当前的稳定版本,进入 www.audacityteam.org
,点击蓝色下载 Audacity 2.1.1 链接,如图 1-2 所示;或者,点击 Audacity 徽标下的下载选项卡。
图 1-2。
Go to audacityteam.org and click Download
下载 audacity-win-2.1.1.exe 安装程序文件(我的是 Windows 8 操作系统的)。下载完成后,双击它开始安装。该软件目前是 32 位版本,除非您使用的是 64 位 Linux,所以您所要做的就是选择您希望在该软件中使用的安装语言,然后单击 OK 按钮。接下来,您将看到欢迎使用 Audacity 安装向导对话框,它建议您关闭所有打开的程序。
单击“下一步”按钮并查看许可信息屏幕,然后单击“下一步”按钮前进到“目标位置说明”对话框,然后单击“下一步”接受在C:\Program Files(x86)\Audacity
文件夹中的默认安装位置。单击“下一步”,将出现“选择附加任务”对话框,允许您选择创建桌面图标和重置首选项的选项。
单击“下一步”显示“准备安装”对话框,然后单击“安装”按钮开始安装过程。安装对话框向您显示进度条,安装完成后,您会看到一个对话框,其中有启动 Audacity 的选项。选择此选项,然后单击“完成”按钮。看一看 Audacity——你会发现它相当令人印象深刻。
在您的操作系统上为快速启动任务栏创建一个快捷图标,这样您只需单击一下就可以启动 Audacity。
数字视频编辑和效果:Lightworks
所有 Android 开发人员都应该有一个这样或那样的专业数字视频编辑和特效软件包,无论是 Adobe AfterEffects,索尼 Vegas Pro,还是苹果 Final Cut Pro。如果您没有这些软件,您可以下载免费的商业版 Editshare Lightworks 12.5。
要下载 Lightworks 12.5,请前往 www.lwks.com
。如果您没有帐户,请创建一个,以便能够下载 Lightworks 12.5 的免费版本。点击图 1-3 左上角的蓝色下载按钮,然后点击您正在运行的操作系统的选项卡。
图 1-3。
Go to lwks.com and click the Downloads tab
对我来说,这是 Windows 8.1 操作系统。单击与您的操作系统匹配的版本;对于大多数人来说,这应该是 64 位的。
要确定您的计算机是 32 位还是 64 位,请右键单击开始菜单(Window 7、XP 或 Vista)中的计算机链接,然后选择属性。在 Windows 8.1 或 10 中,右键单击 Windows 菜单图标,并选择系统菜单选项,这将显示计算机系统信息对话框。
在其他操作系统上,您也可以在操作系统控制面板中的“计算机”或“系统”下查看此信息,该信息表明计算机系统运行的是 32 位还是 64 位操作系统。
我点击了 64 位下载按钮来下载用于 Windows 的 light works _ 12.5 _ full _ 64 bit _ setup . exe 安装程序文件,并双击它开始安装。
第一个安装程序语言对话框要求您选择要在软件中使用的语言。单击 OK 按钮,欢迎使用 Lightworks 设置。
单击下一步。在“许可协议”对话框中,选择“我接受许可协议条款”选项,然后再次单击“下一步”按钮。保留“选择组件”对话框的默认设置,并再次单击“下一步”按钮。
保留“选择安装位置”对话框的默认设置,然后单击“下一步”在C:\Program Files\Lightworks
文件夹中安装 Lightworks。单击下一步。出现“选择开始菜单文件夹”对话框,允许您再次接受明显的 Lightworks 文件夹名称默认设置。
一旦你点击下一步按钮,你会看到一个安装对话框的进度条,在这里你可以观察安装过程——如果你是一个快速阅读者的话。安装完成后,单击下一步按钮,然后单击完成按钮。
为操作系统的快速启动任务栏创建一个快捷图标,这样只需单击一下就可以启动 Lightworks。
数字插图和 2D 建模:Inkscape
因为 Java、JavaFX 和 Android 都 100%支持 SVG,所以您还需要一种或另一种数字插图软件,无论是 Adobe Illustrator、Corel Draw 还是 Macromedia Freehand。如果你没有这些,你可以使用免费的商业用 Inkscape 软件包,它拥有你在专业水平上使用 SVG 2D 矢量数据所需的所有功能。
要下载 Inkscape 0.91,这是 Inkscape 的当前稳定版本,请进入 www.inkscape.org
并点击绿色下载按钮,如图 1-4 所示;或者单击网站左上角的下载链接。Inkscape 支持其软件的 32 位和 64 位版本;我假设您现在已经确定了您的操作系统的位级!我下载的文件是 inkscape-0.91-x64.msi 安装程序文件。双击操作系统位级的安装程序文件开始安装。
图 1-4。
Go to inkscape.org and click the Download button
启动 Inkscape 安装程序后,您会看到欢迎使用 Inkscape 安装向导对话框。单击“下一步”按钮进入“最终用户许可协议”对话框。
选择“我接受许可协议中的条款”复选框,然后单击“下一步”按钮进入“选择安装类型”对话框。单击典型按钮,然后单击安装按钮开始安装。您会看到“安装 Inkscape”对话框,它会告诉您正在安装什么。
安装过程完成后,单击“完成”按钮,并为您的操作系统的快速启动任务栏创建一个快捷图标,这样,如果需要,只需单击鼠标即可启动 Inkscape。
3D 建模、渲染和动画:Blender
Java、JavaFX 和 Android 也通过称为 OpenGL 的开源 3D 图形库支持 3D 新媒体。因此,你还需要有一种或另一种风格的 3D 建模和动画软件,无论是 Autodesk 3D Studio Max、Cinema 4D XL 还是 NewTek Lightwave。如果您没有任何这些,您可以使用免费的商业用途 Blender 软件包,它具有您在专业水平上处理 OpenGL 3D 矢量数据和 3D 格式所需的所有功能。
要下载 Blender 2.76,Blender 的当前稳定版本(在下一个版本 2.8 之前,预计在 2016 年的某个时间推出,以及备受期待的 Blender 3.0 的前身),请前往 www.blender.org
并单击蓝色下载按钮,或者您可以单击下载链接,如图 1-5 所示。
图 1-5。
Go to blender.org and click the download cloud
Blender 支持 32 位和 64 位版本的软件;我假设您现在已经确定了您的操作系统的位级,所以选择与您的操作系统匹配的版本。我下载的文件是 blender-2.75a-windows64.msi 安装程序文件。双击安装程序文件开始安装。
一旦你点击确定按钮,你会得到一个欢迎搅拌机设置向导对话框。单击“下一步”按钮,进入“最终用户许可协议”对话框。
选择“我接受许可协议中的条款”复选框,然后单击“下一步”按钮进入自定义设置对话框。接受默认功能设置,然后单击下一步按钮。然后单击“安装”按钮开始安装。你会看到安装 Blender 对话框,它会告诉你正在实时安装什么。
安装过程完成后,单击“完成”按钮并为操作系统的快速启动任务栏创建一个快捷图标,这样您就可以在需要时启动 Blender 3D。
摘要
这一章提供了新媒体的概述,包括一般的和在 Android Studio 和 Android OS 环境下的。你看了看不同的新媒体类型,发现了为什么它们可以帮助你的 Android 应用脱颖而出。您了解了 Android 操作系统和 Android Studio 允许您利用不同的文件格式来为您的 Android 软件创作增加视觉和听觉效果。
在本章的第二部分,您确保安装了领先的开源新媒体内容制作软件包,并准备好进行探索。
在下一章中,你将会看到像素是如何存储在 X,Y 数组中的,你将会学到长宽比,颜色深度,抗锯齿,以及其他一些重要的成像概念。
二、数字图像:概念和术语
现在,您已经了解了新媒体内容的主要领域以及 Android Studio 和 Android OS 支持的文件格式,是时候一个接一个地分解这些多媒体内容了,一次两章。让我们从数字图像开始,因为它是最多产、最受欢迎和最主流的新媒体类型。我将在这一章中讲述一切,从构成这些光栅图像的像素构建块到包含像素的数组以及定义该数组的分辨率和纵横比。您将看到像素特征,如位置、颜色通道、alpha 通道、颜色深度,甚至高级主题,如 PorterDuff 混合模式和 NinePatchDrawables,这两种模式都在 Android API 中受支持,它们有自己的类、方法和常数。
您将了解基于 2D 像素的光栅图像与基于 2D(或 3D)顶点和直线(或曲线)的矢量图像之间的区别。既然您现在拥有了 GIMP,我可以用 GIMP 展示书中的概念,您也可以跟着我。
单个像素只是空间中的一个点,被称为 1D 或一维(不要这样称呼你的配偶),而图像实际上是像素的 2D 阵列或网格,同时使用 X 和 Y 维度。
像素:您的数字图像构建模块
数字图像由二维或 2D 阵列(或网格)组成,其中包含一些称为“像素”的东西这个行业术语 pixel 是两个术语的组合:图片(通常称为“pix”)和元素(简称为“els”)。因此,你将在 Android Studio 中使用的任何数字图像的基础都是它的图片元素。这些像素决定了数字图像素材的一切,如文件大小、尺寸、颜色、透明度和形状。需要注意的是,数字插图资源不是由像素组成的。
光栅与矢量:图像与插图
除了像素这个术语,让我们先来区分一些与像素相关的关键术语,以便清楚地定义数字图像和数字插图之间的区别。由像素组成的图像在技术上被称为光栅图像。其原因是因为像素阵列被显示像素的设备显示屏“光栅化”。这些硬件设备包括从 iTV 到平板电脑、电子书阅读器、智能手机、智能手表、上网本、笔记本电脑到个人电脑的所有设备。
还有另一种类型的数字图像称为“矢量”图像,它是使用数学而不是像素来定义的。矢量图像使用 2D 空间中称为顶点的点,以及将这些顶点连接在一起的线或曲线,根据指令“绘制”出您的数字插图,这些指令是基于文本的,可以被视为标记或代码。
“数字插图”是新媒体行业对矢量图像的通俗称呼。矢量图像有自己的“流派”的 2D 软件,称为数字插图软件。您已经在前一章下载并安装了 Inkscape,因此您已经为第八章准备好了它。3D 矢量图像称为 3D 渲染,动画 3D 矢量项目称为 3D 动画。添加编程逻辑,3D 矢量项目被称为交互式 3D,或 i3D。你会在第十章中看到 i3D 新媒体。
渲染:将矢量形状转换为光栅图像
矢量影像可以通过称为“渲染”的过程转换为光栅影像渲染图像本质上是光栅图像,2D 矢量作品和 3D 矢量作品都可以渲染为光栅图像,正如您现在所知,这是基于像素的图像。与矢量影像相比,栅格影像的数据量要大得多,因为您需要存储一组像素(兆字节)来重新创建影像,而不是一组简洁的文本指令(千字节)。
此时,本章和下一章中概述的所有概念都可以应用于这些像素格式的光栅图像素材。
将矢量图稿渲染为光栅图像格式时,一定要记住保留“原始”矢量图稿的备份,以便您可以在以后对其进行增强或优化,并随时重新渲染。
与栅格影像相比,矢量插图的主要优势在于,因为它是使用数学定义的,所以可以放大或缩小到任意大小。放大或“上采样”2D 栅格影像会导致所谓的像素化。接下来,我们来看看数组!
分辨率:图像像素的数量
您的数字图像素材中包含的像素数量应该用一个称为分辨率的术语来表示。这是图像中包含的像素数量。图像有宽度,通常用 W 表示,或者用 X 表示 X 轴,还有高度,通常用 H 表示,或者用 Y 表示 Y 轴。影像分辨率为您提供了数字影像的 2D 维度。
Android Studio 中图像资源的分辨率需要用两个整数来表示,一个是宽度,即 X 值,另一个是高度,即 Y 值,用 XML 标记或 Java 代码表示。图像分辨率一般用两个中间带×的整数来表示。例如,VGA 分辨率表示为 640×480。或者,您也可以使用单词“by”,例如 640×480 像素。
让我们来看看分辨率的基本数学,这样你就可以知道如何计算图像中的像素数量,这与它使用的内存量有很大关系。
做数学:计算你的总图像像素
要找到任何 2D 数字图像中包含的像素总数,您需要将宽度像素乘以高度像素,或者用 Java 术语来说:Resolution = Width * Height;
如果您正在编写代码。希望你还记得小学时矩形方程的面积。这又是在一个专业的 Android 数字图像应用环境中。当我在小学的时候,我没有意识到所教授的东西有专业应用,所以我没有真正听,因此我不得不回去重新学习我的数学和物理。
例如,如果将宽度和高度相乘,HDTV 分辨率为 1920×1080 的图像包含 2,073,600 个像素。如果你对数码摄影感兴趣,你会对两百万像素这个术语很熟悉,它指的是 200 万像素。这就是 HDTV 分辨率给你的本质。
数字图像中包含的像素越多,分辨率就越高。更高分辨率的图像给观众更多的细节或图像主题定义。这就是为什么 HDTV 代表高清晰度电视,也是为什么新的 4K 分辨率的 UHD 电视是超高清晰度的。
接下来,让我们仔细看看一些流行的 Android 5 消费电子设备分辨率,这些分辨率从 240 到 4096 像素不等,比智能手表设备和 4K iTV 设备高出十七倍以上(即 17 倍)。Android 中的 UI(用户界面)设计需要能够在不同分辨率之间“变形”。这在我的书 Pro Android UI (Apress,2014)中有所涉及。
匹配 Android 设备的图像分辨率
开发用于 Android Studio 的优化数字图像素材的一个目标是将数字图像中的像素数量与将要查看的目标硬件设备相匹配。过去市场上有几十种不同分辨率的 Android 设备。最近,在 Android 设备上发现的不同分辨率的数量一直在减少,这对开发者来说是非常好的。原因是越来越多的显示器,尤其是智能手机、电子阅读器和平板电脑,已经符合三大 iTV set 分辨率。由于有机发光二极管(有机发光二极管)等显示技术,显示屏的像素间距(点尺寸)越来越小,这已经成为可能。这些柔性屏幕可以在显示屏上实现类似激光打印机的分辨率。
第一个高清电视屏幕是我所说的“伪高清”,是 1280×720 蓝光 DVD 分辨率(1280×720 = 921,600 像素,所以你说的差不多是 100 万像素)。对于 Android 5,1280×720 分辨率用于入门级智能手机或入门级平板电脑、上网本和笔记本电脑,因此这是一种常见的分辨率。这种通用性的原因是因为许多电影、视频和电视内容都是为这种蓝光(1280×720)分辨率制作的。将内容分辨率与设备分辨率相匹配将为您提供最佳的图像质量,因为像素缩放为零。接下来将介绍像素缩放。
市场上出现的下一个高清电视分辨率是真正的高清分辨率,即 1920×1080 分辨率。如您所知,这为您提供了 200 万像素,而 1280 伪高清分辨率为 100 万像素。使用真正高清分辨率的 Android OS 设备包括 iTV 电视机、智能手机、中型平板电脑和电子书阅读器。你也可以在高端的 Windows 和 Mac OS X 笔记本电脑(或笔记本电脑)上看到这种分辨率。
目前市场上最新的高清显示器被称为超高清显示器,即 UHD,分辨率为 4096×2160。如果你计算一下,这个显示屏分辨率包含 8,847,360 像素。当你读到这本书的时候,将会有 UHD iTV 开始运行 Android TV SDK,所以交互式 IMAX 分辨率应用即将到来!
这是 900 万像素,相比之下,1920×1080 真高清分辨率的像素为 200 万。你已经在 UHD iTV 电视机、领先的智能手机、高端平板电脑和高端电子书阅读器以及最新的 UHD 笔记本电脑(也称为 UHD 笔记本电脑)上看到了超高清分辨率。
还有一类消费电子设备叫做智能手表,分辨率有 320×320 和 400×400(华为)。到 2016 年,智能手表领域的像素密度(像素间距)将会更高,达到 480×480 像素屏幕,到 2017 年有望达到 560×560 或 640×640 像素屏幕。
纵横比:宽高像素的 2D 比率
与数字图像的像素数密切相关的是数字图像中 X 与 Y 的比率。这就是所谓的长宽比。纵横比的概念比图像分辨率更复杂,因为它是图像分辨率维度内的宽高比,或 W:H。如果你喜欢用图像的 X 轴和 Y 轴来思考,那就是 X:Y。有趣的是,Java、JavaFX 和 Android 使用宽度和高度,X 和 Y 可以互换(也就是说,不一致),所以我不能建议你应该如何考虑像素引用。这个纵横比定义了图像的形状,也适用于显示屏的形状。例如,智能手表具有方形外观(1:1),而宽屏 iTV 电视机具有矩形外观(2:1)。
1:1 纵横比的数字图像(或显示屏)是完美的正方形。因为这是纵横比,根据其定义,1:1 的纵横比与 2:2 或 3:3 的纵横比相同。值得注意的是,正是这两个数字之间的比率定义了图像或屏幕的形状,而不是数字本身,这就是为什么它被称为纵横比,尽管它通常被简称为纵横比。2:1 的宽高比创建了宽屏宽高比。
屏幕形状:常见的显示器纵横比
上一节讨论的许多 HDTV 分辨率显示屏使用 16:9 的 HDTV 宽屏宽高比。但是,有些显示器使用较窄或较高的 16:10(或 8:5,如果您喜欢最低的公分母)宽高比。更宽的屏幕肯定也会很快出现在市场上,所以请寻找 16:8(或 2:1,如果你喜欢最小公分母)的超宽屏幕,它将具有 2160×1080 的屏幕分辨率。
早期的电视屏幕几乎是方形的;他们使用了 3:2 的长宽比。电脑屏幕以 4:3 的纵横比为特色,例如 Macintosh 的 512×384 或 PC 的 640×480 VGA 屏幕分辨率。一旦你在本章的下一节中学会了如何计算长宽比,你就可以自己检查数学了。
随着时间的推移,PC 显示器不断变宽。2:1 宽屏 2160×1080 显示器于 2013 年问世,不久之后,UHD 2:1 显示器(4096×2048)将出现在市场上。最近的一次长宽比变化是在 2015 年推出的 Android 智能手表,它使用 1:1 的长宽比显示屏。自定义屏幕纵横比可能会变得相当极端;你们都见过 9:1 宽高比的屏幕环绕在体育馆的顶部。
做数学:如何得出长宽比
图像长宽比通常使用长宽比冒号两侧可以达到(减少)的最小数字集或对来表示。如果你在高中时注意过,当你在学习最小公分母时,那么长宽比数学对你来说应该很容易计算。
我会继续把两边除以 2 来做这个数学入学考试。让我们以一个相当怪异的 1280×1024(称为 SXGA)分辨率为例。
1280:1024 的一半是 640:512;因此,640:512 的一半是 320:256。一半是 160:128,一半是 80:64。一半是 40:32,一半是 20:16。一半是 10:8,一半是 5:4。因此,SXGA 分辨率使用 5:4 的纵横比。
有趣的是,前面所有的比值都是相同的长宽比,都是有效的。因此,如果您想采取真正简单的方法,用冒号替换图像分辨率中的“×”,您将获得图像的纵横比。行业标准包括将长宽比提取到最低格式,正如您在这里所做的那样,因为这是一个更有用的比例。
颜色理论:使用像素颜色通道
在构成分辨率和长宽比的图像像素阵列中,每个像素都使用 Android 中的三个颜色通道来保存颜色值,Android 使用 RGB 颜色空间。颜色通道最初用于数字图像合成程序(如 GIMP)中,用于合成在显示屏上使用的数字图像,或者在打印机上使用油墨打印,打印机使用称为 CMYK 的不同颜色空间。在印刷行业中,颜色通道有时被称为“色板”,因为老式印刷机使用金属板,其中一些至今仍在使用。在 GIMP 中,颜色通道有自己的通道调色板,并允许您只在该颜色通道(或调色板)上工作,这对于特殊效果或其他高级图像操作非常有用。
Android 允许您使用 drawables APIs 访问每个像素的 RGB 组件,我在我的 Pro Android Graphics (Apress,2013)标题中对此进行了介绍。RGB 代表红色、绿色、蓝色。使用加色模型,这三种颜色的光可以创建可见色谱中的任何颜色(想想彩虹)。
加色(RGB)的对立面是减色(CMYK),它用于印刷并涉及使用油墨。油墨是相互减色的,而不是加色的,这是通过使用光线组合颜色时发生的情况。
使用红色和绿色作为加色的例子,结果是红色+绿色=黄色。使用减色法,红色+绿色=紫色。如你所见,加色给你更亮的颜色(增加光线),而减色给你更暗的颜色(即减少光线)。
要使用这些 RGB 颜色通道创建数百万个不同的颜色值,您需要使用 Java 代码为 Android 做的是改变每个单独的 RGB 颜色值的级别或强度。在我讲述了 RGB 颜色的数学知识之后,我将向您展示如何用十六进制表示法在 Android 上实现这一点,这涉及到颜色的位和字节。
RGB 颜色的数学:增加你的强度
红色、绿色和蓝色值的数量或强度水平决定了您能够复制的颜色总数。对于今天的 Android 设备,像素可以为每种红、绿、蓝(RGB)颜色产生 256 级光强度。需要为每个图像像素生成颜色;因此,对于这些 RGB(红色、绿色和蓝色)颜色数据值中的每一个,图像中的每个像素具有 256 级颜色强度。
这些 RGB 通道、印版或平面中的每一个都使用一个字节或八位的颜色强度数据。作为一名 Android 程序员,您知道 8 位数据最多可以容纳 256 个不同的值,因此每个像素的红色、绿色和蓝色通道组件有 256 个亮度级别。
每个数字图像像素内的颜色强度(亮度)数据用每种颜色的亮度级来表示。范围从 0(亮度关闭)到 255(亮度完全打开),控制数码图像中每种红色、绿色和蓝色的每个像素贡献的颜色量。
计算可用颜色的总量很容易,因为这也是简单的乘法。如果乘以 256 × 256 × 256,得到 16,777,216 种颜色。这代表红色、绿色和蓝色的独特颜色组合,您可以使用这三种不同的加色通道中的每种颜色的 256 个级别(数据值)来获得这些颜色组合。
表示 RGB 颜色值:使用十六进制数据值
在 Android 中,您需要为每个红色、绿色和蓝色像素颜色通道表示这 256 个亮度级别的数据。这是通过指定 8 位(值)的数字数据值来实现的,这允许 Java 代码或 XML 标记控制每个红色、绿色和蓝色通道值的颜色亮度变化,从最小值 0 到最大值 255。
用于表示数字图像像素颜色的位数可以使用 16 进制或十六进制表示法进行编码。基数 16 从 0 到 F 计数,因此有 16 个值(位)来表示颜色。这些十六进制值中的两个给出 16 × 16 = 256 个值,这是每个 RGB 颜色通道可用的亮度级别数。
在 Android Studio 中,也很方便地在 HTML5、CSS3 和 JavaScript 中,这是通过使用散列或井号(#)来完成的。例如,在 Java 代码或 XML 标记中,要表示黑色,即所有值都关闭或为零,则如下所示:
colorValue =``#000000
另一方面,白色是所有像素完全打开:
colorValue =``#FFFFFF
红色仅打开红色通道像素:
colorValue =``#FF0000
绿色打开绿色通道像素:
colorValue =``#00FF00
蓝色打开您的蓝色通道像素:
colorValue =``#0000FF
黄色打开红色和绿色通道:
colorValue =``#FFFF00
在本章的下一节中,您将了解这些位深度如何应用于不同的数字图像文件格式,如 8 位 GIF、24 位 JPEG 或 32 位 PNG。Android 操作系统还支持 48 位 HDR(高动态范围)颜色,用于即将推出的一些更先进的智能手机硬件中的相机!您可能已经猜到,48 位颜色使用 16 位颜色通道。
颜色深度:定义颜色的位级
数字图像中每个像素可用的颜色量在行业中被称为图像的色深。数字图像资源中使用的常见颜色深度包括 8 位、16 位、24 位、32 位、48 位和 64 位。Android 支持其中三种颜色深度:8 位使用 GIF 和 PNG8,24 位使用 JPEG 和 PNG24,32 位使用 PNG32。Android Camera 2 API 还支持新的高动态范围成像(HRDI)格式,可以存储 48 位颜色数据。64 位 HDRI 图像支持三个 16 位(RGB)通道和一个 16 位 alpha 通道。阿尔法通道将在本节稍后介绍。
高色深图像具有 24 位色深,因此包含 16,777,216 种颜色。支持 24 位颜色深度的文件格式包括 JPEG(或 JPG)、PNG、BMP、XCF、PSD、TGA、TIFF 和 WebP。JavaFX 支持其中的三种,JPG、PNG24 (24 位)和 PNG32 (32 位)。使用 24 位色深可以获得最高的质量水平。这就是为什么我推荐你的 Java 游戏使用 PNG24 或 PNG32。接下来,让我们看看如何使用调色板来表示索引图像的颜色!
索引颜色:使用调色板保存 256 种颜色
最低色深存在于 8 位索引的彩色图像中。这些图像最多有 256 个颜色值,这就是为什么它们是 8 位图像,并使用索引“调色板”的颜色,这就是为什么它们被称为索引彩色图像。索引颜色的常用图像文件格式包括 GIF、PNG、TIFF、BMP 或 Targa。当您从成像软件包(如 GIMP)中“导出”文件时,索引调色板由索引颜色编解码器创建。Codec 代表 COde-DECode,是一种可以使用压缩来优化文件大小的算法。
Android OS 支持两种索引彩色图像格式:GIF 和 PNG。在 Photoshop 中将 24 位真彩色图像数据转换为索引彩色图像格式(GIF 或 PNG)的方法是使用文件“➤存储为 Web 所用格式”菜单序列。这将打开“存储为 Web 所用格式”对话框,可让您设定文件格式(GIF 或 PNG)、颜色数量(从 2 到 256)、颜色转换算法(感知、选择、自适应或限制)、抖动算法(扩散、图案或噪波)以及许多其他高级选项,如渐进隔行扫描。我推荐使用感知色彩转换,256 色,和扩散抖动算法来获得最佳视觉效果。
要使用 GIMP 2.8.14 将真彩色图像数据转换为索引彩色图像数据,请使用图像➤模式➤索引菜单序列。这将调用索引颜色转换对话框。与 Photoshop 的“存储为 Web 所用格式”对话框相比,它的选项较少,但重要的选项都在那里,因此您可以指定颜色深度和扩散抖动。我推荐使用 GIMP Floyd-Steinberg 扩散抖动算法。甚至有一种算法可以减少渗色,保持图像边缘干净清晰。
以颜色深度为例,如果您选择 2 种颜色,它将是 1 位(PNG1)图像,4 种颜色将是 PNG2 (2 位颜色深度)图像,16 种颜色将是 4 位 PNG4 颜色深度图像,64 种颜色将是 6 位 PNG6 图像,128 种颜色将是 7 位 PNG7 图像。
接下来,我们来看看 Android 中推荐使用的其他主要格式,24 位真彩色或者 32 位。
真彩色:使用 24 位彩色图像
世界上最广泛使用的数字图像文件格式之一是 JPEG 文件格式,它只有一种风格:24 位颜色。支持 24 位颜色数据的其他文件格式包括 Windows BMP、TIFF、Targa (TGA)、Photoshop (PSD)和 PNG24。由于 PNG 也支持 8 位(PNG8)或 32 位(PNG32)颜色,准确地说,我称之为 24 位 PNG 格式 PNG24。Android 支持其中两种流行的格式:JPEG 和 PNG。
Android 真彩色(或 true color)图像使用 RGB_888 颜色空间(或颜色通道数据配置)。Android 支持的这些真彩色文件格式的主要差异归结为一个主要的区别因素:有损压缩与无损压缩。
有损压缩是指一种算法,也称为编解码器,丢弃一些数据以实现更小的数据足迹。因此,在应用任何有损压缩(在本例中为 JPEG)之前,请使用无损数据格式保存原始的未压缩文件格式。
无损压缩—用于 PNG、BMP、TGA 和 TIFF 格式—不会丢弃任何原始图像数据;它应用一种算法来查找导致使用更少数据的模式,并且可以 100%重建所有原始像素值。
真彩色 24 位图像主要用于 Android 用户界面设计,或用于实际的应用内容。它们还可以用于 Android 设备上显示的其他数字内容,如网站、电子书、iTV 程序、游戏、智能手表、数字标牌和社交媒体共享论坛。
在你的 Android 应用中使用多个图像被称为图像合成。合成涉及使用多个图像层。背景或背板图像使用 24 位图像数据。背景板上的合成堆栈中的所有其他层都需要支持透明度,因此需要 32 位数据,也称为 ARGB 或 RGBA。
这种透明性是由第四个通道提供的,称为“alpha 通道”我将在本章的下一节向你介绍这一点,因为这是一个关键的合成概念。
如果你有兴趣了解更多关于在 Android 中使用图像合成管道的知识,我会在 Pro Android Graphics 中详细介绍。为 Android 应用使用图像会给它带来更多的活力,但使用图像合成管道可以实现更高水平的特殊效果和交互性,在 Android 应用开发工作流程中使用数字图像可以实现这一点。这是我在这里包含 alpha 通道的一个很好的理由!
真彩色加 Alpha:使用 32 位数字图像
除了 8 位、16 位和 24 位数字图像之外,还有 32 位数字图像。支持 32 位颜色数据的格式包括 PNG、TIFF、TARGA (TGA)、位图(BMP)和 Photoshop。我喜欢用 PNG32,因为它在 HTML5、Java、JavaFX、CSS3、JavaScript、Android 都支持;而其他文件格式没有与开源操作系统和浏览器集成,如 PNG(发音为“ping”)格式。这 32 位图像数据包括 24 位 RGB 颜色数据,加上 8 位“alpha”或透明度值数据,保存在通常称为 alpha 通道中。
既然您现在知道 8 位保存 256 个值,那么 alpha 通道为数字图像中的每个像素保存 256 个不同级别的透明度数据值是有意义的。这对数字图像合成很重要,因为它允许保存 32 位图像数据的层允许颜色数据的一部分(从 0 到 255,或该像素的所有颜色)渗透到下面的层(或与之混合)。
我们来看看 Android Studio 中四个数据通道是如何翻译的。没错,您使用的是十六进制表示法,带有两个额外的 alpha 槽,因此是 ARGB_8888 数据格式。
在 Android Studio 以及 HTML5、CSS3、JavaScript 和 XML 中,颜色加 alpha 的十六进制采用 ARGB 格式,因此,两个 alpha 值位置需要放在前面。
例如,要表示透明色,即所有值都关闭,或代码中的 0,它看起来像这样:
colorValue =``#00000000
另一方面,在每个 alpha 通道数据值槽中,具有 50%透明度的白色是白色加 8(从 0 开始计数时为 7)的所有 RGB 像素完全打开:
colorValue =``#77FFFFFF
半透明度为 25%的红色对每个 alpha 通道槽使用值 3,并使用 FF 仅打开红色通道像素,或完全打开,绿色和蓝色完全关闭:
colorValue =``#33FF0000
绿色和 37.5%的半透明度对每个 alpha 通道使用值 5,并使用 FF 仅打开绿色通道像素,或完全打开,让红色和蓝色完全关闭:
colorValue =``#5500FF00
半透明度为 75%的蓝色对每个 alpha 通道槽使用 B 值,并使用 FF 仅打开蓝色通道像素,或完全打开,并完全关闭绿色和红色:
colorValue =``#BB0000FF
接下来,让我们仔细看看阿尔法通道是做什么的。
Alpha 通道:定义透明度
让我们看看 alpha 通道如何定义数字图像像素透明度值,以及如何在 Android 中使用它们来合成数字图像。Alpha 通道在数字图像合成软件包(如 GIMP)中提供透明度,我称之为“静态”使用,但也可以通过 PNG32 图像资源使用开放平台(如 Android Studio、HTML5、CSS3、Java 或 JavaFX)实时合成数字图像。我称之为“动态”使用,因为代码允许你在一毫秒内访问像素透明度值,所以你可以用任何你喜欢的方式动画数据;例如,在游戏、动画用户界面或交互式电子书中。
数字图像合成涉及一层以上数字图像的无缝混合,正如您可能想象的那样,每像素透明度是一个重要的概念。数字图像合成用于图形设计、故事片、游戏设计和 Android Studio 应用开发。
当您想要在显示器上创建一个看起来像是单个图像(或动画)但实际上是多个合成图像层的无缝集合的图像时,需要使用数字图像合成。您希望设置图像或动画合成的主要原因之一是,通过在不同的层上设置组件,您可以更好地控制图像合成中的各种元素。Android Studio 有一个 LayerDrawable 类,它提供了与 GIMP 中完全相同的多层图像合成功能,除了为在 Android 应用中使用而优化之外。
要完成多层合成,您始终需要有一个 alpha 通道透明度值,您可以利用它来精确控制像素的颜色与其下方其他层上相同 X,Y 图像位置的像素的混合。
像 RGB 颜色通道一样,alpha 通道具有从 100%透明(0)到 100%不透明(255)的 256 个透明度级别。每个像素有不同的 alpha 透明度数据,就像每个像素有不同的 RGB 颜色数据一样。
Android Studio 中几乎所有可以在显示屏上绘制的东西都支持 alpha 通道值,通过使用十六进制符号的 ARGB 8888 数字图像格式。这包括用户界面元素、主题、风格和可绘制性。我向您展示了如何使用散列(磅)符号对其进行格式化,您可以在 XML 标记和 Java 代码中使用这种十六进制数字格式。记住这一点,因为很少有开发者用!
PorterDuff:算法混合模式
图像合成还有一个强大的方面,叫做混合模式。任何 Photoshop 或 GIMP 用户都知道,数字图像合成软件包中的每一层都可以设置为使用不同的混合模式。混合模式是指定一个层的像素如何与之前的层(在该层下面)混合(数学上)的算法。Android API 有一个 PorterDuff 类,允许您在 Android 应用中访问所有这些混合模式算法。
这些像素混合算法考虑了像素透明度水平;因此,在两个图像合成控件之间,你可以在 Android Studio 中实现几乎任何你想要的合成结果。
与 Android 的主要区别在于混合模式可以使用定制的 Java 编程逻辑进行交互控制。对于 Android 开发者来说,这是令人兴奋的部分。
这些强大的 PorterDuff 类混合模式包括 XOR、加网、叠加、变暗、变亮、相乘和相加。Pro Android Graphics 介绍了如何在复杂的图像合成管道中实现 PorterDuff 混合模式,如果您有兴趣更详细地了解 Android 的这一领域。
平滑边缘:抗锯齿
抗锯齿是一种成像技术,也是通过使用算法来实现的。该算法所做的是找到两种相邻颜色沿边缘相遇的地方,并混合锯齿边缘周围的像素。消除锯齿沿两个彩色区域之间的边缘添加平均颜色,以便沿(以前的)锯齿状边缘在视觉上平滑这两种颜色。这使得锯齿状边缘看起来很平滑,尤其是当图像缩小并且像素不是单独可见时。抗锯齿的作用是让你的眼睛看到更平滑的边缘,以消除通常所说的“锯齿”抗锯齿提供了令人印象深刻的效果,它对那些位于图像边缘并需要看起来更平滑的像素使用几个(通常少于八个)中间平均颜色值。
我说的“平均颜色”指的是介于两种颜色之间的颜色或色谱,沿着反锯齿边缘相交。我为您创建了一个抗锯齿的可视化示例来展示最终的效果。
我首先在黄色背景下创建了看似平滑的红色圆圈,如图 2-1 所示。我放大到那个圈的边缘,然后就抓拍到了这个截图。
图 2-1。
A zoomed in view (right) shows anti-aliasing effect
我将它放在缩小的圆圈旁边,以显示红色和黄色之间的抗锯齿(橙色)像素值,这些颜色值沿着圆圈的边缘彼此接壤。请注意,有七八种平均颜色用于创建这种视觉效果。
我在 Android 中实现自己的反走样效果的技巧之一是通过 Android 中的 ConvolutionMatrix 类使用高斯模糊。这也适用于 GIMP 和 Photoshop。确保在带有锯齿状边缘的对象(及其 alpha 通道)上使用低模糊值(0.125 到 0.375)。
这提供了与你在图 2-1 中看到的相同的抗锯齿,不仅如此,它还“模糊”了 alpha 通道的透明度值。
模糊 alpha 通道允许 alpha 通道消除 32 位图像对象与任何背景图像的锯齿,您可能会尝试对其进行无缝合成。接下来我们来看图像优化!
在下一章,你将深入了解如何在 Photoshop 和 GIMP 中使用 alpha 通道数据;它只是变得更加令人兴奋。
九补丁素材:9 补丁数字图像
Android OS 中还有另一种类型的数字图像“drawable”叫做 NinePatchDrawable 它允许 Android 开发人员开发一种特殊类型的可变形 PNG8、PNG24 或 PNG32 图像资源。使用 Android Draw 9-patch 工具创建的图像素材本质上是一个独立于 XY 轴的可缩放 PNG 光栅图像,它使用图像素材中的九个不同象限来支持独立于轴的缩放。
由于内置的 NinePatchDrawable 类和 NinePatch 类支持,Android 可以自动调整开发人员的 9 补丁图像素材的大小,以适应任何 Android View 对象的内容,在该对象中,开发人员已经放置了 9 补丁图像素材作为背景(或源)图像素材参考。
这是通过 Android NinePatch 类和 Android NinePatchDrawable 类以及 Draw 9-patch 软件工具中的算法实现的。这个工具可以在 Android SDK 文件夹的/sdk/tools
子文件夹中找到。
NinePatch 图像资源的一个使用示例是在背景图像内部使用 android:background XML 参数,该参数通常与标准 android 按钮小部件一起使用。按钮 UI 小部件几乎总是需要拉伸,至少在一个维度上,通常在 X 和 Y 两个维度上,以便适应使用不同字符串和不同字体样式和大小的文本。
这个 NinePatchDrawable 对象使用 Android 推荐的 PNG 数字图像格式;它还包括一个额外的一个像素宽的边框来保存缩放准则。要被 Android 识别为 9 补丁图像资源,需要使用. 9.png 文件扩展名保存它们。我提到的单像素边界对您的最终用户是不可见的,而是由 Android NinePatch 类算法用来定义图像素材的可缩放区域和静态(固定,即不可缩放)的区域。
NinePatch 类:在 Android 中创建 NinePatch
Android NinePatch 类是 Java java.lang.Object 基类的直接子类,这意味着它被唯一编码以定义 Android 中的 NinePatch 对象。使用 Android NinePatch 类构建的对象允许 Android 缩放,然后使用 9 补丁 PNG 图像资源中的 9 个离散的可缩放部分或区域来呈现 9 补丁图像资源。您可能已经猜到,这个类存储在 android.graphics 包中。它的类层次结构如下所示:
java.lang.Object
> android.graphics.
NinePatch
一个很好的类比是指南针。这些 9 片图像的四个角(东北、西北、东南和西南)是未缩放的;而四个边(N、E、S 或 W)沿一个轴缩放。指南针的中间(9 片图像)沿其两个轴缩放,就像任何正常图像在 Android 操作系统中缩放一样。
理想情况下,9 片源图像资源的中间部分是 100%透明的。这是为了在您将视图用作微型合成容器的情况下,9-patch 可以为您的视图对象提供围绕开放的可合成内容区域的可缩放图像框架,因为一些视图对象(如 ImageView)可以具有源和背景图像(以及其他元素),它们将通过透明区域显示。
Android Draw 9-patch 工具为开发人员提供了一个简单、有用的工具,用于使用 WYSIWYG(所见即所得)图像编辑器创建九补丁图像。我们现在来看看这个。
Draw 9-patch:创建一个 NinePatchDrawable 图像
本节介绍如何使用 Android Draw 9-patch 工具创建 9-patch 图像资源。您需要一个源 PNG 图像来创建 NinePatchDrawable 对象;我提供了一个名为 NinePatchFrame.png 的示例 PNG32 图像素材。如果您对创建 9 补丁图像素材感兴趣,我将在本章的最后一节带您浏览,以便您了解基本的 9 补丁工具工作流程。
首先在 Android SDK 文件夹层次结构的 tools 子文件夹中找到你的 Draw 9-patch 工具。打开 tools 子文件夹后,您会看到 draw9patch.bat Windows 批处理文件,这是运行 draw9patch 需要启动的文件。
有两种方法可以打开 PNG32 图像进行 9 补丁开发。您可以将 PNG 图像拖动到 Draw 9-patch 窗口中,并拖动到中间的下拉箭头上,或者您可以使用文件➤打开 9-patch 工作流程在 NinePatch images 子文件夹中找到该文件。
找到 NinePatchFrame 源图像 PNG 资源后,选择它并单击“打开”按钮。您会看到 Draw 9-patch 软件,在编辑器和预览区域中有 PNG 文件。左窗格是您进行编辑的地方,使用单像素黑线创建补丁、定义补丁或缩放区域,以及由填充线定义的中心内容区域。
右窗格是生成的 9 补丁预览区域,如图 2-2 所示,在这里您可以查看您的 9 补丁图像素材缩放后的样子。要定义面片,请在透明的顶部边框中单击,然后向左拖动以绘制一条定义 X 维可缩放面片的黑线。一旦你画出了你想要的近似值,你可以使用线段两端的细线对其进行微调。
图 2-2。
Defining patches in the Android Draw 9-patch tool
将光标放在细线上,它会变成一个双箭头。单击并拖动灰色区域,直到它与 NinePatchFrame.png 图像中心的透明区域像素级吻合。也可以右键单击来擦除先前绘制的线。
查找“显示修补程序”选项旁边的复选框;选择它以打开此功能。如图 2-2 所示,这使用紫色和绿色的组合在您选择的区域提供颜色。这可以清楚地显示图像素材中的哪个区域受到了影响。您可以看到在编辑面板的底部还有几个其他有用的控件。其中包括缩放滑块,允许您调整编辑区域中源图形的缩放级别,以及面片比例滑块,允许您调整预览影像的比例。
当鼠标悬停在图形上时,显示锁定选项允许您可视化图形的不可绘制区域。“显示内容”选项在预览图像中突出显示您的内容区域,其中紫色显示可以放置内容的区域。
最后,在编辑区域的顶部,有一个显示坏补丁按钮。这会在补丁区域周围添加一个红色边框,当图像缩放时可能会在图像中产生伪像。如果你努力在 9 补丁设计中消除所有这些坏补丁,你的缩放图像的视觉效果是可以实现的。
图 2-2 显示了带有顶部和左侧单像素边框黑线定义的 9 块图像素材。如您所见,由于 Show patches 选项,我现在已经定义了静态区域和具有外科手术精度的可扩展区域。
另请注意图 2-3 ,在右侧预览中,9 片图像定义的结果给了我一个专业的缩放结果。我抓住屏幕右侧的滚动条并将其拉下,这样您就可以看到纵向和横向形状的 9 片刻度。
图 2-3。
Draw 9-patch preview shows axis-independent scaling
您还可以看到我使用编辑窗格右侧和底部的单像素黑色边框线定义的填充区域。图 2-3 显示我正在底部绘制一个 1 像素的黑色边框线段,以定义 9 片图像的中心填充区域的 X 尺寸。
摘要
在第二章中,您了解了数字图像的概念、术语和实现图像素材的 Android 类。您了解了像素、分辨率、纵横比、颜色通道、颜色深度、alpha 通道、抗锯齿、混合模式和 PorterDuff 以及 NinePatchDrawable 对象。在下一章中,您将进一步了解图像数据占用优化。
三、数字图像素材:数据足迹优化
现在,您已经了解了数字图像新媒体内容的基本概念、术语和原则,以及 Android Studio 和 Android OS 支持的文件格式,是时候更进一步了解数据占用优化了。数据足迹优化包括以占用最少数据存储量的方式保存您的数字图像素材;也就是说,它具有最小的文件大小。在本章中,您将了解所有新媒体领域的数据占用优化,因为您为 Android 应用制作的新媒体素材越小,Android 应用在谷歌 Play 商店中的位置就越小,下载、加载到内存中以及在内存中运行的速度就越快。
您将看到基于 2D 像素的光栅图像与基于 2D(或 3D)顶点和直线(或曲线)的矢量图像之间的区别。既然您现在拥有了 GIMP,我可以用 GIMP 展示书中的概念——您也可以跟着我。
优化数字图像:关键因素
有许多技术因素会影响数字图像压缩,数字图像压缩是使用编解码器或算法来查看图像数据并找到一种方法将其存储为使用较少数据的文件的过程。编解码器编码器本质上找到图像中的“数据模式”,并将这些模式转换成编解码器的解码器部分可以通过算法重构原始图像数据的数据形式。一个好的编解码器是数据足迹等式的一部分,但是你交给编解码器压缩的图像数据可以产生不同!
让我们从讨论对数据足迹影响最大的图像属性开始,并检查这些方面如何对任何给定数字图像的数据足迹优化做出贡献。有趣的是,这些类似于你在第二章中提到的数字成像概念的顺序。
图像分辨率:数组中的像素数
对生成的图像文件大小或数据占用空间影响最大的因素是数码图像的像素数或分辨率。这是合乎逻辑的,因为需要存储这些像素中的每一个,以及每个 RGB 颜色通道的颜色值。因此,在保持良好细节的同时,图像分辨率越小,生成的文件就越小,因为要压缩的数据越少,因为图像只是一组像素值。
众所周知,原始未压缩图像的大小是通过公式width
× height
× color channels
计算出来的。24 位 RGB 图像有三个 RGB 颜色通道,32 位图像有四个 ARGB 颜色通道。值得注意的是,一旦解码器将其压缩格式解压缩到系统内存中,原始(未压缩)图像数据占用的空间恰好也是您的图像将占用的系统内存量。
这一级别的数据占用优化的关键是遵循我在第二章中的建议,并使图像分辨率与图像的目标观看设备相匹配。
几乎所有人都在做的错误的事情是使用打印分辨率图像,它使用相机分辨率 CCD(电荷耦合器件)来创建包含 2400 万到 4800 万像素的数字图像文件数据。如你所知,流行的高清显示设备有 100 万或 200 万像素的分辨率,或者,在 4K 或 UHDTV,最多有 900 万像素的分辨率。因此,您应该使用双三次(Photoshop)或三次(GIMP)插值算法,将打印分辨率缩减采样到至多 4K 分辨率。
在当今大多数 Android 设备上使用新的超精细点距显示器,您甚至可以将 HDTV(200 万像素)图像升采样(升级)到 UHD(800 万像素),并且仍然会有足够的像素,使您的图像在任何精细点距显示器上看起来都非常清晰和逼真。
对图像进行下采样的最佳方式是所谓的“2 的幂”,类似于二进制:2、4、8、16 等等。因此,如果你的相机给你一个 8192×6144(4800 万像素)的图像,在每个轴上向下采样 2 到 4096×3072,或者在每个轴上向下采样 4 到 2048×1536,或者在每个轴上向下采样 8 到 1024×768。
很多人问我为什么很多智能手机都用 2560×1440 的分辨率。答案是,制造商知道大多数视频内容是蓝光(1280×720)格式,如果在每个轴上加倍,则得到 2560×1440,因此全屏视频是以 2 的幂进行缩放,并获得最佳图像质量,因为缩放算法中不涉及部分像素。从数学上来说,这意味着只有均匀的分割,没有余数,所以边缘保持清晰。这适用于上采样或下采样。
图像颜色深度:每个像素的颜色通道
因为 Android 中图像的数组(分辨率)中的每个像素具有 8 位(一个通道的颜色数据)、24 位(三个通道的颜色数据)或 32 位(四个通道的颜色和 alpha 数据)的颜色深度。因此,这是影响图像数据足迹的第二大因素。我怀疑这是索引彩色(8 位或一个颜色通道)图像仍然被广泛使用的原因之一,通常是 PNG8 图像格式,它具有更好的无损压缩算法,至少与 GIF 编解码器相比是如此。
如你所知,PNG 等无损压缩算法零图像数据丢失,保持 100%质量;而有损压缩算法(如 JPEG 和 WebP)会丢弃数据,从而降低图像质量,以实现更高的数据压缩。
PNG32:使用具有 Alpha 通道的真彩色图像
如果您使用的是合成层图像资源,即包含包含对象遮罩的 alpha 通道或包含半透明(变化)特殊效果的 PNG32 图像,Android 中只有一个选项,即 PNG32 图像格式。这些图像需要压缩的数据最多,因此希望 PNG 编解码器能够很好地压缩图像数据。
每个图像都包含一个独特的像素值集合,因此您永远不知道任何给定的图像是否会被很好地压缩,因为它最终都是算法中的数学运算。
一般来说,图像越混乱(细节越精细),图像的边缘越清晰,生成的文件就越大。清晰的像素过渡(边缘)越少,包含的颜色渐变越平滑,因为平滑的过渡更容易压缩,所以生成的文件就越小。
真彩色图像:使用 24 位颜色深度
24 位图像也有同样的混乱和边缘问题,但是如果你想得到更小的文件,除了 PNG 还有另一种编码方式,尽管它会丢弃原始图像数据并引入视觉伪像。如您所知,JPEG 是一种有损编解码器,但它可以以牺牲视觉质量为代价来减小文件大小。因此,如果您正在寻求最高质量的数字图像结果,请尝试使用 PNG 编解码器和格式,因为它不会引入伪像(除非您使用 PNG8 和扩散抖动,这在本章稍后深入研究索引彩色图像时会有更深入的介绍)。正如我提到的,一些 PNG24 图像压缩得相当好;你真的只需要通过一个编解码器运行数据,并找出答案!
因此,如果您使用的是 24 位图像,没有 alpha 通道数据,并且图像中使用的颜色范围有限,那么可以考虑使用 PNG8 索引颜色格式,使用 256 色和扩散抖动,在不损失质量的情况下将数据占用空间减少 300%到 400%。索引彩色图像在超精细点距显示器上看起来很棒,因为抖动点太小看不见!
这种同样的超细点距优势也适用于 JPEG 压缩伪像,使它们小到看不见。然而,值得注意的是,Android 建议尽可能使用 PNG24 或 PNG32 而不是 JPEG,以尽可能提高应用的图像质量,这也是 Android 想要的最终目标,因为就操作系统而言,它处于激烈的竞争中。Android OS 自发布以来一直在稳步赢得新的市场份额;让我们保持这种方式!
索引颜色:使用高达 8 位的扩散抖动颜色
如果用于构成图像的颜色总数变化不太大,索引彩色图像可以模拟真彩色图像。如您所知,索引彩色图像仅使用 8 位数据或 256 种颜色来定义图像像素色板。这是通过使用最佳选择的调色板来完成的。例如,如果你有一张天空中的云的照片,或者一片美丽的森林,或者一束玫瑰,调色板中可能有足够的槽来复制这几种颜色及其包含的渐变,特别是如果你使用扩散抖动并有一个超精细点距的设备。
根据 24 位源图像中使用的颜色数量,使用 256 种颜色来表示包含 24 位色深的图像可能会导致一种称为条纹的效果。这是你的调色板中相邻颜色之间的转换在视觉上不是渐变的,因此看起来不是平滑的颜色渐变。
索引彩色图像可以选择对条带进行视觉校正,这称为抖动。正如你已经知道的,抖动是一种算法过程,用于沿着图像中任何相邻颜色之间的边缘创建点图案。这会欺骗你的眼睛,让你以为使用了第三种颜色。
抖动使用 256 色调色板为您提供最大感知数量的颜色。如果这 256 种颜色中的每一种都与其他 256 种颜色相邻,您可以模拟最大数量的 65,536 种颜色(16 位颜色),但这很少发生。您仍然可以看到创建其他颜色的潜力,并且您会惊讶于索引颜色编解码器和数据格式(PNG8 或 GIF)在涉及某些影像的压缩场景中可以实现的效果,这些影像具有正确数量的颜色和最适合索引颜色的主题。
让我们优化一个真彩色图像,如图 3-1 所示,并使用 PNG5 索引彩色图像格式保存,向您展示扩散抖动。你将在奥迪 3D 图像上看到驾驶员侧后挡泥板的抖动效果,因为它包含一个灰色渐变。
图 3-1。
A PNG24 image created with Autodesk 3DS MAX to compress as PNG5
有趣的是,在 8 位索引彩色图像中,允许使用少于 256 种最大值的颜色。这样做通常是为了进一步减少数字图像数据的占用空间。
例如,仅使用 32 种颜色就可以获得很好效果的图像实际上是一个 5 位图像,从技术上讲,它被称为 PNG5,尽管这种格式本身通常被称为 PNG8,因为它的最大使用级别是 256 色。
您将设置如图 3-2 所示的索引色 PNG 图像,以使用 5 位颜色(32 色,或 PNG5)。这是为了让你可以清楚地看到抖动效果。正如你在图 3-2 左侧的图像预览区域所看到的,抖动在你相邻的颜色之间创建了点状图案,以创建额外的颜色。在这种情况下,它是灰度值。
图 3-2。
Select Diffusion Dither and 32 colors creating PNG5
另外,请注意,您可以设置抖动的百分比。我经常选择 0%或 100%设置;但是,您可以在这两个极端值之间的任何地方微调扩散抖动效果。
你也可以选择抖动算法;您可能已经猜到,抖动效果是使用抖动算法创建的,抖动算法是索引文件格式(本例中为 PNG8)编码器压缩例程的一部分。
我更喜欢扩散抖动,它有一个平滑的效果,特别是沿着不规则形状的梯度,如图 3-2 所示的奥迪驾驶侧后挡泥板。
您可以使用更加随机的“噪波”选项,或者不那么随机的“图案”选项。扩散选项通常会给出最好的结果,这就是为什么我在使用索引色时使用它(这并不常见,因为我使用 PNG32)。
正如你所想象的,抖动将数据模式添加到图像中,这更难压缩。这是因为图像中的平滑区域(如渐变)比尖锐过渡(边缘)区域或随机像素模式(如抖动)或来自数码相机 CCD 的“噪声”更容易被压缩算法压缩。
因此,应用扩散抖动选项将总是增加几个百分点的数据足迹。请务必检查应用和不应用抖动(在“导出”对话框中选择)的结果文件大小,以查看它是否值得提供更好的视觉效果。请注意,索引彩色 PNG 影像还有一个透明度选项(复选框)。请务必注意,用于 PNG8 图像的 alpha 通道是 1 位(开或关),而不是 PNG32 的 8 位。
图像 Alpha 通道:像素透明度通道
到目前为止,您所了解的可以增加图像中数据占用空间的最后一个概念是添加一个 alpha 通道来定义合成的透明度。这是因为添加 alpha 通道会给图像添加一个 8 位透明通道。如果您需要一个 alpha 通道来保持图像的透明度,除了包含这个 alpha 通道数据之外,没有太多的选择。
如果您的 alpha 通道包含全零或使用全黑填充颜色(这将定义您的 alpha 通道为完全透明),或包含 FF 值,或使用白色填充颜色(这将定义您的 alpha 通道为完全不透明),您将基本上(在实际使用中)定义一个不包含有用的 alpha 数据值的 alpha 通道。
因此,需要移除透明 alpha 通道,并且需要将不透明图像定义为 PNG24 数字图像,而不是 PNG32,从而节省一个数据通道。
最后,用于遮罩数字图像的 RGB 颜色通道中的对象的 alpha 通道压缩得非常好。这是因为这些 alpha 通道主要是白色(不透明)和黑色(透明)的区域,沿着两种颜色之间的边缘有一些灰度值,以消除蒙版的锯齿。
这些灰色区域包含 alpha 通道中的抗锯齿值,在图像的颜色通道中的对象与其后面使用的任何背景颜色或背景图像之间提供视觉上平滑的边缘过渡。
这是因为 alpha 通道图像的遮罩包含从白到黑的 8 位透明度渐变。这定义了透明度的级别,它应该被认为是每像素混合(不透明度)的强度。
因此,蒙版中每个对象边缘的中灰度值(包含在此 alpha 通道中)将基本上平均对象边缘和任何目标背景的颜色。无论每个像素可能包含什么颜色或图像数据值,它都可以做到这一点。
这为可能使用的任何目标背景(包括动画背景)提供了实时抗锯齿,因为这种基于 alpha 通道的透明度混合将由每秒能够进行数百万(如果不是数十亿)次操作的 CPU 对每个动画帧进行计算。
现在,您已经学习了数字图像的概念、格式、API、术语和数据占用优化,接下来您可以开始学习数字音频,这是另一种流行的新媒体类型。
摘要
在本章中,您了解了数字图像数据占用空间优化的概念、原则以及压缩和解压缩数字图像素材的 Android 格式。您了解了分辨率、颜色通道、颜色深度和 alpha 通道如何有助于减少数据占用空间。
在第四章中,您将了解数字音频新媒体的概念、术语和原则,以便您可以将数字音频素材添加到您的 Android Studio 应用中。
四、数字音频:概念和术语
现在,您已经了解了数字图像新媒体内容的基本概念、术语和原则以及 Android Studio 和 Android OS 支持的文件格式,是时候了解数字音频新媒体内容以及 Android Studio 和 Android OS 支持的许多文件格式了。您将了解模拟音频背后的概念,以及如何将其数字化为数字音频,因为许多模拟和数字波形概念适用于两种音频介质。
您将了解波或空气如何创造音频和模拟音频概念,如振幅和频率,以及数字音频概念,如样本和分辨率。您将了解先进的数字音频概念,如比特率、流、高清音频和受控数字音频。最后,您将看到 Android 5 OS 支持的所有强大的数字音频格式,您可以使用这些格式来开发 Android Studio 新媒体应用。
音频概念和术语
在本章中,我将让您快速了解模拟音频概念和术语,以及数字音频概念和术语。您将看到模拟音频和数字音频之间的转换是如何通过一种叫做采样的过程实现的,从事声音设计和音乐合成的人对此已经非常熟悉。您将看到使用比特率、流和现在用于广播电台和卫星的新 24 位高清音频标准对音频进行编码。您还将了解 Android Studio 中支持的音频编解码器(音频文件格式)。您将在第五章中了解数字音频数据足迹优化。我需要确保您对您最终将使用 Android 的数字音频兼容类(如 SoundPool 和 MediaPlayer)创建、优化和“渲染”的数字音频新媒体素材有深刻的理解。
模拟音频的基础:空气的声波
就像数字成像一样,数字音频可能相当复杂,尤其是在专业水平上。这种复杂性部分来自于将模拟音频技术和数字音频技术结合在一起的需要,因为现代设备是数字的。模拟音频过去是通过使用不同尺寸的扬声器锥体来产生的,这些锥体是用一种或另一种太空时代的材料制成的弹性薄膜制造的。这些扬声器通过振动或脉冲产生声波。我们的耳朵以完全相反的方式接收这种模拟音频,仍然在现场音乐会上使用:通过捕捉和接收不同波长的空气脉冲或振动,然后将它们转化为我们大脑可以处理的“数据”。这就是你如何“听到”这些声波,然后我们的大脑将这些不同的音频声波频率解释为不同的音符或音调。
声波根据其频率产生不同的音调。宽、长或不频繁的波周期产生较低的(低音)音调;而更频繁(更短)的波长产生更高(高音)的音调。有趣的是,不同频率的光产生不同的颜色,因此模拟声音(音频)和模拟光(颜色)之间有着非常密切的相关性,这也体现在数字制作技术和原理中。
声波的音量取决于声波的振幅或波的高度(垂直尺寸)。因此,声波的频率等于声波在 x 轴上的间距,如果你在 2D 观察,振幅等于声波在 y 轴上的高度。
声波可以被独特地成形,这允许它们模仿不同的声音效果。您的基线声波类型称为正弦波,这是您在高中数学中通过正弦、余弦和正切数学函数学到的。
熟悉合成器键盘的人都知道,声音设计中还使用了其他形状的声波,例如看起来像锯子边缘的锯齿波(因此得名),或者是使用直角整形的脉冲波,可以立即产生转换为脉冲的开/关声音。
甚至可以在声音设计中使用随机波形(如噪声)来获得尖锐的声音效果。您可能已经使用第三章中的数据足迹优化知识确定,声波中出现的“混乱”或噪声越多,编解码器就越难压缩它们。这导致该特定声音的更大的数字音频数据足迹。
接下来,您将进一步了解如何通过采样将模拟声波转化为数字音频数据,采样是声音设计和音乐合成的核心工具之一。
数字音频:样本、分辨率和频率
将模拟音频(声波)转换为数字音频数据的过程称为采样。如果你在音乐行业工作,你可能听说过一种叫做“采样器”的键盘(或架装设备)采样是将音频波分割成片段的过程,因此您可以使用数字音频格式将波形存储为数字音频数据。这将一个无限精确的声波转化为离散的数字数据;也就是说,分成 0 和 1。使用的 0 和 1 越多,无限精确(原始)模拟声波的再现就越精确。采样精度或分辨率决定了用于再现模拟声波的 0 和 1 的数量(您将在下一个主题中讨论)。
被采样的声波的每个数字片段被称为样本,因为它在那个精确的时间点对声波进行采样。样本的精度由用于定义每个波形切片高度的数据量决定。就像数字成像一样,这种精度被称为您的分辨率,或者更准确地说(没有双关语),样本分辨率。
音频样本分辨率定义为 8 位、12 位、16 位、24 位或 32 位。在数字成像和数字视频中,分辨率由颜色通道的数量来量化;在数字音频中,分辨率由用于定义每个音频样本的数据位来量化。在数字图像中,颜色越多,质量越好;在音频中,更高的采样分辨率可以产生更好的声音再现。
因此,更高的采样分辨率,或使用更多的数据来再现给定的声波样本,以更大的数据足迹为代价,产生更高的音频回放质量。
这就是为什么 16 位音频,称为“CD 质量音频”,听起来比 8 位音频更好;就像真彩色图像总是比索引彩色图像更好看一样。
在数字音频领域,消费电子行业现在有一种 24 位音频采样,称为“高清音频”。HD 数字音频广播电台使用 24 位样本分辨率,因此每个音频样本或声波片段包含 16,777,216 个潜在样本分辨率。一些较新的 Android 设备现在支持高清音频,例如你看到的宣传具有“高清质量”数字音频播放的智能手机。
为了让 Android 硬件设备播放这种高清音频格式,您必须拥有 24 位音频硬件;因此,我建议使用 16 位音频,您将在第五章了解音频数据占用优化。
除了数字音频采样分辨率,您还有一个数字音频采样频率。这定义了在任何给定的采样分辨率下,在一秒采样时间内采集的样本数。在数字图像中,采样频率类似于图像中包含的像素数。采样频率也可以称为采样率。CD 音质音频被定义为使用 16 位采样分辨率和 44.1 kHz 采样速率。这需要 44,100 个样本,每个样本包含 16 位的样本分辨率,或者每个样本中保存的数字音频数据的潜在最大 65,536 个数据值。
让我们做一些数学计算,找出原始(未压缩)数字音频数据在一秒钟内的数据位数。这可以通过将 65,536 样本分辨率乘以 44,100 样本频率来计算。这产生 2,890,137,600 个值的数据值,其可用于表示一秒钟的 CD 质量音频。音频编解码器将它压缩到非常小的文件大小,你将在第五章中看到。
关键是,使用数字音频也存在与数字成像完全相同的权衡。如果包含更多的数据,可以获得更高质量的结果,但代价是占用更多的数据。幸运的是,音频编解码器做得更好,提供了比数字图像编解码器更好的质量-文件大小结果。
数字音频行业常见的音频采样速率包括 8 kHz、11.25 kHz、22.5 kHz、32 kHz、44.1 kHz、48 kHz、96 KHz、192 kHz 以及最近的 384 kHz。正如你可能已经猜到的,我喜欢使用能被 2 的幂整除的那些(8 位),所以我倾向于 8 kHz(低质量)、32 kHz(中等质量)和 48 kHz(高质量),正如你将在第五章中看到的。
较低的采样率,例如 8 kHz、11 kHz 或 22 kHz,对于采样“基于语音的”数字音频,例如电影对话轨道或电子书旁白轨道,是最佳的。
更高的音频采样率,如 32 kHz 或 48 kHz,更适合音乐和可能的声音效果,如隆隆的雷声,这绝对需要高动态范围以实现高保真再现。
只要使用的采样分辨率是 16 位质量,使用较低的 11 kHz 或 22 kHz 采样速率就可以获得某些声音效果。最终,在数字音频优化过程中,您将不得不使用您的耳朵作为向导,以确定您的听觉质量与数字音频素材文件大小之间的权衡。
数字音频数据:传输和数字化
正如我提到的,卓越音频质量的行业基准被称为 CD 质量音频,其定义为 16 位数据采样分辨率和 44.1 kHz 数据采样频率。这是早在 20 世纪用于生产音频 CD 产品的材料,今天仍被用作最低质量标准。还有更新的高清音频标准,使用 48 kHz 或 96 kHz 采样频率的 24 位数据样本。如今,这种技术被用于高清收音机,以及兼容高清音频的 Android 设备,如“Hi-Fi”高清音频智能手机。由于 Android 操作系统支持 16 位 48 kHz 音频,我倾向于将此作为我的高质量音频妥协,因为数据占用更小。让我们来看看如何在 Android Studio 中使用这些素材。你是将音频存储在应用中,还是从远程服务器上传?你会使用什么样的音频回放或流比特率?
数字音频传输:流音频还是固定音频?
就像第 6 和第七章中提到的数字视频一样,数字音频素材可以是受控的,或者包含在 Android 应用 APK 文件中,音频文件在/raw
文件夹中,或者数字音频素材可以通过使用远程数据服务器进行流式传输。与数字视频类似,流式数字音频数据的好处是它可以减少 Android 应用 APK 文件的数据占用量。缺点是可靠性。正如你将在本书中看到的,许多相同的概念同样适用于图像、音频和视频。
流式音频节省了数据空间,因为您不必在 APK 文件中包含所有数据量大的新媒体数字音频。因此,如果您计划编写自动点唱机应用,您可能会考虑流式数字音频数据,因为您不会希望将您的歌曲库打包到您的 APK 文件中,因为它将是 10gb(对于大型库而言)。
否则,对于应用音频,如用户界面反馈声音、游戏音频等,请尝试优化您的数字音频数据,以便您可以将其作为专属素材包含在 APK 文件中。这样,您的应用用户就可以在需要时使用它。在本章的音频基础知识之后,您将在第五章中了解优化。
流式数字音频的缺点是,如果您的用户连接(或您的音频服务器)中断,您的音频文件可能无法供最终用户播放和收听!数字音频数据流的可靠性和可用性是另一个需要考虑的关键因素,即流式音频与强制数字音频的区别。
第七章讨论了数字视频数据占用空间优化考虑的相同权衡。
流式数字音频数据:优化设置您的比特率
数字音频流的一个主要概念是数字音频数据的比特率。同样,这与数字视频非常相似;您在学习数字视频之前学习数字音频的原因是,数字视频是由数字图像序列和数字音频组成的,所以我需要先介绍这些概念和术语。
数字音频比特率在压缩过程中由您在优化工作过程中为编解码器提供的设置来定义。在第五章中,您将看到数据占用优化,因为它与数字音频相关,您将使用 Audacity 2.1 来优化您自己的样本数字音频素材。
与数字视频一样,需要支持较低比特率以适应较慢带宽网络的数字音频文件将对数字音频数据进行更多压缩,这将导致较低的音频质量水平。
这些可以在更多设备上流畅播放。这是因为在任何给定的数据网络上,如果有较少的字节要传输,那么硬件设备中的 CPU 要处理的字节也较少。
随着处理器越来越快,它每秒可以处理更多的字节。随着数据带宽连接变得更快,它可以更舒适地每秒发送或接收更多的字节。
因此,请务必记住,您不仅要针对快速网络传输优化文件大小,还要针对新媒体素材将使用的系统内存量以及 CPU 用于处理新媒体素材数据(播放音频、播放视频、显示图像、渲染矢量等)的处理周期数进行优化。).
Android 中的数字音频:文件格式
Android 中的数字音频编解码器比数字图像编解码器多得多(只有四种图像编解码器:PNG、JPEG、GIF 和 WebP)。Android 音频支持包括. MP3 (MPEG-3)文件;。WAV (PCM 或脉冲编码调制)波形文件;. MP4 或. M4A (MPEG-4)文件;。OGG (OGG Vorbis)音频文件;。MKS (Matroska)文件;。FLAC(免费无损音频编解码器)文件;还有。MID,。MXMF,还有。XMF MIDI(乐器数据接口)文件,从技术上讲,它们甚至根本不是真正的数字音频数据。
我先解释一下什么是 MIDI。这不是您可能在 Android Studio 应用中使用的格式,但它是数字音频历史的基础,并且在其数字播放器钢琴演奏回放方法中是独一无二的。我将它包含在本章中,因为它有一些独特的、高度数据占用优化的应用。之后,我将介绍所有的采样数字音频格式。
MIDI:乐器数据接口
MIDI 代表乐器数据接口,它是使用电脑处理音频的最早方式之一。MIDI 的起源可以追溯到 20 世纪 80 年代,所以 MIDI 已经存在几十年了。
第一台配备 MIDI 数据端口硬件的计算机是 Atari ST 1040。这台电脑允许我将键盘合成器(当时是 Korg M1)插入它的 MIDI 端口。MIDI 允许我使用电脑来演奏和录制演奏数据,电脑使用 MIDI 数据格式以及被称为 MIDI 音序器的音频软件,因为它对回放数据进行排序。
MIDI 文件不包含样本数据;也就是说,它们不包含音频数据,只包含演奏数据。当电脑使用 MIDI 硬件(接口、电缆和端口)将这些演奏数据回放到合成器中时,合成器会使用 MIDI 演奏数据生成音频音调。
MIDI 记录合成器或采样器键盘上的按键何时被按下,以及按键持续时间、按下的力度(触后响应)和类似的性能细微差别。
当 MIDI 文件通过合成器回放时,它复制了表演者或作曲家的精确表演;即使那个人不再播放演奏曲目,电脑仍会播放。您可以演奏您的乐器轨道,使用 MIDI 数据录制您的乐器演奏,然后 MIDI 音序器将为您演奏演奏,同时,您可以在第一个乐器轨道旁边演奏第二个乐器轨道。
MIDI 使歌曲作者仅用他们的电脑就能组合复杂的音乐作品。这当然比雇佣工作室和音乐家要便宜。如果你想成为一名词曲作者,你可以在 http://rosegardenmusic.com
下载开源的 MIDI 软件 Rosegarden。玫瑰园不仅是一个 MIDI 音序器,而且它还包括音乐记谱法,也称为得分。这意味着你不必知道如何在五线谱上写音符和谱号来发布你的音乐!
Android 操作系统支持 MIDI 文件的回放,但没有为它们的创建实现 MIDI 类。希望这在未来会有所改变,但就目前来看,在 Android Studio 中编写 MIDI 音序器并不是一件容易的事情;但是,编码论坛上有人在说。
因此,MIDI 超出了本书的范围。我在这里介绍它只是为了让您了解 Android Studio (Android OS)中数字音频支持的历史和范围。MIDI 在数字音频的发展中扮演着重要的角色,它是音乐合成和声音设计的关键组成部分。
MPEG-3 音频:流行的 MP3 数据格式
Android Studio 中最流行的数字音频格式是 MP3 数字音频文件格式。你们大多数人都熟悉 MP3 数字音频文件,这些文件可以在音乐下载网站上找到,比如 Napster。我们大多数人都收集了这种格式的歌曲,用于流行的 MP3 播放器和我们的 CD-ROM 音乐收藏中。
这种 MP3 数字音频文件格式受欢迎的原因是因为它具有相对较好的压缩比,而且播放 MP3 音频文件所需的编解码器随处可见,甚至在 Android 操作系统中也是如此。
只要您通过使用开源 Audacity 2.1 音频软件(在第五章中介绍)对音频数据占用优化使用最佳编码工作流程,就可以在您的 Android Studio 应用中使用 MP3 格式。由于软件专利,Audacity 不能包含 MP3 编码软件或从自己的网站分发 MP3 软件,所以一定要为 Audacity 下载并安装一个免费的 LAME 编码器。
值得注意的是,MP3 编解码器输出有损音频文件格式(就像 JPEG 对图像所做的那样),其中一些音频数据以及质量在压缩过程中会被丢弃,并且无法恢复。
Android 支持一种叫做 FLAC 的开源无损音频编解码器。这代表免费无损音频编解码器。由于软件解码器的免费性质,对 FLAC 的支持像 MP3 一样广泛(编解码器是编码器-解码器,就像在代码-解码中一样)。
FLAC:24 位免费无损音频编解码器
FLAC 使用快速算法,因此解码器针对速度进行了高度优化。FLAC 支持 24 位音频,使用它没有专利问题。如果您需要高质量的音频和合理的数据占用,这是一个很好的音频编解码器,可以在 Android Studio 中使用。FLAC 支持一系列采样分辨率,从每个采样 4 位数据到 32 位数据采样。它还支持大范围的采样频率,从 1 Hz 到 65,535 Hz(或 65 kHz),增量为 1Hz,因此非常灵活。从音频播放硬件的角度来看,我建议使用 16 位采样分辨率,以及 44.1 kHz 或 48 kHz 的采样频率,除非你的目标是高清音频。
Android 3.1 或更高版本支持 FLAC。因此,如果您的最终用户正在使用当前的 Android 设备,您应该能够安全地利用这个 FLAC 编解码器。在 Android 应用开发中使用完全无损的新媒体素材(如 PNG8、PNG24、PNG32 或 FLAC)是可能的,只要你的应用是针对 Android 3.1 或更高版本的硬件设备。接下来,让我们看看另一个令人印象深刻的开源编解码器。
OGG Vorbis:有损开源音频编解码器
Android 支持的另一种开源数字音频编解码器是 OGG Vorbis 格式。这个有损音频编解码器是由 Xiph.Org 基金会带给你的。Vorbis 编解码器数据通常保存在。OGG 音频数据文件扩展名,因此,Vorbis 通常被称为 Ogg Vorbis 数字音频数据格式。
Ogg Vorbis 支持 8 kHz 至 192 kHz 的采样速率,并支持 255 个离散数字音频通道。如你所知,这代表 8 位的音频通道。OGG Vorbis 支持所有 Android 版本或 API 级别的版本。
Vorbis 正在迅速接近 MPEG HE-AAC 和 Windows Media Audio Professional 的质量,其质量优于 MP3、AAC-LC 和 WMA。这是一种有损格式,因此 FLAC 编解码器的再现质量优于 Ogg Vorbis,因为 FLAC 包含所有原始数字音频样本数据。
MPEG-4 音频:高级音频编码(AAC)
Android 支持所有 MPEG-4 AAC(高级音频编码)编解码器,包括 AAC-LC、HE-AAC 和 AAC-ELD。应该使用 MPEG-4 文件容器(. 3gp、. mp4 或. m4a 文件扩展名)来包含这些文件。AAC-LC 和 HE-AAC 可以用所有版本的 Android 解码。AAC-ELD 仅在 Android OS 4.1 之后受支持。ELD 代表增强型低延迟;该编解码器旨在用于实时双向通信应用,如数字对讲机或 Dick Tracy 风格的智能手表应用。
最简单的 AAC 编解码器是 AAC-LC(低复杂度)编解码器,使用最广泛。这对大多数数字音频编码应用来说已经足够了。与 MP3 编解码器相比,AAC-LC 以更低的数据占用量产生更高质量的结果。
作为最复杂的 AAC 编解码器,HE-AAC(高效)编解码器支持 8 kHz 至 48 kHz 的采样速率,以及立体声和杜比 5.1 声道编码。安卓解码 V1 和 V2 级别的 HE-AAC。Android 也可以在 4.1 版以后的 Android 设备中使用 HE-AAC-V1 编解码器对音频进行编码。
由于软件专利,Audacity 不包括 MPEG-4 编码器。在开始第五章之前,请务必从 http://lame.buanzo.org
下载并安装 Audacity 的免费 FFMPEG 2.2.2 编码器,在那里您将使用最新的 Audacity 2.1.1!
MPEG-4 AMR:自适应多速率音频编解码器
对于编码语音来说,它通常具有与音乐不同的声波类型,还有另外两种 AMR(自适应多速率)音频编解码器,它们对于编码语音或“短脉冲”声音效果等非常有效。
Android 中有一个 AMR-WB(自适应多速率宽带)编解码器,支持 9 种离散设置,从 6.6 kbps 比特率到 23.85 kbps,采样频率为 16 kHz。就语音而言,这是一个相当高的采样率!例如,如果您正在创建交互式电子书 Android Studio 应用,这是在旁白音轨上使用的编解码器。
Android 中还有一个 AMR-NB(自适应多速率窄带)编解码器,支持 8 种离散设置,从 4.75 kbps 到 12.2 kbps 音频比特率,采样频率为 8 kHz,如果进入编解码器的数据是高质量的,或者如果由于内容的噪声性质(例如炸弹爆炸),产生的音频样本不需要高质量,这是一个足够的采样速率。
PCM 音频:脉冲编码调制编解码器
最后,Android 支持 PCM(脉冲编码调制)编解码器,通常称为 Windows WAVE。WAV)音频格式或苹果 AIFF(音频交换文件格式)。你们大多数人都熟悉这两种流行操作系统之一的无损数字音频格式。它是无损的,因为应用了零压缩。PCM 音频通常用于 CD-ROM 内容以及电话应用。这是因为 PCM Wave 音频是一种未压缩的数字音频格式,它没有应用于数据流的 CPU 密集型压缩算法,因此解码(CPU 开销)对于电话设备或 CD 播放器来说不是问题。
因此,当您在第五章开始将数字音频素材压缩成各种文件格式时,您可以使用 PCM 作为您的“基准”文件格式。但是,您可能不会将 PCM 放入您的 APK 文件中,因为还有其他格式,如 FLAC 和 MPEG-4 AAC,它们可以使用数量级更少的数据提供相同的质量。
最终,对于任何给定的音频数据,找出哪些 Android 支持的音频格式具有最佳数字音频效果的唯一方法是,实际上在所有您知道的受良好支持且高效的主要编解码器中对数字音频进行编码。我在第五章向你展示这是如何完成的。
摘要
在本章中,您了解了数字音频的概念、原理以及压缩和解压缩数字音频素材的 Android 音频文件格式。您了解了音频声波、频率、振幅、采样、采样分辨率和比特率,以及这些如何定义您的数字音频素材。
在下一章中,您将了解数字音频数据占用优化的概念、术语和原则。
五、数字音频素材:数据足迹优化
现在,您已经了解了数字音频新媒体内容的基本概念、术语和原则,以及 Android Studio 和 Android OS 支持的文件格式。因此,现在是时候开始优化数字音频数据占用空间,为您的音频素材获得尽可能小的数字音频文件大小,同时获得高质量的音频回放。
您将会看到开源的 Audacity 2.1.1 软件包,并了解如何使用它来记录、编辑、增强、压缩和优化数字音频素材,因为您会将在第四章中学到的模拟和数字波形概念应用到 Android Studio 中。
您将了解优化您的 Android 数字音频素材(包括设备兼容性)的主要考虑因素、衡量压缩的基准素材以及每个编解码器。
音频优化:设备兼容性
优化您的数字音频素材以便在市场上最广泛的 Android 设备上播放将比优化数字视频或数字图像更容易。这是因为屏幕分辨率和显示器纵横比的差异要比数字音频播放硬件支持的差异大得多,除了具有新的 24 位高清音频播放兼容性的 Android 硬件。
人的耳朵无法像眼睛在数字图像中那样感知数字音频中的质量差异。对于跨 Android 设备的数字音频支持,您应该瞄准两个重要的“最佳点”。较低质量的音频(旁白轨道、简短的声音效果)可以使用 11 kHz 或 22 kHz 的采样速率,采样分辨率为 8 位、12 位或 16 位。高质量音频目标包括使用 16 位或 24 位分辨率、48 kHz 采样速率的 CD 或 HD 质量音频。
您在 Android 设备上优化数字音频素材的逻辑工作流程包括创建 16 位素材,因为所有 Android 设备都支持 16 位音频。您将使用 48 kHz 的采样速率,以便获得高质量的未压缩起点,然后使用 Android 中支持的所有不同编解码器优化(压缩)PCM 格式。
一旦该工作流程完成,您将能够确定哪些数字音频素材能够为您提供最高质量的数字音频播放,同时尽可能减少数据占用空间。让我们开始吧!
数字音频优化:工作流程
让我们通过点击任务栏上的快速启动图标来启动 Audacity 2.1.1。单击位于 Audacity 左下方的采样频率下拉菜单。如图 5-1 所示使用中;如您所见,我选择了 48 kHz 的采样速率。采样速率选择器旁边是捕捉设置,以及用于选择开始、结束或长度和音频位置的小时、分钟、秒和毫秒显示,用于微调。
图 5-1。
Set a sampling rate to 48 kHz in the drop-down menu
现在,您可以开始录制您的画外音了。我用这本书的名字录了一句话,Android Studio 新媒体基础。在 Audacity 2.1 中录制音频的方法是点击 record 按钮(Audacity transport 右侧的一个红点,位于程序的左上方),如图 5-1 所示。对着桌面麦克风朗读画外音;我用的是在沃尔玛买的罗技立式麦克风,最初是用于 Skype 的,只花了几美元。
使用“消费者”麦克风会带来背景噪音问题,但这给了我机会向您展示 Audacity 2.1 的一些专业级特性,比如降噪。准备好大吃一惊吧。我在第五章中记录了我的声音。wav 文件包括在这本书里,以防你没有麦克风,只是想跟着走。
然而,我建议你练习使用 Audacity 来录制你自己的短语。在任何情况下,一旦你录制了你的声音,你会看到 Audacity 中显示的左右声道波形,如图 5-2 的中间所示。
图 5-2。
Click the Audio Track drop-down menu ; select Set Sample Format ➤ 16-bit PCM to convert 32-bit resolution to 16-bit
由于您在录制声乐音轨之前将采样速率设置为 48 kHz,现在您需要从 Audacity 用来录制的 32 位设置中设置采样分辨率。这为您提供了最大的数据分辨率;选择音轨➤集样本格式➤ 32 位浮点设置显示,如图 5-2 所示。
数据占用优化工作流程的第一步是将原始音频样本数据格式从 32 位 48 kHz 更改为 16 位 48 kHz 原始音频样本数据格式,这是我们 PCM WAV 格式基线使用的格式。
在图 5-2 中,这显示在屏幕的左下方。在设置样本格式子菜单中选择 16 位 PCM 作为样本格式选项(而不是 Audacity 默认设置的 32 位浮点选项)。
这立即将进入编码器的音频数据量减少了 100%!您想要设置一个合理的 16 位 48 kHz 音频数据基线,以便可以看到每种格式相对于未压缩 PCM 结果的压缩结果。
修剪音频样本:移除未使用的音频
为了减少总体数据占用量,您需要做的下一件事是删除不属于画外音样本的任何额外音频数据。这些数据通常是在你开始讲话之前和结束讲话之后,在你按下停止按钮结束录音功能之前。为此,使用走带控制按钮右侧的竖条(选择音频)工具仅选择相关的音频数据,如图 5-3 所示。
图 5-3。
Setting audio sample resolution to 16-bit PCM (uncompressed) before you export to various formats
现在您已经准备好使用 Audacity Trim 特性了,该特性用于修剪掉未使用的音频数据。在图 5-3 中,您想要点击以修剪掉样本中未被选择(未使用)部分的图标被圈起来,同时弹出工具提示。
这仅提供了您的声乐短语音频部分,您的显示器可能会有足够的空间来放大音频波形,以便您可以更准确地看到您正在处理的内容。
放大镜缩放工具位于选择工具的正下方;它是一个看起来像文本插入光标的竖条。选择缩放工具并单击波形以放大它。您可以向右调整 Audacity 窗口的大小,以显示音频样本的结尾,这样您就可以看到整个波形,如图 5-4 所示。
图 5-4。
Select an area with only noise and use the Effect ➤ Noise Reduction menu sequence
要试听修剪后的波形,请点按位于走带控制中的播放图标。这是一个绿色的向右箭头,位于“录制和回放传输 UI”面板的左侧,控制您处理音频时音频的操作。
降噪:去除背景噪音
回放数字音频样本时,您会听到明显的背景噪音,这种噪音在 Android Studio 应用中不够专业。让我们获得一些使用 Audacity 效果菜单去除背景噪音的经验。
在 Audacity 中消除噪音的工作流程是使用垂直条工具选择音频样本中只有噪音的部分,Audacity 非常适合配音音轨。降噪算法使用该数据来确定在其噪声去除工作过程的第二步中从整个音频样本中去除什么数据。
正如您在图 5-4 中看到的,我选择了样本数据中有噪声但没有声音内容的部分。然后我选择了无畏效果菜单➤降噪选项。
这将打开降噪对话框,如图 5-5 所示,您可以点击获取噪声分布图按钮。
图 5-5。
Click the Get Noise Profile button in the Noise Reduction dialog, and then apply the algorithm by clicking OK
在此输入您选择的仅噪声数据(参见图 5-4 )并将该数据传递给降噪算法,作为降噪对话框中为您概述的降噪工作流程的第一步。
值得注意的是,即使对话框告诉您选择“几秒钟”的噪声数据,您也没有那么多噪声,因此您选择的是十分之一秒,这也很好,因为十分之一秒的数字音频包含大量数据。如果你有很长的样本,比如阅读一个段落,你可以选择几秒钟。
或者,您可以在执行修剪操作之前应用降噪,在音频样本的开头和结尾提供更多未使用的噪声数据。
一旦您单击“获取噪波配置文件”按钮,这将为降噪算法提供它需要处理的数据,“确定”按钮将变为启用状态。然后进入第 2 步,实际处理噪声数据,并将其从人声音频样本中完全移除。Audacity Effect 特性(实际上更像是一个过滤器)本身就值 Audacity 的成本。等一下——Audacity 是免费的!抱歉,我忘了。
建立基线:导出 PCM 格式
工作流程的下一步是将您的“基准”16 位未压缩 PCM 编解码器格式导出为 WAV 音频文件。wav)文件(Windows)或 AIFF 音频文件(Macintosh)。您将使用它来查看最大可能的音频文件大小,用作基线,并查看 3.45 秒画外音的 16 位 48 kHz 音频样本将使用多少系统内存。
在 Audacity 中导出(保存)数字音频文件格式素材的方法是选择文件➤导出音频菜单序列,如图 5-6 左侧所示。如果您只想选择和保存(导出)一段音频样本,还有一个文件➤导出选定的音频菜单序列。
图 5-6。
Use the File ➤ Export Audio menu sequence to export
如果您的音频样本包含您想要从较长的音频数据样本中提取的音频“片段”,则导出所选音频功能非常方便。在这种情况下,您可以使用此功能从完整的声乐中提取每个单词。
导出音频对话框如图 5-7 所示,包括名称、选项、文件位置和编解码器选择等关键区域。
图 5-7。
Export a PCM file named Chapter5noiseReduced.wav to use as a baseline to measure other codec compression results
Save in folder 说明符,它指向一个 CH05 book assets 文件夹,告诉 Audacity 我想在哪里保存一个音频素材。文件列表窗格显示文件夹内容。文件名数据输入字段是您命名文件的地方;在这种情况下,Chapter5noise reduced . wav .下面是 Save as type 下拉选择器,它包含 Audacity 导出的所有文件格式。
为了让这个下拉菜单为您提供 Android Studio 支持的所有编解码器格式,您需要在您的系统上安装最新的 LAME 和 FFmpeg 编解码器库,以便 Audacity 可以在启动时找到它们。
请注意,我将导出文件对话框设置为以 wav(微软)签名的 16 位 PCM 格式导出第五章 noiseReduced.wav。您不需要指定。如果不希望文件名的 wav 扩展名部分,由于编解码器说明符。
如果您点按位于“导出音频”对话框右下角的“选项”按钮,您会发现对于 WAV 音频格式,您会看到一个对话框,通知您没有 PCM 文件的编码选项。这是因为 PCM 包含未压缩的数据,所以没有要设置的选项。
单击“保存”按钮后,将出现“编辑元数据”对话框,供您输入想要包含在音频文件中的任何元数据(参见图 5-8 )。这些数据与音频数据一起以每种文件格式存储;可以用安卓访问。每个音频格式的导出都会出现此对话框。
图 5-8。
Export an M4A AAC audio file named buttonaudio.m4a using the maximum quality setting of 500
该对话框具有包含文本值的数据字段,例如艺术家姓名、曲目标题、专辑标题、曲目编号、年份、流派和注释。
因为我正在优化基线数据占用,并且应用不需要音频元数据,所以我现在将这些字段留空,以便您可以准确了解文件大小;即只包含音频数据的文件。如果您想知道 Android Studio 应用如何读取和支持音频元数据,并希望将这些数据安装在音频文件中,答案是 Android 的 MediaMetadataRetriever 类,开发人员利用它来实现这一非常具体的目的。
如果您的 Android 应用需要使用音频媒体元数据,您应该使用编辑元数据对话框和 Android MediaMetadataRetriever 类,您可以在 http://developer.android.com/reference/android/media/MediaMetadataRetriever.html
了解更多信息。
如果您查看刚刚保存的 Chapter5noiseReduced.wav 16 位 PCM WAV 文件,您会发现文件大小为 558 KB,略大于半兆字节。
因此,这个 3.45 秒按钮音效样本的基线未压缩数据(和内存)占用量为 558 KB。您可以使用这个数字来确定所有 Android 数字音频格式的压缩量。
导出无损 FLAC: FLAC 音频文件
您要尝试的第一种格式是 FLAC 音频编解码器,因为它使用无损压缩。这让您很好地了解了在不丢弃任何原始音频数据的情况下,使用压缩可以减少什么样的数据占用空间,这将为您提供与 16 位 PCM WAV 音频一样完美的结果!
为此,你将再次使用文件➤导出音频菜单序列,而这一次,你将下拉一个另存为类型菜单,并选择 FLAC 文件格式,如图 5-9 所示。
图 5-9。
Export a FLAC file named Chapter5.flac with Level 8 compression and a Bit depth of 16-bit
同样,将这个文件命名为 Chapter5.flac。我将把它保存到本书的 CH05 文件夹中。请注意,只有 FLAC 文件列在该对话框的中间区域。这是因为现在您已经选择了 FLAC 文件格式,对话框中间的这个区域只显示 FLAC 文件,而 CH05 文件夹中目前没有 FLAC 文件。因为我想显示每种格式的文件大小,我事先保存了文件,所以大小包括在屏幕截图中,以及设置和选项对话框中。
若要设置 FLAC 编解码器选项,请单击“选项”按钮,并将质量级别设置为 8(最佳),并将位深度设置为使用 16 位数据分辨率。请注意,在“位深度”下拉列表下,您也可以使用此 FLAC 编解码器来获得无损的 24 位高清音频。请注意,我将导出音频和选项对话框放在一个统一的屏幕上,以减少我使用的截图数量。
一旦你输出了你的 buttonaudio.flac 音频素材,进入文件管理器,看看文件大小。您将看到它是 212 KB,或者减少了 100%以上。212 ÷ 558 = 0.38,只有 PCM 文件的 38%。
接下来,让我们看看另一种开源格式 Ogg Vorbis,看看它是否能给我们带来更小的数据占用空间。由于 Ogg Vorbis 是一种有损文件格式,它应该提供比 FLAC 更小的文件大小。
导出有损耗的 Ogg Vorbis: OGG 音频文件
再次使用文件➤导出音频工作过程,因为你已经在前面打开这个导出音频对话框,并选择 Ogg Vorbis 文件选项从您的保存类型下拉菜单。我将文件命名为 Chapter5,这样就产生了一个 Chapter5.ogg 文件名,放入 CH05 文件夹,如图 5-10 所示。点按“选项”按钮,并选择介于 0 和 10 之间的质量设置级别。我一开始使用的最大设置是 10。在实际的数据占用优化会话中,您可能会尝试几种设置,以查看质量设置滑块如何影响数据占用与质量的权衡。
图 5-10。
Export an OGG Vorbis file named Chapter5.ogg using a Quality level of 10
一旦你输出了你的 Chapter5.ogg 音频资源,看看文件的大小。您会看到它是 149 KB,文件大小减少了 400%:149÷558 = 0.27,大约等于四分之一,或者说小了四倍。这是一个显著的大小缩减,音频听起来与使用有损压缩之前的音频一样,500 分之 350,即 70%的质量(350 ÷ 500=0.7)。
接下来,我们来看看 MP3,这是目前最常见的有损音频格式。看看 MP3 是否能提供比 Ogg Vorbis 开源编解码器更小的数据占用空间(149 KB)应该会很有趣。
导出有损 MPEG-3 格式:MP3 音频文件
再次使用文件➤导出音频菜单序列,调出导出音频对话框,将保存类型下拉选择器设置为 MP3 文件,如图 5-11 所示。我将文件命名为 Chapter5 并选中 CH05 文件夹,然后点击 MP3 选项按钮打开指定 MP3 选项对话框,如图 5-11 右侧所示。我使用 320 kbps 的最大比特率质量设置,这对于音频数据来说是相当高的,但我试图获得 MP3 压缩的高端基线,并仍然将 MP3 与未压缩的 PCM 基线进行比较。我还选择了恒定比特率模式,因为这是最容易解码的,立体声通道模式,因为文件是立体声。
图 5-11。
Export an MP3 file named Chapter5.mp3 using Stereo Channel Mode, a Quality of 320 kbps and Constant Bit Rate Mode
如果您愿意,您还可以尝试不同的质量比特率设置以及可变和平均比特率模式,看看它如何影响 MP3 音频文件的数据足迹。如果您决定这样做,为了区分您的文件,只需使用文件名中的设置来命名文件。例如,具有可变比特率模式的 320 kbps 质量设置的文件应该被命名为:例如,Chapter6_320_kbps_vbr.mp3。
这样,您可以比较 MP3(或任何其他编解码器文件格式)和音频文件的大小,并做简单的数学计算,以计算出您的百分比数据足迹减少。
Chapter5.mp3 文件大小为 119 KB,数据占用空间减少了 469%。我们来计算一下:119 ÷ 558 = 0.21326,是原始的、未压缩的文件大小的 21%;100%–21% = 79%的文件大小缩减。
如果你在计算器上使用 1/x(反转)键,你可以从另一个方向得到一个百分比的减少。将 0.21326 取反得到 4.689,这意味着文件大小减少了 4.689 倍,相当于减少了 469%。这是一个相当可观的数据占用空间减少!
既然您已经看到. MP3 文件比 Ogg Vorbis 文件小,那么让我们来看看与 MPEG-3 相比,M4A 文件格式的 MPEG-4 AAC 数据压缩如何提高文件的大小质量比。由于 MPEG-4 使用更先进(更新)的编解码器算法,M4A 应该为您提供更好的文件大小与质量的优化比例。
导出有损 MPEG-4 格式:M4A 音频文件
按照通常的文件➤导出音频工作过程调用导出音频对话框,并从保存类型下拉选择器中选择 M4A (AAC)文件(FFmpeg)。像往常一样,将文件命名为 Chapter5,在您单击 Save 之后,导出器将其命名为 Chapter5.m4a。将其保存在 CH05 目录下,或者任何你的数字音频素材文件夹下,然后点击选项按钮打开指定 AAC 选项对话框,如图 5-12 所示。我选择将我的质量设置为 350。单击“确定”设置质量,然后单击“保存”导出第五章. m4a 文件。
图 5-12。
Export an M4A file named Chapter5.m4a using a Quality of 350 out of 500
您的 Chapter5.m4a 文件大小为 74 KB,相当于未压缩数据空间的 13%,或者说数据减少了 87%。为了解决这个问题,74 ÷ 558 = 0.1326,这是原始未压缩文件大小的 13%;100%–13% = 87%的文件大小缩减。取 0.1326 的倒数,数据占用空间减少了 7.54%,即 754%。
现在,您已经看到您的 M4A AAC 文件大小是迄今为止最令人印象深刻的数据足迹减少,让我们看看更加专业的 AMR-NB(窄带)数据压缩编解码器是否比 MPEG-4 AAC 提供了任何进一步的数据足迹改进。
由于这种编解码器是为语音优化的,因此结果可能会比您迄今为止遇到的任何编解码器都要好。所以抓紧你的帽子!关于录音,有一点需要注意,那就是它不需要立体声。
导出窄带格式:AMR 音频文件
尽管这种 MPEG-4 AMR-NB 编解码器和数据格式是专门为语音记录应用而设计和优化的,但可能还有一些其他应用;例如,通过使用此编解码器,某些短脉冲声音效果可能会获得合理(如果不是很好)的效果。如您所知,任何编解码器都只是使用软件实现的复杂的数学算法。它没有区别,所以真正找出哪种编解码器将为您提供任何给定资源的最佳压缩质量结果的唯一方法是通过编解码器运行原始的未压缩音频数据,看看会发生什么。
让我们接下来做这件事,然后你将完成对 Android Studio 中支持的和 Audacity 2.1.1 中也提供的音频编解码器的比较。幸运的是,我想在 Android 应用中使用的所有工具都在 Audacity 中。
遵循通常的文件➤导出音频工作流程,以便调用 Audacity 导出文件对话框,然后从保存类型下拉菜单选择器中选择您的 AMR(窄带)文件(FFmpeg)选项。像往常一样,将文件命名为 Chapter5,在您单击 Save 之后,导出器将它命名为 Chapter5.amr。将文件保存在您的 CH05 目录中,或者您的数字音频素材文件夹的名称,然后单击选项按钮打开指定 AMR-NB 选项对话框(参见图 5-13 的右侧)。我选择使用 12.20 kbps 比特率设置来获得此编解码器的最高质量结果。
图 5-13。
Export an AMR file named Chapter5.amr using a Bit Rate of 12.20 kbps
单击 Save,如您所见,这是迄今为止您获得的最小数据占用量,仅使用了 5 KB 的数据。
有趣的是,当您回放这个 AMR 音频样本时,它听起来仍然很像您到目前为止生成的其他受支持的编解码器格式中包含的音频。
Chapter5.amr 文件大小为 5 KB,表示数据占用空间减少了 99%以上。让我们来算一下:5 ÷ 558 是 0.0089,是原始未压缩文件大小的 0.89%;100%–1% = 99%的文件大小缩减。如果对 0.00896 求逆,则得到 111.6,这表示数据占用空间减少了 11,600%。
我不知道你怎么想,但由于它只是一个会说话的应用,我决定使用 5 KB 的音频素材,而不是 74 KB、119 KB、149 KB 或 212 KB 的音频素材。
摘要
在本章中,您了解了关于六种主要 Android 数字音频格式的数字图像数据足迹优化概念和原则,这些格式可以解压缩您的数字音频素材(使用开源 Audacity 2.1.1 专业音频编辑和效果软件应用创建)。
您还了解了如何将数字音频素材的规格与目标 Android 设备的硬件功能相匹配。对于高质量的音频,这意味着为高清音频设备使用 24 位 48 kHz 音频,或为所有 Android 设备使用 16 位 48 kHz 音频。
您了解了如何使用 Audacity 录制音频、修剪音频剪辑、将降噪算法应用于立体声音轨,以及导出到当今 Android Studio 应用开发中使用最广泛的六种数字音频编解码器格式。
您学习了如何计算数据占用空间减少百分比,并将其应用于六种不同的数据格式,以查看从 FLAC 到 AMR-NB 编解码器的 62%到 99%以上的减少幅度。
在下一章中,您将了解数字视频的概念、术语和原理。
六、数字视频:概念和术语
现在,您已经了解了数字音频新媒体内容和 Android Studio 文件格式优化的基本概念、术语和原则,是时候了解数字视频新媒体的概念、术语和原则了。Android Studio 支持的两种流行文件格式是 WebM 和 MPEG-4 AVC。您将了解模拟视频(电影)背后的概念,并学习如何将其数字化为数字视频,因为许多模拟电影和数字视频概念适用于这两种媒体。
您将了解如何使用高速显示的图像帧创建数字视频,并学习帧速率和分辨率等数字视频概念。您还将了解高级数字视频播放概念,如比特率、视频流、高清音频和受控数字视频。
最后,您将看到 Android Studio 支持的开源数字视频编解码器和数字视频文件格式,您将使用它们来开发 Android 新媒体应用。
数字视频概念和术语
数字视频由数字图像和数字音频组成,这也是我在本书前半部分讲述这些章节的原因。数字视频素材使用 Android 的数字视频兼容类,如 VideoView、MediaController 和 MediaPlayer。MediaPlayer 和 MediaController 类也与数字音频素材兼容,因此可用于数字音频或数字视频播放。
除了视频剪辑播放之外,数字视频还可以用于 Android Studio 应用开发中的许多事情。您可以在用户界面设计中、在背景中或结合 i3D 项目设计使用数字视频。
数字视频概念:帧和帧速率
数字视频将数字图像延伸到 4D,时间的第四维度。这是通过数字视频和电影行业中称为帧的东西来完成的。一帧只是一个数字图像,它包含在一组略有不同的数字图像中,使其成为一种数字视频素材。
您的数字视频素材由有序的帧序列组成,这些帧序列可以快速显示,并产生预期的运动图像幻觉。
2D 数字视频素材框架的基本概念建立在 2D 数字影像的基本概念之上。数字视频帧还包含每个图像帧的像素,这意味着数字视频素材也具有分辨率、纵横比和色深。数字视频资源中的所有帧必须使用完全相同的分辨率、宽高比和色深。
大多数数字视频资源使用 24 位色深,这也是 Android 所支持的。索引彩色视频确实存在,因为微软视频 1 编解码器要么在 8 位 托盘化颜色模式中运行,要么在 15 位 RGB _565 颜色空间中运行。动画 GIF(GIF 或 AnimGIF)可以索引运动视频图形资源的调色板,但目前 Android API 中不支持 Microsoft Video 1 或动画 GIF。
就像数字图像中的像素一样,数字视频帧会随着每一帧的使用而增加你的数据足迹,正如你将在第七章中看到的。在数字视频中,不仅数字视频帧的分辨率会极大地影响最终文件的大小,而且在视频编码过程中,编解码器需要分析和压缩的每秒帧数也会影响最终文件的大小。如您所知,要压缩的数据越多,文件就越大,即使压缩算法正在减少数据。
这个每秒帧数通常称为 FPS,在数字视频和电影制作行业中也通常称为“帧速率”。
常见的帧率包括 i3D 主机游戏 60 FPS,数字视频 30 FPS,故事片 24 FPS,多媒体 20 FPS。正如你将在第七章中看到的,有一些新的媒体内容支持更低的帧速率,比如 15 FPS 或 12 FPS。
根据每秒帧数(FPS)值,将 1 除以 FPS 值,即可得出每帧显示的时间。
因此,20 FPS 帧显示 0.05 秒,30 FPS 帧显示 0.033 秒,24 FPS 帧显示 0.04167 秒,60 FPS 帧显示 0.0167 秒,依此类推。接下来,让我们看看计算原始视频数据或所需系统内存量的数学方法。
数字视频数学:做乘法
在第二章中,您了解到如果您将图像中的像素数量乘以颜色通道的数量,您将获得该图像的原始数据足迹。对于数字视频,您将该数字乘以数字视频设定回放的每秒帧数,以获得每秒的数据足迹。要获得总的数据占用量,您需要将该数字再次乘以代表视频剪辑持续时间的秒数。
因此,对于 VGA 或 SD 视频,分辨率为 640×480,色深为 24 位,只有一帧视频的[(640x480)x3]=921,600
。在 30 FPS 时,这是921,600x30=27,648,000
字节的数据。用这个除以 1024,你就有 27,000 KB 的数据,或者一秒钟视频的 27 MB 原始数据(或系统内存)。
您可以看到为什么拥有一个强大的视频编解码器,在最佳压缩设置的情况下,将原始数据压缩一个数量级是极其重要的!接下来让我们看看数字视频编解码器算法,这样您就可以了解编解码器是如何实现这一点的。
数字视频算法:数字视频编解码器
一旦您确切了解如何最佳优化数字视频压缩工作流程,您将会对使用 MPEG-4 和 WebM 视频文件格式实现的一些数字视频数据压缩率感到惊讶。这是通过为您的数字视频内容和特定应用使用正确的比特率、帧速率、帧分辨率和色深来实现的。
在第七章中,当您在 Terragen 3.3 中创建(渲染)3D 视频内容,使用 AVI 文件格式封装它,然后使用 Sorenson Squeeze Pro 软件压缩它时,您将采取实践的方法来学习这一点。所以下一章你可以把重点放在软件上;在这一章中,我试图涵盖适用于您的数字视频数据足迹优化工作流程的所有概念和理论。我正在写一章关于理论,一章关于为每种新媒体类型使用软件。
让我们看看数字视频编解码器与数字音频或数字图像编解码器有何不同。在数字视频压缩算法中,有一些数字图像和数字音频压缩的元素,但是它可以更复杂一个数量级,因为它必须确定和压缩帧间像素运动。因此,编解码器不仅在 2D 空间(像素和波形)中压缩,而且还在 4D 空间中压缩;也就是说,帧之间的任何变化。出于这个原因,摄像头视频,或者没有平移或缩放的视频,压缩得更好,因为有像素在帧之间不移动。
Android 中的视频:MPEG-4 H.264 AVC 和 WebM
Android Studio 支持 HTML5 支持的两种开源数字视频格式:MPEG-4 H.264 AVC 和 ON2 VP8 和 ON2 VP9 编解码器,这两种编解码器是谷歌从 ON2 Technologies 收购的。Google 重命名了这些 WebM,然后以开源许可模式发布了它们。从内容制作的角度来看,这是一个好消息,因为开发人员制作和优化的视频内容可以用于 HTML5 应用、浏览器和硬件设备,以及 Android Studio 应用。Android 5.0 及更高版本还增加了对 MPEG-4 H.265 HEVC 的支持(仅回放)。
这种数字视频格式跨平台支持为内容开发者提供了每个内容制作者和程序员梦寐以求的“一次制作,随处发布”的制作场景。这可以降低内容开发成本,从而增加你的收入,只要内容开发中的“规模经济”被开发者所利用。
由于目前所有 Android 设备的显示器都使用中(1280×720)到高(1920×1800)分辨率,有些设备使用超高(4096×2160)分辨率,因此您可以使用 MPEG-4 H.264 AVC 格式。这是当今世界上最常用于 Android 或 HTML5 的数字视频格式。
MPEG-4 H.264 AVC:使用和支持最广泛的编解码器
这种 MPEG-4 H.264 AVC(高级视频编码)视频文件格式在每个 Android 版本上都支持回放,在 Android 3.0 和更高版本中支持视频录制。
如果你是一名视频内容制作人,你会发现这种 MPEG-4 H.264 AVC 格式提供了最好的压缩结果,特别是如果你使用的是更高级的编码套件之一,如 Sorenson Squeeze Professional 软件,你将在第七章中使用该软件来优化我们的 3D 视频素材。
MPEG-4 数字视频的文件扩展名支持包括. 3GP (MPEG4 SP 或标准播放)和. MP4 (MPEG4 H.264 AVC)。我建议用后者的 MPEG-4 AVC,HTML5 我用的就是这个;MP4 更常见于 AVC 格式的流媒体,但这两种类型的扩展在 Android 应用中都应该工作得很好。
ON2 VP8 和 VP9:新的 WebM 或网络电影格式
Android Studio 支持的最新数字视频格式称为 WebM 数字视频格式。这种格式还能以较小的数据占用空间提供高质量的结果。这就是谷歌收购 ON2 的原因,ON2 是开发 VP8 和 VP9 编解码器的公司。Android 2.3 首次原生支持播放 WebM 视频。术语“本地支持”与 API 代码一起使用;在这种情况下,它是一个编解码器,已经成为 Android 操作系统的一部分。
WebM 还支持视频流,这一点你也将在本章的后面部分了解到。Android 4 和更高版本支持 WebM 视频流播放功能。
出于这个原因,我建议使用 WebM 作为强制视频素材,因为 Android 2.3 到 5.4 支持非流式 WebM 编解码器。
如果你想知道,强制视频是非流式视频,其中视频素材被强制保存在/res/raw/
文件夹中。第三章第三章介绍了数字音频的概念和技术,您将首次接触到受控与流媒体的概念。
如果你只打算流视频,使用 MPEG-4 H.264 AVC,因为自 1.5 以来,所有 Android Studio 版本和所有 Android API 级别都支持该编解码器。
数字视频分辨率:行业标准
让我们从商业视频中使用的主要分辨率开始。在 HDTV(高清晰度电视)出现之前,视频被称为“SD”,即标准清晰度,使用 480 像素的标准垂直分辨率。SD 的原始纵横比为 4:3 (640×480)。最近,增加了宽屏宽高比,使标清视频分辨率达到 720×480。
高清分辨率视频有两种不同的分辨率:1280×720,我称之为“伪高清”,1920×1080,视频行业称之为“真高清”两者都使用 16:9 的宽屏宽高比,现在不仅用于电影、高清电视和 iTV 电视机,还用于智能手机(Razor HD 为 1280×720)和平板电脑(Kindle Fire HD 为 1920×1200)。
顺便说一下,1920×1200 的分辨率是一个不太宽或较高的 16:10 像素纵横比。作为一种宽屏设备宽高比,它变得越来越常见,16:8 或 2:1 宽高比也是如此,自 2013 年以来,2160×1080 屏幕已在市场上出现。
还有 16:10 伪高清分辨率,1280×800 像素。其实这是常见的笔记本电脑,笔记本,上网本,中型平板分辨率。在某个时候看到 16:8 的 1280×640 屏幕,我不会感到惊讶。
一般来说,内容开发者试图将视频内容分辨率与他们的视频资源将被观看的每个 Android 设备的分辨率(以及纵横比)相匹配。
类似地,制造商试图使显示屏分辨率与流行的内容分辨率相匹配。蓝光是 1280×720,因此有许多 1280×720 屏幕和 2560×1440 屏幕尺寸(对于蓝光内容中的每个像素,每个轴上 1280×720 的两倍可以完美地放大到 4 像素(2x2)矩阵。
数字视频存储:专属与流媒体
无论您为数字视频内容选择何种分辨率,Android Studio 应用都可以通过几种不同的方式访问视频。我做这件事的方式,因为我是一个数据优化狂,是一个应用的俘虏。这意味着数据在 Android 应用的 APK 文件中,在/ res/raw/ raw
数据资源文件夹中。
另一种在你的 Android 应用中访问视频的方法是使用远程视频数据服务器。在这种情况下,当视频实时播放时,视频通过互联网从远程服务器流式传输到用户的 Android 设备。让我们希望你的视频服务器不会崩溃,这是流媒体视频相对于捕获视频的缺点之一。
视频流本质上比播放受控数字视频更复杂。这是因为 Android 设备正在与远程数据服务器实时通信,接收视频数据包,在视频播放时解码数据包,然后将帧写入 Android 硬件显示器。Android 4 和更高版本的设备使用 WebM 格式通过 WebM 支持视频流,或者在所有 Android 操作系统版本上使用 MPEG-4 支持视频流。
数字视频压缩:比特率和回放
你需要学习的另一个重要的数字视频概念是比特率。比特率是视频压缩过程中使用的一个关键设置,您将在第七章中使用 Sorenson Squeeze Pro 10 时看到。比特率代表目标带宽或数据管道大小,它能够容纳每秒钟流过它的一定数量的数据比特。比特率还需要考虑任何给定 Android 手机的 CPU 处理能力,这使得视频数据优化对 Android Studio 应用的播放质量更加重要。
这是因为一旦比特通过数据管道,它们也需要被处理,然后显示在设备屏幕上。事实上,Android APK 文件中包含的专属视频资源只需要对处理能力进行优化。这样做的原因是,如果您使用的是强制视频文件,则没有视频资源通过的数据管道,因此没有数据传输开销。因此,数字视频素材的比特率不仅需要针对数据带宽进行优化,还需要考虑 CPU 能力的变化。
一般来说,视频数据文件越小,数据通过数据管道传输的速度就越快,使用编解码器和 CPU 解码数据就越容易,Android APK 文件也就越小。
智能手表等设备中的单核 CPU 可能无法在不“丢弃”帧的情况下解码高分辨率、高比特率的数字视频素材。这是一个播放质量问题,因此如果您打算使用较旧(或较便宜)的设备,请确保彻底优化较低比特率的视频素材。
数字视频优化:编码软件
我将在本章的最后一部分介绍数字视频优化理论,这样您就可以在第七章中专注于工作流程和软件。您的数字视频编解码器的解码器端总是针对速度进行优化,因为回放的平滑度是关键问题;编码器端经过优化,可减少其生成的数字视频素材的数据占用量。因此,编码过程可能需要很长时间,这取决于工作站包含多少个处理核心。大多数视频内容制作工作站应该支持八个、十二个或十六个处理器内核,以便编码速度更快,特效渲染速度更快。
编码器端的编解码器在某种意义上类似于插件,它们可以被安装到不同的数字视频编辑软件包中,以编码不同的数字视频素材文件格式。由于 Android 操作系统支持视频的 H.263、H.264 和 H.265 MPEG-4 格式以及 ON2 VP8 和 VP8 WebM 格式,因此您需要确保您使用的是将视频数据编码为数字视频文件格式的编解码器之一。
不止一个软件制造商生产 MPEG4 编码软件,所以就编码速度和文件大小而言,有产生不同(更好或更差)结果的 MPEG 编解码器编码器软件。
如果您希望对数字视频素材进行编码,我推荐 Sorenson Media 的专业编码解决方案 Sorenson Squeeze Pro,它目前是第 10 版。
Squeeze 有专业级版本,我在本书中会用到;它的价格约为 1000 美元,但如果你考虑它的功能,它的价值超过了建议的标价。也有更便宜的软件版本。
还有一个开源解决方案叫做 Editshare Lightworks 12.5,但是免费版目前不支持使用 MPEG-4 AVC 和 WebM VP8 或 VP9 编解码器的输出;虽然 WebM 编码解码器是开源的,所以这种支持可能会增加。所以我得用 Sorenson Squeeze Pro 10 来出书。(或许 Editshare Lightworks 12.5,或者更高版本会加入对 Android Studio 和 HTML5 的编解码器支持。访问 Lightworks 论坛——用户要求在 Lightworks 中添加 WebM 支持。
数字视频优化:编码器设置
使用编码器设置优化数字视频素材文件大小时,有许多重要设置会直接影响数据占用空间。我将按照它们影响文件大小的顺序来讨论这些问题,从影响最大到影响最小,这样您就知道应该“调整”或调整哪些参数来获得您想要的结果。与数字图像压缩一样,视频每帧的分辨率或像素数是开始数据优化过程的最佳位置。如果您的目标是 1280×720 的智能手机或平板电脑,您不需要使用 1920×1080 的分辨率来从您的数字视频素材中获得出色的视觉效果。
使用目前在 Android 市场上常见的高密度,也称为“精细点距”显示器(Android 的 HDPI、XHDPI、XXHDPI 和 XXXHDPI),您可以将 1280 视频放大 33%,看起来相当不错。Android TV 上的 iTV 应用是一个例外,由于 55 到 95 英寸的大屏幕尺寸,它的 MDPI 点距中等。如果您正在为 iTV 电视机开发应用,您希望使用 1920×1080 的“真高清”分辨率,以便您的内容触及每个像素。这可以扩大到 3840×2160,以支持 UHD 的良好效果。
下一个优化级别是每秒视频使用的帧数(FPS)。这是假设视频本身包含的实际秒数不能通过编辑来缩短。这被称为帧速率;因此,考虑使用 24 FPS 的电影标准帧速率或 20 FPS 的多媒体标准帧速率,而不是设置 30 FPS 的视频标准帧速率。根据您的内容,您可以使用较低的 15 FPS 帧速率。
请注意,15 FPS 是 30 FPS 的一半,也就是说进入编码器的数据减少了 100%。对于某些视频内容,这与 30 FPS 的内容播放效果相同。在 FPS 开始影响您的视频播放质量之前,测试您可以获得多低的 FPS 的唯一可靠方法是在您的数字视频(编码器)内容优化工作过程中,使用不同的帧速率设置来设置、编码和查看结果。
为了获得更小的数据占用空间,下一个需要调整或试验的最佳设置是编解码器的比特率。比特率设置等同于应用的压缩量,从而设置视频数据的视觉质量。值得注意的是,您可以简单地使用 30 FPS、HD 1920×1080 视频,并指定低比特率上限。但是,如果您这样做,结果看起来不会像您第一次使用较高(质量)比特率设置试验较低的帧速率和分辨率那样好。
获得小数据足迹的第二个最有效的设置是关键帧的数量。编解码器使用您的关键帧设置来了解何时对数字视频进行采样。视频编解码器通过查看一帧来应用压缩,然后只对接下来几帧中的变化或偏移进行编码,这样就不必对视频数据流中的每一帧都进行编码。这就是为什么一个正在说话的头部视频比每个像素在每个帧上移动的视频编码得更好,例如具有快速平移或快速缩放的视频。
编码器中的关键帧设置会强制编解码器不时获取视频数据资源的新帧样本。关键帧通常有一个自动设置;这允许编解码器决定要采样的关键帧的数量。还有一个手动设置,允许您指定关键帧采样的频率,通常是每秒特定次数,或视频持续时间内特定次数(总帧数)。
在获得小数据足迹方面,下一个最有效的设置是质量或锐度设置,通常使用滑块来实现。锐度控制压缩前编解码器应用于视频像素的模糊量。如果您想知道这个技巧是如何工作的,以便您可以在自己的数字图像优化工作过程中在 GIMP 中应用它,那么对您的图像或视频应用轻微的模糊(这通常是不可取的)可以实现更好的压缩。其原因是图像中的尖锐过渡(例如颜色之间的尖锐边缘)对于编解码器来说更难以最佳编码;也就是说,它使用较少的数据。更准确地说(没有双关的意思),颜色的急剧或突然过渡比柔和过渡需要更多的数据来再现。我建议将质量或清晰度滑块保持在 85%和 100%的质量设置之间,并尝试使用这里讨论的其他变量来减少数据占用。
最终,您需要微调大量不同的变量,以实现每个特定视频数据素材的最佳数据占用优化。每一个对于编解码器来说都是不同的(数学上),因为每个视频资源可以是不同的像素颜色数据阵列(集合)。因此,不存在可以用来实现任何给定结果的“标准”设置集合。
您调整各种设置的经验可能最终会让您更好地了解需要更改哪些设置才能获得想要的压缩结果。
同样,在第七章中,你会获得一些实际操作的经验。
摘要
在本章中,您了解了压缩和解压缩数字视频素材的数字视频概念、原理和 Android 格式。您了解了分辨率、色深、帧速率、比特率和编解码器设置如何有助于减少数字视频素材数据占用空间。
在下一章中,您将了解如何使用流行的软件包优化数字视频数据占用空间。
七、数字视频素材:数据占用优化
现在,您已经了解了数字视频新媒体内容的基本概念、术语和原则,以及 Android Studio 中支持的两种主要编解码器的数字视频素材优化注意事项,是时候使用流行的软件包 Terragen、VirtualDub 和 Squeeze 从头开始创建、编码和优化数字视频素材了。
由于 3D 渲染的内容更加“有序”,因为它是由算法(数学)而不是随机的 CCD 数据创建的,因此压缩效果会更好。另外,我可以向您展示如何“凭空”创建 2D 视频内容我还可以向您展示一个涉及多个软件包的复杂工作流程,其中大多数都是开源的。如果你愿意,你可以用 Lightworks 代替 Squeeze 来实现 100%开源的工作流。
创建数字视频内容:Terragen
您需要学习如何从头开始创建数字视频内容,以及如何优化其数据占用空间。为此,我将使用 Terragen 3.3,这是 Planetside Software 的一个创造世界的 3D 动画软件包;它不仅是一个令人印象深刻的 3D 软件包,而且是一个专业级别的 3D 制作软件包。幸运的是,有一个免费的版本,以及一个付费的专业版,如果你真的想在你的工具包里拥有所有最好的制作工具,我建议你购买。进入planetside.co.uk
网站,如图 7-1 所示,下载最新版本的 Terragen 3。下载并安装软件后,用快捷图标启动它。在软件的各种渲染启动屏幕中,您会看到“致谢”和“支持”选项卡,如图 7-1 所示。通过查看这些不同的启动屏幕,您可以确切地了解该软件的功能;它们真的很壮观。
图 7-1。
Using Terragen 3.3 to create video (credits screen)
正如你所看到的,这个软件包在经验丰富的用户手中非常好用!接下来,为了让您不必学习 Terragen 的所有复杂内容,请打开一个无缝循环的虚拟世界 3D 摄像机飞越,您可以在名为 loopingOrbit_v03.tgd 的 book assets 文件夹中找到它。
a。tgd 文件是一个 TerraGen 数据格式文件;它包含本地 Terragen 项目。您应该使用 Terragen 的文件➤打开菜单序列来打开您的 Terragen 3.3 软件包中的这些类型的文件。
打开该文件后,您应该会看到 Terragen 3.3 软件包,其中包含用于 3D 世界创建预览的区域,以及用于设置和可视化编程的窗格(如图 7-2 所示)。
图 7-2。
Start Terragen: Use File ➤ Open on loopingOrbit_v03
在渲染对话框的顶部(显示在左侧),设置图像宽度为 480 像素,图像高度为 800 像素。这是比较流行的 Android 硬件设备分辨率之一。WVGA 分辨率有足够的像素来放大或缩小,效果很好。将所有其他渲染设置保留为默认设置。
如果您只想渲染单个帧,可以使用该对话框中间的“渲染图像”按钮,但这不会创建一系列帧,而您需要这些帧来创建运动视频数据。在这个对话框的底部,您会看到七个选项卡,它们控制您的高级设置。
点按标签为“序列/输出”的第七个(最右边的)标签,以设定输出文件规格以及图像序列设置。
在输出图像文件名字段中,输入您的项目文件目录,如图 7-2 所示。截图中可以看到,我的命名为 C:\Terragen3\Project_Files。确保“序列第一个”字段的值设置为 1,然后在“序列最后一个”字段中设置值 400。
将序列步长设置为 1 帧。为渲染设置好所有参数后,单击“渲染序列”按钮,这将指示 Terragen 为您生成 400 帧自定义数字视频飞越。
由于 Terragen 输出带编号的 BMP 文件,而不是 Squeeze 要求的 AVI 格式,因此您需要了解一个名为 VirtualDub 的很酷的软件实用程序。接下来,您将利用 VirtualDub 工作流来生成 AVI 文件,该文件在数字视频行业中被称为“未压缩的全帧”
创建未压缩的 AVIs: VirtualDub
你需要使用的下一个软件包是 VirtualDub,它会将你在 Terragen 中创建的 400 个帧加载到 AVI 文件格式中。然后,您可以导入 AVI 在挤压压缩工作过程。从 www.virtualdub.org
下载安装 VirtualDub,然后启动。您会看到一个空白屏幕(如图 7-3 所示),在这里您可以使用视频➤压缩菜单序列。将结果文件的压缩设置为使用未压缩的 RGB/YCbCr 数据格式。
图 7-3。
Launch VirtualDub and use Video ➤ Compression menu
选择视频➤帧速率、视频➤颜色深度和视频➤选择范围菜单序列,分别将压缩参数设置为 10 FPS、24 位颜色和 0 到 400,如图 7-4 所示的一系列对话框。
图 7-4。
Setting the frame rate, video color depth, and frame range for an uncompressed AVI digital video data file
现在你已经准备好使用文件➤打开文件菜单序列加载 400 个编号的 BMP 帧(如图 7-5 所示)。
图 7-5。
Use File ➤ Open to open the first frame in a 400-frame 3D rendering sequence of numbered BMP files
选择 400 帧 BMP 序列中的第一帧,然后单击打开按钮在 VirtualDub 中打开所有 400 帧。一旦所有 400 帧加载完毕,您将在软件中看到第 0 帧。底部应该有一个 400 帧时长的时间线,如图 7-5 所示。
接下来,使用文件➤保存 AVI 2.0 文件菜单序列打开如图 7-6 所示的对话框。随便你给文件起什么名字(我用的是 intro.avi),然后用保存按钮把 avi 文件保存到你的硬盘上(我创建了一个 AVIs 文件夹)。
图 7-6。
Use the File ➤ Save AVI 2.0 File dialog to save an uncompressed AVI file in a Terragen3/Project_Files/AVIs folder
单击保存按钮后,您会看到 AVI 建筑处理开始。我称之为“构建”过程,而不是压缩过程,因为您创建的 AVI 是全帧未压缩数字视频文件格式;因此,没有压缩,只是简单地将编号的 BMP 文件放置在看起来像是要压缩的数字视频文件格式中,所以它导入这些数据进行压缩。
当帧缓冲被写入(非压缩)到 AVI 文件容器时,在 VirtualDub 中显示实时进度对话框(见图 7-7 )。
图 7-7。
VirtualDub loads 400 frames into a full-frames uncompressed AVI format while showing the build progress
使用未压缩的 AVI 文件有两个原因。首先,这是一种 Sorenson Squeeze 能够阅读的格式。Squeeze 目前不支持读取编号文件,这肯定会让 3D 动画师们难以置信地挠头。
更重要的是,您希望为您的编解码器提供未压缩(原始)的原始数据,以便获得最佳的视觉质量与文件大小的折衷结果。
现在,您已经有了 400 帧 Squeeze 可以导入的 AVI 格式的数字视频数据,您可以启动 Squeeze 并继续您的数据足迹优化工作流程。
应用视频压缩:挤压
您将使用 Sorenson Squeeze 10 来压缩我们的数字视频素材。我使用 Terragen 和 VirtualDub 的原因之一是为了创建完全未压缩的源视频,它没有任何压缩伪像。如果您想通过使用摄像机获得接近相同的原始数据,您可以使用 FireWire,将全帧未压缩(原始)视频数据采集到您的硬盘驱动器,而不是使用摄像机上的 MPEG 或 M-JPEG 压缩。
安装 Squeeze 并启动它。接下来,点击右上角的导入文件图标(参见图 7-8 )。请注意,Squeeze 软件留下了用于保存编解码器、滤镜和发布选项的面板、顶部预览区域和底部时间线区域(您很快就会用到),以便将 MPEG-4 编解码器预设(或者 WebM 预设,如果您想要使用该格式)应用到 intro.avi。
图 7-8。
Launch Squeeze and click the Import File icon
点按导入文件图标后,您会看到“选择一个或多个要打开的源媒体文件”对话框,该对话框使用文件夹名称作为对话框标题;在这种情况下,这是 AVIs,如截图顶部的图 7-9 所示。
图 7-9。
The Import File dialog showing the intro.avi file
如果找不到该文件,请导航到 Terragen3 Project_Files 子文件夹,然后导航到 AVIs 子文件夹。单击您的 AVI 简介文件将其选中,然后单击选择文件图标,在图 7-9 的左上角会看到一个内部带有红色复选标记的文档图标。这会将一个未压缩的 AVI 文件加载到 Sorenson Squeeze 中,以优化数据占用空间。
如图 7-10 所示,在左侧,视频数据加载到 Squeeze 中,并在软件的底部区域显示该 intro.avi 文件,您可以在创建编解码器预设后应用它们,这是您接下来要做的。
图 7-10。
Squeeze showing AVI file loaded and codecs (left); right-click an MPEG-4 codec and click Edit (right)
点按 MPEG-4 编解码器旁边的向右箭头,以打开 MPEG-4 编解码器子菜单。右键点击 Sorenson Squeeze 自带的 768Kbps_360p 预置。
选择“编辑”菜单选项,以便您可以编辑预设。编辑现有预置,为它们指定唯一的名称,并将它们存储为您自己的自定预置,这是一种创建您自己的数据压缩设置文件的简单方法,可用于您接下来将创建的 480×800 intro.mp4 文件。
该编辑上下文相关(右击)菜单选项打开预设对话框,如图 7-11 所示。你可以使用这个对话框来设置不同的压缩选项,这你在第六章中已经了解过了。
首先,让我们将预设命名为 FlyOver_480x800p,并在对话框顶部输入描述,480 像素宽 800 像素高的 3D Planet Fly Over Video。
请确保您的流类型设置为非流,因为视频将位于 Android Studio 应用文件夹中。格式约束应设置为无。
通过选择,然后使用编解码器下拉菜单,选择 MainConcept H.264 MPEG-4 编码器。使用“方法”下拉菜单,选择多通道压缩算法方法。
多次通过无疑会花费最长时间来压缩您的数字视频内容;但是,使用此设置还会产生使用此编码器算法可能得到的最佳压缩质量比结果。
图 7-11。
Showing MPEG-4 codec settings for 3D fly-over at 480x800 and 1000Kbps
将“帧速率”下拉列表保留为 1:1,以便每个帧都包含在目标数字视频资源中,然后将目标数据速率设置为 1000 Kbps。
选中“限制最大日期比率”复选框。将最大数据速率设定为 150%,这样您的比特率上限为 1500 Kbps。
在“预设”对话框的右侧,通过选择“与源相同”选项,设置帧大小以匹配源 AVI 分辨率 480×800。
在对话框右下角的“关键帧”区域,将“关键帧间隔”下拉列表设置为 40 秒,因为这是在 VirtualDub 中以 10 FPS 压缩的 400 帧视频的持续时间。这产生了 40 秒的持续时间。
此外,请确保选择“场景变化时自动关键帧”选项。这允许 MainConcept 编解码器确定何时获取新的数据样本;也就是您的数字视频帧数据的关键帧。由于视频编解码器会查看帧之间的“增量”,即哪些像素从一帧移动到了下一帧,因此对新的关键帧数据进行采样可以提高质量。但它也可能会增加您的数据足迹,因为帧图像数据被存储,以便随后的帧可以被重新创建。
选择“自动关键帧”选项的原因是允许 MainConcept 编解码器从算法上决定在压缩过程中获取关键帧样本的最佳数量。当一切设置正确时,单击 OK 按钮。
正如你在图 7-12 的底部所看到的,这个预置已经被添加到你的源 intro.avi 的下面。现在你可以右键单击图 7-12 左侧显示的预置,并从上下文菜单中选择应用预置选项,这将这个压缩预置添加到你的挤压项目。
图 7-12。
Right-click and Apply Preset (left), showing applied preset (center), Ready to Compress message (right)
一旦你将预置应用到你的 intro.avi 文件,如图 7-12 所示,你就可以点击挤压它!按钮,并使用您刚才设计的编解码器预设创建 MPEG-4 文件。文件名包括源文件名和编解码器预设名称。这是为了如果你改变预设设置,你一定会得到不同的结果文件名。
像使用 PCM WAV 文件作为基线一样使用未压缩的 AVI 文件;用同样的数学方法计算数据占用空间减少的百分比。
请务必查看视频回放中的质量水平,然后调整这些编解码器设置,如比特率、关键帧样本和帧速率,直到您的视觉质量由于运动像素伪像的引入而开始明显下降。
这是您工作流程中最大限度减少(优化)数字视频素材数据占用空间的点。您的 Android Studio 应用需要的任何进一步的降低都必须通过降低源 AVI 文件的分辨率来实现。
摘要
在本章中,您了解了使用几个流行软件包优化数字视频数据占用空间的工作流程,包括 Planetside 软件 Terragen 3.3、VirtualDub 1.9.11 和 Sorenson Squeeze Pro Desktop 10。
你用 Terragen 3 创建了一个 3D 虚拟世界飞越,然后用 VirtualDub 创建了一个源 AVI,再用专业的 Sorenson Squeeze Pro Desktop 10 软件创建了一个可以在 Android Studio 中使用的 MPEG-4 H.264 AVC 文件。
您了解了如何使用“编解码器预设”对话框设置源视频分辨率、关键帧、纵横比、帧速率、比特率和自动关键帧设置,以及它们如何有助于减少数字视频素材数据占用空间。
在下一章,你将会学到更多关于使用流行软件包的数字插图概念和术语。
八、数字插图:概念和术语
现在,您已经了解了 Android Studio 的数字图像、数字音频和数字视频新媒体内容的基本概念、术语、原则和数据占用优化,是时候进入 2D 和 3D 矢量新媒体领域了。Android Studio 只支持一种开源的 2D 矢量格式,称为 SVG,或可伸缩矢量图形,所以这很容易。在本章中,您可以将重点放在概念和术语上,然后在下一章中创建和优化可缩放矢量图形素材。在第十章中,你可以通过观看 3D 矢量图像将 2D 矢量图像带入第三维空间。
在本章中,您将了解如何创建数字插图,使用 2D 空间中的点、连接这些点的直线和曲线来创建形状,以及这些 2D 矢量形状中的颜色填充、渐变和图案。您还将看到 Android Studio 以及其他开放平台(如 Java 和 HTML5)支持的开源数字插图 SVG 数据文件格式。
数字插图是渲染的,而不是存储的
正如您在第二章中了解到的,基于像素的数字影像在技术上被称为光栅影像,因为像素值的阵列被光栅化到屏幕上,显示使用这些像素创建的图像。数字插图或矢量图像不是作为图像元素(像素)的数组存储的;相反,它被绘制或“渲染”到屏幕上,就像有人看着你画时你会画一样,只是计算机使用指令来做你创建它时所做的事情。这相当于你在第四章第四章中学到的 MIDI 概念,其中演奏(在这种情况下,它是在作曲)是由计算机处理器重新创建的,它使用回放指令将其呈现到屏幕(SVG)或合成器(MIDI)上。
对于矢量图像,这是通过 2D X,Y 空间中的坐标以及定义曲线的数学来完成的,并使用看起来很像代码的 SVG 指令来传达。然而,你首先需要学习矢量插图的基本结构,这样你才能理解它们是如何结合在一起的。之后,您将看到 SVG 格式如何通过使用 Java 或 JavaFX SVG 兼容的类将这些转换成可以在 Android Studio 中处理的指令。HTML5 设备也可以处理 SVG。
向量组件:顶点和曲线
数字插图矢量图像由使用 2D 空间坐标的点以及将这些点连接在一起的直线或曲线组成。在本节中,您将了解这些点和线的概念和术语。如果您创建一个“封闭”的形状,即没有开口的形状,以便填充(颜色、图案或渐变)逸出,您也可以填充矢量形状,这样形状看起来是实心的,而不是空的。
顶点:2D 形状的基础
任何 2D 或 3D 矢量资源的基础称为顶点。需要多个顶点来创建直线或圆弧(需要两个顶点)或闭合形状(至少需要三个顶点)。顶点既用于 2D 矢量(SVG)数据处理,也用于 3D 矢量(OpenGL ES)数据处理,这两者都集成到 Android Studio 中。
正如您可能已经猜到的那样,顶点数据在 SVG 中是用 X,Y 坐标表示的,这告诉处理器顶点在 2D 空间中的位置。如果没有这些顶点坐标,就无法绘制直线和曲线,因为作为直线绘制操作的一部分,它们必须有一个原点和一个目标顶点坐标。直线和圆弧是开放形状的示例。
当您开始创建和查看 SVG 数据时,您会注意到这些 X,Y 数字对是 SVG 数据的主要部分,它们可以使用 XML 格式包含,或者包含在 Android Studio 应用的 Java SVG 对象中。SVG 数据也可以在您的 JavaScript (HTML5)代码中使用,也可以在 JavaFX (Java 8 或 Java 9)代码中使用,因此它可以兼容您的每个开放平台应用开发工作流。
一个单独的 X,Y 坐标叫做一维坐标,或 1D。(确保不要在你的配偶周围使用这个词,如果你这样做,确保它指的是你配偶以外的东西。)需要两个顶点坐标才能被认为是二维的,或 2D;所以一条线或一条曲线(开放的形状),或一个封闭的形状是一个 2D 对象。
路径:连接顶点以创建形状
路径是在 SVG 中使用“path”数据元素定义的。根据 SVG 规范,开放形状和封闭形状在技术上都是路径。SVG 路径表示开放或闭合形状的轮廓,可以填充或描边,也可以用作剪辑路径。本章将详细介绍这些概念,但填充处理路径的内部,描边处理构成路径的直线或曲线,而裁剪路径用于布尔运算。
在 SVG 数据中,SVG 路径对象表示用于描绘路径对象轮廓的 2D“几何图形”。事实上,在 JavaFX 中,该类实际上被称为 SVGPath 类。SVG 路径数据可以用 SVG 命令来定义,我将在本章后面使用表 8-1 对其进行概述。其中包括一个 moveto 命令,用于设置当前点;lineto 命令,绘制直线;curveto 命令,用于绘制三次贝塞尔曲线;椭圆弧命令,用于绘制椭圆弧;以及 closepath 命令,它关闭当前形状,在其起点绘制一条线。还有一些高级的 SVG 命令。
表 8-1。
SVG Commands to Use for Creating SVG Path Data
| SVG 命令 | 标志 | 类型 | 参数 | 描述 | | --- | --- | --- | --- | --- | | 动起来了 | M | 绝对的 | x,Y | 使用绝对坐标在 X,Y 处定义路径的起点 | | 动起来了 | M | 亲戚 | x,Y | 使用相对坐标在 X,Y 处定义路径的起点 | | 帕尔帕思 | Z | 绝对的 | 没有人 | 通过从最后一个点到第一个点绘制一条线来闭合 SVG 路径 | | 帕尔帕思 | Z | 亲戚 | 没有人 | 通过从最后一个点到第一个点绘制一条线来闭合 SVG 路径 | | 利托 | L | 绝对的 | x,Y | 从当前点到下一点画一条线 | | 利托 | L | 亲戚 | x,Y | 从当前点到下一点画一条线 | | 水平直线 | H | 绝对的 | X | 从当前点到下一点画一条水平线 | | 水平直线 | H | 亲戚 | X | 从当前点到下一点画一条水平线 | | 垂直线条 | V | 绝对的 | Y | 从当前点到下一点画一条垂直线 | | 垂直线条 | V | 亲戚 | Y | 从当前点到下一点画一条垂直线 | | 弯曲的 | C | 绝对的 | X,Y,X,Y,X | 从当前点到下一点绘制一条三次贝塞尔曲线 | | 弯曲的 | C | 亲戚 | X,Y,X,Y,X | 从当前点到下一点绘制一条三次贝塞尔曲线 | | 短而平滑的曲线 | S | 绝对的 | X,Y,X,Y | 从当前点到下一点绘制一条三次贝塞尔曲线 | | 短而平滑的曲线 | S | 亲戚 | X,Y,X,Y | 从当前点到下一点绘制一条三次贝塞尔曲线 | | 二次贝塞尔曲线 | Q | 绝对的 | X,Y,X,Y | 绘制二次贝塞尔曲线(当前点到下一点) | | 二次贝塞尔曲线 | Q | 亲戚 | X,Y,X,Y | 绘制二次贝塞尔曲线(当前点到下一点) | | 短二次贝塞尔曲线 | T | 绝对的 | x,Y | 绘制一个短的二次贝塞尔曲线(当前点到下一点) | | 短二次贝塞尔曲线 | T | 亲戚 | x,Y | 绘制一个短的二次贝塞尔曲线(当前点到下一点) | | 椭圆弧 | A | 绝对的 | rX,rY,红色 | 从当前点到下一点绘制椭圆弧 | | 椭圆弧 | A | 亲戚 | rX,rY,红色 | 从当前点到下一点绘制椭圆弧 |复合路径在 SVG 中也是可能的;这些允许你创建复杂的,布尔型的特殊效果。例如,您可以使用复合路径在形状中创建一个洞。
线条:最简单的路径组件
沿着路径连接点坐标的最简单方法是使用直线。使用 lineto 命令可以创建不同的形状,如三角形、正方形、五边形和六边形。有三个 lineto 命令:一个 lineto、一个水平 lineto 和一个垂直 lineto,如表 8-1 所示。
要使用 SVG 对八边形进行编码,可以从 60,0 处的点(顶点)使用 moveto (M)命令,然后使用 lineto (L)命令绘制七条线。这看起来像下面这样:
M 60 0``L``120 0``L``180 60``L``180 120``L``120 180``L``60 180``L``0 120``L``0 60
接下来让我们看看椭圆弧,它本质上是一条简单的曲线,其 SVG 命令有一组复杂的规范数据,这就是为什么我通常从建模的角度坚持使用曲线,正如你将在第九章中看到的。
椭圆弧:圆弧和椭圆弧
三种曲线命令中的最后一种是椭圆弧,它使用大写 A(绝对弧)或小写 A(相对弧)。arc 命令绘制椭圆的一段。它采用这些曲线绘制相关命令中最大数量的参数,并使用以下基本格式:
M``x,y``A rx,ry x-axis-rotation large-arc-flag sweep-flag
这里,M
(moveto) x,y
是圆弧的起点;rx
是椭圆的 x 半径;ry
是椭圆的 y 轴半径;x-axis-rotation
是旋转 x 轴的度数,一个大/小弧的两个开/关标志,一个扫弧/无扫弧;而最后的x,y
坐标就是圆弧的终点。
值得注意的是,将 x 和 y 半径(rx
和ry
值)设置为相同的值会创建一个圆而不是一个椭圆,因为这使得曲率对称。
椭圆弧有许多参数,包括一个坐标对、所描述的椭圆大小、一个角度和两个改变渲染的标志。此示例还允许您修改弧坐标相对于起点(由红色斑点定义)是绝对坐标(A)还是相对坐标(A)。图 8-1 显示了一个椭圆弧命令和坐标序列的例子。如果您希望此椭圆的缺失部分位于底部,请取消选择(或设置为零)大圆弧标志和扫描标志,这将绘制较小部分的圆弧,并将其镜像到 x 轴周围。该命令如下所示:
图 8-1。
Elliptical arc with Sweep and Large Arc Flags on
M 125,300 A 225,100 0 1 1 375,300
正如你所看到的,rx,ry 参数创建了不同的角度,这扭曲了圆形的形状,使其成为椭圆形。如果您想试验这些参数,互联网上有许多 SVG 曲线生成器。
三次贝塞尔曲线
如果你曾经在 Photoshop 或 GIMP 中使用过钢笔工具,或者在第九章中使用过 Inkscape,或者其他 3D 建模工具,那么你可能对贝塞尔曲线很熟悉。我不打算深入研究如何以数学方式构建曲线背后的所有数学知识,因为这是一本基础书籍,而不是高级书籍,但是您将了解如何使用开源工具来生成您的 Android Studio 应用所需的数字插图矢量素材。简而言之,您可以使用 SVG 命令通过定义起点和终点以及两个控制点来绘制三次贝塞尔曲线:一个控制点用于起点,一个控制点用于终点。这些控制曲线的曲率,在行业中也称为样条,从第一个点离开,进入第二个点。
三次贝塞尔曲线命令使用以下格式:
M x,y C (or c)``x1,y1 x2,y2
起点由 moveto M x,y
定义,C (or c)
定义绝对或相对三次贝塞尔曲线类型。x1,y1
是曲线起点的控制点,x2,y2
是曲线终点的控制点。最后,命令字符串末尾的x,y
坐标是三次贝塞尔曲线的终点。在下一章中,你将看到如何用 Inkscape 实时创建贝塞尔曲线。
二次贝塞尔曲线
人们倾向于认为二次贝塞尔曲线更复杂,因为“四边形”意味着四个,因此这种类型的曲线有更多的控制点。然而,实际情况正好相反,因为二次贝塞尔曲线实际上只有一个控制点连接到曲线段的起点和终点,移动它可以控制曲线在两点之间的形状。因此,如果你正在寻找 100%的坐标数据减少,只要控制点规格去,使用二次贝塞尔曲线。因此,二次贝塞尔曲线的 SVG 命令规范如下所示:
M x,y Q (or q)``x1,y1
因此,二次贝塞尔命令只需要一个控制点,然后用作起点和终点的控制点。因此,这就像三次贝塞尔曲线中的两个控制点连接成一个控制点,同时将曲率从起点移动到终点。如果您想试验这些参数,网上有许多 SVG 曲线生成器。
填充:用颜色填充封闭的形状
一旦使用直线、圆弧和曲线定义了形状,您就可以填充它,使它成为实心的,而不是空心的。填充可以是颜色、渐变或平铺图像图案。如果愿意,您可以填充一个开放的形状,连接起点和终点的(假想)线定义了填充边界,因此填充不会遍布您的数字插图中的所有地方!填充操作和描边操作(接下来将介绍)称为绘制操作。这是在 Android Studio 中使用 Paint 和 Canvas 类定义的。
颜色填充:用纯色值填充形状
为了填充您在前面的线条部分看到的八边形,将在数据语句后添加一个fill="green"
语句,这将创建用绿色填充的形状。使用 SVG XML,这两个声明将位于 path XML 标记内,使用以下 XML 标记 SVG 数据结构:
<path>
d = "M 60 0 L 120 0 L 180 60 L 180 120 L 120 180 L 60 180 L 0 120 L 0 60"
fill = "green"
</path>
然而,纯色填充不如渐变有用,因为小心使用渐变甚至可以模拟使用 2D SVG 图形的 3D 效果。定义渐变更复杂,所以,接下来让我们看看线性和圆形渐变。
渐变填充:线性渐变和径向渐变
在 SVG 中有两种类型的梯度,线性梯度和径向梯度。线性渐变是你会遇到的最常见的渐变类型,所以让我们先从那种类型开始。适用于如何设置线性渐变的大部分内容也适用于径向渐变,径向渐变只是使用了不同的 XML 标记。我将向你展示如何在 XML 中使用 SVG 设置一个<linearGradient>
标签,你可以简单地在以后把它改成一个<radialGradient>
来改变你的渐变类型。
渐变是在 SVG XML 的<defs>
或“定义”标签中定义的。<defs>
标签放在“父标签”<svg>
标签中,并将<linearGradient>
标签作为它的“子标签”。在<linearGradient>
标签中有两个<stop>
子标签。色标用于定义渐变中的颜色、它们在整个渐变中所占的百分比以及渐变部分的 alpha 或透明度值。至少要有两站。您可以根据需要使用任意数量的渐变段。
确保你的止损补偿值最终达到 100%。这是你如何用红色和黄色的线性渐变填充你的八角形;如您所见,这要复杂得多:
<
svg
xmlns='
http://www.w3.org/2000/svg
' height="300" width="300">
<``defs
<``linearGradient``id="``LinearGradient
<``stop
<``stop
</linearGradient>
</defs>
<path>
d="M 60 0 L 120 0 L 180 60 L 180 120 L 120 180 L 60 180 L 0 120 L 0 60"
fill="url(#``LinearGradient
</path>
</svg>
使用<linearGradient>
标签内的id="name"
参数将渐变连接到填充中,然后在<path>
标签内的fill="url(#name)"
参数中引用该名称。
图案填充:用可平铺的图像图案填充形状
SVG XML 中的<defs>
标记中也定义了模式。标签<pattern>
放在父标签<defs>
的内部,并将标签<image>
作为子标签。在<image>
标签中是对图像素材的引用和规范。图案是用 2D 纹理贴图填充形状的无缝图像拼贴。你将在第十章学到更多关于纹理贴图的知识。
确保图案的宽度和高度值与图像的宽度和高度值相匹配。图像 X 和 Y 将图案的起点定位在左上角,该位置始终为 0,0。下面是你如何用 8 像素的平铺图像模式填充一个八边形;正如你将看到的,这是一个比梯度更复杂的定义:
<svg xmlns='
http://www.w3.org/2000/svg
<defs>
<pattern id="``pName``" patternUnits="userSpaceOnUse" width="``8``" height="``8
<image xlink:href="data:image/filename.png"
x="0" y="0" width="``8``" height="``8
</image>
</pattern>
</defs>
<path>
d="M 60 0 L 120 0 L 180 60 L 180 120 L 120 180 L 60 180 L 0 120 L 0 60"
fill="url(#``pName
</path>
</svg>
虽然我向您展示如何做到这一点,因为这本书是针对 Android Studio 程序员或开发人员的,但我们大多数人都使用 Inkscape 或 Illustrator 等软件包来创建矢量插图并将其导出为 SVG 格式。
然而,在一天工作结束时,您需要知道如何将 SVG 命令结构与 Java 代码联系起来。我将在这一章中讲述基本的 SVG 命令,以便您了解 Android Studio 应用开发的 SVG 基础知识。
描边:控制线条和曲线的外观
最后,让我们看看如何对使用这些 SVG 命令创建的线条、弧线和曲线进行描边(或着色)和样式化(或加粗)。描边参数可让您使用圆形、方形或斜角常量来定义描边颜色、不透明度、像素宽度、虚线阵列图案以及线条如何被覆盖或连接在一起。让我们将这些与笔画相关的参数添加到您之前为八边形创建的<path>
中,并使用以下 SVG XML 标记为其提供 3 像素厚的黑色边框,圆角、虚线和 50%的不透明度:
<path>
d = "M 60 0 L 120 0 L 180 60 L 180 120 L 120 180 L 60 180 L 0 120 L 0 60"
fill = "green"
stroke = "black" stroke-width = "3" stroke-dasharray = "5, 10, 5"
stroke-linecap = "square" stroke-linejoin = "round" stroke-opacity = "0.5"
</path>
接下来,让我们通过查看您将在 Android Studio 编码以及 CSS3 和 JavaFX 编程中使用的主要 SVG 数据命令来结束。
SVG 格式:编码矢量形状数据
SVG 数据字符串中的数字(X,Y 数据点坐标位置)数据可以使用十种不同的字母。每个都有大写(绝对引用)和小写(相对引用)版本。正如您在表 8-1 中看到的,SVG 数据命令为您在 Android Studio 应用开发中定义自定义曲线提供了极大的灵活性。您甚至可以将所有这些 SVG 命令与 Java 代码结合起来,创建前所未有的交互式矢量(数字插图)作品。由于这是一个 Android Studio 新媒体基础知识的标题,您将在本书的大部分内容中关注新媒体素材的创建过程,而不是像大多数其他书籍一样关注应用编码。
了解如何使用这些强大的 SVG 数据路径绘制命令的最佳方法是学习使用矢量插图工具创建 SVG 数据的工作流程和导出工作流。您将学习如何在 Inkscape 中做到这一点,使用“快速和肮脏”的方法;也就是说,让 Inkscape 完成 90%的路径创建工作,然后将命令数据字符串剪切并粘贴到 Java 代码中。
如果您是一名游戏程序员,您还可以将这些路径数据构造用作碰撞检测多边形,并用于与边界相关的矢量数据的类似非图形用途,而不是视觉 2D 渲染的数字插图。如果你感兴趣,我在 Java 8 游戏开发入门(Apress,2015)中介绍了使用 JavaFX 的 SVGPath 类来完成这项工作的工作流程。
摘要
在本章中,您了解了数字插图,也称为 2D 矢量插图,以及它的相关概念、原理和 Android Studio 支持的 SVG 格式,以及使用 CSS3 和 JavaScript 的 JavaFX 和 HTML5。您了解了顶点或点坐标、直线、弧线、曲线、填充、图案、渐变和路径描边如何影响数字插图素材的创建过程。
在下一章中,您将学习使用 Inkscape 创建数字插图素材和优化数据占用空间。
九、数字插图:数据足迹优化
现在,您已经了解了有关数字插图的基本概念、术语和原则,是时候了解如何创建 2D 矢量新媒体以及如何优化数据足迹了。
2D 或 3D 矢量素材的真正优化是使用它,因为光栅图像由于在数字图像中存储单个像素元素的大阵列以及在数字视频中存储单个帧而固有地数据繁重。
在本章中,您将了解如何使用流行的开源 Inkscape 软件创建数字插图,这样您就不必用 XML 标记或 Java 代码手动编写 SVG 命令和坐标数据。您还将学习如何使用一个工作流程导出这些命令和坐标数据字符串,该工作流程让 Inkscape 将您的 SVG vector 对象的数据编写为 XML 或 Java 代码。
Inkscape:矢量插图形状数据
由于矢量新媒体素材本身已经过优化,只要您使用尽可能少的顶点来创建 2D 和 3D 素材,并为您的目标使用正确类型的贝塞尔曲线,您就可以专注于如何使用 Inkscape 来创建 2D 矢量素材。在本章中,您还将学习如何使用导出函数将这些数据转换成可以在 Android Studio、JavaFX 和 HTML5 中使用的命令数据和 XML 标记。
对于矢量图像,这是通过 2D X,Y 空间中的坐标以及使用 SVG 指令定义曲线的数学来完成的,这看起来很像代码。让我们来看看矢量插图的基本结构。
布局:Inkscape 中关键区域的概述
Inkscape 用户界面非常复杂,因为该软件为您提供了 2D 矢量新媒体素材创建工作流程所需的几乎所有东西。简而言之,有三个垂直工具栏:左侧的主要功能工具,最右侧的吸附设置,以及右侧工具栏内侧的命令工具(见图 9-1 )。画布右侧还有浮动调色板停靠区,这是占据你 UI 大部分的白色区域。最上面是菜单,下面是包含所选工具选项的水平工具栏;在图 9-1 中,这是按节点编辑路径工具,如左侧弹出工具提示所示。(我在这张截图中特别提到它,因为它是一个工具,您将使用它为您的 Android Studio 游戏和应用创建复杂的样条数据。)在用户界面的底部是一个用于形状填充和曲线描边的色样选择器,下面是一个状态栏,以数字形式显示您正在进行的操作和其他重要的工作流程设置。UI 中间的方块是您正在处理的页面。
图 9-1。
Inkscape tools, floating palettes, option selectors
让我们开始学习如何在 Inkscape 中使用形状创建工具,以及如何导出 XML path 命令数据。
多边形形状:创建基本闭合形状
多边形形状,在第十章中有进一步的介绍,是周边有直线的形状,如三角形、正方形、五边形、六边形和八边形。让我们使用 Inkscape 多边形工具来创建你在第九章中用 SVG 命令创建的绿色八边形。选择创建星形和多边形工具,如图 9-2 所示。然后选择选项工具栏左上角的多边形选项。将“角”微调器设置为 8,然后单击页面中间并拉出八边形。您可以使用右上方的填充和描边调色板将填充颜色设置为绿色。
图 9-2。
Create a green octagon using the polygon tool
从中心拉出多边形时,可以控制其大小和旋转。我将尺寸与页面的顶部、底部和侧面对齐。
正如你在左下方看到的,描边和填充属性被总结,就像你在其上绘制形状的层一样。对于填充和图层 1,100%的不透明度在屏幕右侧的调色板中显示为灰色,正如您将在将要导出的 SVG 路径数据中看到的那样。接下来让我们看看如何将这个形状转换成 SVG 路径数据。
SVG 数据导出:使用 Inkscape 文件➤另存为
许多开源软件包,如 GIMP 和 Blender,使用文件➤另存为菜单序列来保存它们的原生文件格式,并使用文件➤导出菜单序列来保存不同的数据格式。Inkscape 使用文件➤另存为来保存(导出)成不同的数据格式,如图 9-3 所示。使用 Plain SVG 获取 XML 数据,您可以编辑这些数据并从中提取路径命令数据。
图 9-3。
Use File ➤ Save As menu sequence; select Plain SVG
将文件命名为 octagon.svg,在文本编辑器中打开,如图 9-4 所示。您的路径数据字符串以蓝色显示。
图 9-4。
Open this octagon.svg file in your OS text editor
您可能已经注意到 JavaFX 和 HTML5 导出支持,以及其他平台,如 PostScript 和 Flash,在图 9-3 的另存为对话框中。如果您打算在 Android 或 iOS 中使用 JavaFX,您可以使用这个选项,但是使用 plain SVG 是为您在 Inkscape 中创建的路径提取原始 SVG 命令数据字符串的最佳方式。如果您有一个复杂的多层结构,也可以选择将层作为单独的 SVG,这样您就可以将 SVG 路径命令数据模块化。
样条曲线形状:创建复杂形状
我会让你使用其他基本的形状工具,比如椭圆弧工具和文字工具。在这一章,重点是画多边形和贝塞尔曲线。这些主题也将在下一章中讨论,下一章的重点是 3D 新媒体,所以我将通过一个 2D 矢量软件包让你熟悉它们。此外,您为 Android Studio 应用创建的大部分内容都是由多边形或贝塞尔曲线组成的,因此在 Inkscape 中关注这些形状创建工具是很实际的。
使用绘制贝塞尔曲线工具:绘制你的粗略形状
使用文件➤新建菜单序列在 Inkscape 中启动一个新项目。选择绘制贝塞尔曲线和直线工具。这可以在图 9-5 的屏幕左侧看到,大约在 Inkscape 工具栏的中间位置。我让工具提示可见,这样你可以更容易地看到它。您可以将鼠标悬停在工具和其他用户界面元素上,通过使用这个方便的弹出工具提示功能来查看它们的功能。现在,让我们创建一个复杂的贝塞尔曲线形状,例如一颗心,只用四个数据点来完成(因为本章是关于优化的)。正如我提到的,优化向量的方法是使用更少的数据点,并利用样条张力手柄。
图 9-5。
Click start point, click to right, pull out handles
要在 Inkscape 中创建一个心形,请选择“绘制贝塞尔曲线和直线”工具,并在页面中心从顶部向下大约 25%处单击。Inkscape 中的起点用一个空心的方形点来显示。
单击此起点右侧靠近页面右侧的第二个点。在图 9-5 中,显示了蓝色花键张紧手柄与绿色曲线段(一个)和红色电流曲线段(两个)相遇的地方。
在单击(并拖动)第二个点时,从第二个点拉出样条曲线控制柄,以创建粗略曲线。稍后您将对此进行微调,因此它不必是完美的。一旦放开(释放鼠标以停止拖动控制柄模式),就可以向下移动样条线,朝向心脏的底部。
接下来,单击将成为心形底部点的点,该点应位于起点的正下方,从页面顶部向下大约 60%,或从页面底部向上 40%。
绘制心脏曲线的第三段,直到与第二个点相反或成镜像的点,这次是在起点的左侧。这应该与你的第二个点从页面右侧到页面左边缘的距离相同,如图 9-6 所示。点按起点左侧靠近页面左侧的第三个点。如图 9-6 所示,这是蓝色花键张紧手柄相遇的地方,也是绿色曲线段(三个)和红色电流曲线段(四个)相遇的地方。
图 9-6。
Click bottom point, click to left of start, pull out handles, and then place end point of heart over start point
再次,从第三个点拉出样条线手柄,同时单击并拖动它以创建一条粗略的曲线。一旦放开(释放鼠标以停止拖动控制柄模式),就可以移动第四个曲线段的终点,这次是在心形(路径)的起点上。如果将路径绘制操作的终点放在路径绘制操作的起点上,则共有点会变成红色,如图 9-6 所示。然后你可以点击关闭心脏的路径。
单击起点后,第五个终点和起点成为同一个(起点),因此您仅使用了四个点和四个曲线段来创建优化的闭合心形(路径)。
关闭形状后,绿色和红色线段颜色参考线消失,整个贝塞尔曲线颜色为黑色,厚度为一个像素。请注意,这只是显示您的贝塞尔曲线路径在哪里,因为从数学上来说,路径实际上没有厚度。
正如你在图 9-7 中看到的,心脏的左侧实际上比右侧更好。在本章的下一节中,您将了解如何在 Inkscape 中编辑样条曲线构造。
图 9-7。
Click end point on start point and close the heart’s path
编辑路径是通过不同的 Inkscape 工具完成的,该工具称为“按节点编辑路径”工具。提供它是为了让艺术家可以返回并微调节点(控制点或顶点)手柄,或者让矢量艺术家可以进一步编辑现有的路径。
请注意,有许多不同的术语用于点(控制点),或顶点,或节点,或坐标,它们组成了由贝塞尔曲线组成的路径(形状)。
接下来,让我们使用“按节点编辑路径”工具(Inkscape 中最常用的工具之一)来优化心形并改进其路径形状,正如它在 Inkscape 主工具栏中箭头(选择)工具正下方的位置所示。
使用按节点编辑路径工具:优化心形
“编辑路径工具”(简称)的图标显示一个锐角三角形光标,用于选择要编辑的节点,样条线张力控制柄从节点中伸出。选择此工具后,心形会将贝塞尔曲线线段之间的节点(点或顶点)显示为空心点。该工具在图 9-8 中显示为选中状态(蓝色)。
图 9-8。
Select the Edit Paths tool and click the second node
让我们从选择第二个节点开始,它位于心脏的右侧。单击并选择该节点后,它会变为红色,样条线拉伸控制柄会从该节点出现。这些控制节点每侧两个不同曲线段的曲率。使用手柄末端的圆移动顶部手柄,控制第一条线段进入第二个顶点的曲率。
底部手柄也随手柄末端的圆一起移动,它控制第二条线段从第二个顶点出来的曲率。
正如您在第八章中所学,移动样条控制柄的端点会改变控制柄的角度,并影响曲线的曲率,曲线连接到顶点并由该顶点定义。
如果通过将端点移动到更靠近(或更远离)顶点本身来缩短或延长控制柄,则使用较长的控制柄会使曲线变得更弯曲,而使用较短的样条线拉伸控制柄会使曲线变得不那么弯曲。
如果您将控制点放在顶点的顶部,或者将它们缩回到顶点中,那么它将成为一个角点,从该点出来的曲线将成为一条线(多边形)。
也有不同的键盘修改器可以打开角度捕捉(控制),锁定曲率(交替)或控制柄长度,以及打破顶点或节点的控制柄对称性(偏移)。这是一个工具,你需要练习使用一段时间才能熟练或专业地使用它。也请务必浏览 Inkscape 左上角的“按节点编辑路径”工具选项工具栏。
在这个目前不完善的心脏路径中,你首先需要修复的是球形的右侧。为了修复这个曲率,你需要调整从你的第二个顶点出来的曲线,这是通过使用张紧手柄的下段来完成的,如图 9-8 所示(连同心脏缺损一起);在图 9-9 中显示为红色选中(固定)。
图 9-9。
Adjusting spline tensioning handle for second curve
如果你想了解你正在 Inkscape 中进行的心脏手术,你可以在这本书的资源库中打开你的InkscapeProject_heart.svg
文件。
为了减少心脏右侧曲线的膨胀,将下手柄的端点拉得更近,直到第二条曲线与第三条曲线对称,如图 9-9 所示。
如果你比较图 9-8 和图 9-9 你可以看到,我已经缩短了大约 15%的手柄长度,也减少了弯曲的程度。
使用“按节点编辑路径”工具需要通常所说的“扭曲”,这意味着对顶点及其张力控制柄进行多次轻微调整,以便逐渐优化形状,在本例中,它是一颗心。
现在顶点二的底部(曲线)调整好了,让我们在顶部工作;也就是进入顶点 2 的曲线。
正如你在图 9-9 中看到的,心脏的右上半部分是方形的,需要像左半部分一样更圆一些。
正如你在图 9-10 中所看到的,我已经将样条线张力手柄的顶部缩短了大约 15%,通过减少进入第二个顶点的曲率量,使曲率再次更好地匹配心形的另一侧(左侧)。
图 9-10。
Adjust the top tensioning handle to make the shape rounder
现在心脏的上半部分已经改进了,你现在应该开始调整顶部和底部的中心点,继续进一步优化这个心脏形状。
下拉底部顶点细化心脏高度,如图 9-11 。由于心脏的尖端没有任何圆形曲线(它是尖锐的),这意味着样条线张力控制柄直接位于第三个顶点的顶部。
图 9-11。
Pull down the bottom vertex and center it with top
如果要将心形的底部风格化,按住 Shift 键,拉出顶点的样条线拉伸手柄。我在图 9-13 中展示了这一点,以便你能明白我的意思。
可以下拉顶点,如图 9-12 所示。
图 9-12。
Pull down the top vertex and center it with bottom
在调整过程的这一点上,心脏的形状只是一个味道的问题,所以继续调整四个贝塞尔曲线顶点,直到你得到你想要的结果。
如果您想要样式化位于第三个顶点的心尖,您可以将拉伸手柄拖回锐角之外,如图 9-13 所示,方法是按住 Shift 键盘修改器,单击选定的顶点,并将鼠标拖离选定的(红色)控制点(节点或顶点)。
图 9-13。
Use the Shift key and drag handle out of vertex #3
由于这是一个数据足迹优化章节,我将向您展示如何从您的心脏路径向量定义中删除 47 个字符(大约一半)的 SVG 命令字符串数据。
数据占用优化:使用整数
使用您在本章第一部分中学习的文件➤另存为➤ Plain SVG 工作流程,并将文件命名为 heart_PlainSVG(如图 9-14 屏幕顶部(标题栏)所示)。使用缩进的 XML 约定格式化您的数据(我在这里已经为您完成了),并查看命令数据,它在子标签<path>
内的d=
后面的引号中。
图 9-14。
View the floating point version of your path data
正如您所看到的,坐标数据具有非常精确的浮点精度,这在使用整数值寻址像素的 Android Studio 应用中不一定是准确的。将这些浮点值四舍五入到最接近的整数值,如图 9-15 所示。
图 9-15。
Convert your floating-point data into integer data
这将向量数据占用空间减少了大约 100%。
摘要
在本章中,您了解了数字插图数据占用空间优化以及如何使用 Inkscape 矢量插图软件。您了解了如何创建样条线和多边形,如何导出 SVG 命令数据,以及如何优化在 Android Studio 和 Java 中的使用。
在下一章中,您将学习使用 Blender 创建 3D 素材和优化数据足迹。
十、3D 新媒体:概念和术语
现在,您已经了解了用于 Android Studio 的 2D 数字图像、数字音频、数字视频和矢量数字插图新媒体内容的基本概念、术语、原则和数据占用优化,是时候进入更复杂的 3D 新媒体素材领域了,在 Android Studio 中,3D 新媒体素材可以成为 i3D 或交互式 3D,用于游戏应用、电子学习和模拟的素材。
Android Studio 只支持一个开源、实时、i3D 矢量渲染平台,称为 OpenGL,代表开放图形库。与 SVG 不同,SVG 与 OpenGL 相比相对简单,我无法在仅仅几个章节,甚至几本书中介绍 i3D。
然而,如果你正在用 Android Studio 创建 i3D OpenGL 应用,这完全是一种不同类型的应用。如果你想为 Android 开发 3D 应用,你需要专门研究这方面的书籍,因为与 Android Studio 和 Android OS 中的其他新媒体资源支持相比,3D 是一个完全不同的领域。像 Android 支持的那些新媒体素材一样,Android i3D 支持完全是开源的,所以这当然是个好消息。
在这一章中,我将尽可能多地向您概述 3D,因为它远比您的 2D 新媒体素材更广阔,不仅仅是因为它具有数字视频和数字音频所具有的第三维(深度)或第四维(动画)。主要原因是它用于凭空创建照片级的真实环境,这主要是由主机游戏行业和好莱坞电影业推动的。您可以利用这些 3D 进步!
您将了解 3D 矢量图像、3D 动画、3D 建模、3D 纹理映射、3D 粒子效果、3D 物理模拟、角色动画以及所有类似的复杂的 i3D 相关主题中使用的基本概念、原理和格式。
交互式 3D 资源:3D 矢量内容
交互式 3D 矢量对象可以使用 Android 代码,使用 Java 7 或 JavaFX 类和方法,或使用 3D 软件包,如 Autodesk 3D Studio Max(我使用的就是它),或 Blender,一种接近类似专业功能水平的开源软件。
交互式 3D,通常称为 i3D,矢量资源主要由 3D 空间中的 3D 矢量几何体或顶点组成。这是用 2D 光栅图像表现出来的,你在第二章中学到了,并且用关键帧制作了动画,你在第六章中看到了。要使 3D 具有交互性,需要定义 3D 对象(内部)层次,并为 3D 对象的每个部分嵌入编程逻辑,告诉它如何工作。创建一个静态 3D 或动态 i3D 对象的“层”比你在 Android Studio 的 2D 新媒体区找到的要多得多。
请务必注意,您的所有其他新媒体素材都包含在 i3D 新媒体素材中。这意味着你在前九章所学的一切也是复杂的 3D 模型创建工作过程的一部分,你很快就会看到。数字图像用于 3D 模型几何的皮肤,数字视频提供动画纹理映射,SVG 几何用于或渲染到 3D 表面上以获得纹理映射效果,数字音频用于声音效果或使 i3D 角色说话。可能性是无限的。
让我们从顶点开始向上,就像你在 2D 矢量插图一章中所做的那样。我将向您展示 3D 素材的各种属性,从 3D 几何图形到 3D 模型,到 3D 层次结构,到 3D 动画,再到 i3D 对象。
顶点是最不常用的新媒体素材类型;在 HTML5(网站和智能手机)中使用 WebGL 2,在 Android 中使用 OpenGL ES 3.1,在 Java 7、8 和 9 中使用 JavaFX。
3D 的基础:网格的几何学
正如 2D SVG 新媒体一样,3D 新媒体资源的最低层是顶点及其与其他顶点的连接。使用 3D,顶点之间的连接变得更加复杂,不仅因为这些连接在三维空间中出现,还因为 3D 引入了通常称为多边形或“多边形”的三角形面,或称为四边形或“四边形”的矩形面顶点之间的连接称为“边”在 3D 几何图形进行纹理映射之前,它在 3D 行业中被称为“网格”或“线框”,因为这是您的 3D 几何图形在使用数字图像进行纹理映射或“蒙皮”之前的样子。您将在下一节中讨论这一点。
3D 空间中的数据点:3D 顶点的原点
就像 2D 顶点(在 Illustrator 中称为“锚点”,在 Inkscape 中称为“路径节点”)一样,顶点是 3D 几何和有机建模的基础。就像 2D 多边形使用直线一样,3D 几何模型使用直线,3D 有机模型使用通过 NURBS(非均匀有理 B 样条)、Catmull-Rom 样条和哈希面片定义的 3D 曲线。顶点定义了模型基础结构(无论是边还是样条线)在 3D 空间中的位置。
在 3D 几何中,顶点数据可以保存表面颜色数据、表面法线数据、UVW 纹理映射数据以及顶点 X、Y、Z 位置数据。这类似于 2D 的像素,它保存 X 和 Y 数据;RGB 数据;和阿尔法通道数据。
熟悉 3D 数据扫描仪的人都知道术语“点云”所以顶点仍然是你在 3D 产业中创造的一切的基础,从游戏到模拟到虚拟世界等等。
对于 Java 7、8 和 9 编程,JavaFX VertexFormat 类保存顶点数据,包括顶点位置、法线信息(法线很快将被涵盖)和 3D 纹理坐标。因此,您可以使用 JavaFX 代码为您的游戏或物联网应用放置顶点,或者您可以使用 Hexagon 等 3D 建模器,或者 Blender 等 3D 建模器和动画包。
连接 3D 顶点:边将 3D 顶点连接在一起
3D 几何模型使用称为边的东西将两个顶点连接在一起。边缘是一个向量,或者直线,所以它看起来像 3D 空间中剃刀的边缘,正如你在 Blender 中看到的图 10-1 。形成多边形需要三条边,形成四边形需要四条边。多边形和四边形被称为“面”,这将在下一节中介绍。建模 3D 几何对象时,可以选择模型的组件,如顶点、边或多边形。
图 10-1。
Blender 3D geometry having 8 vertices and 12 edges
如果您已经使用更高级的基于样条的建模范式创建了 3D 几何图形,例如使用 MoI 3D 的 NURBS,或使用 SILO 2 的四边形(仅 160 美元),或使用 Animation:Master 的散列面片(仅 80 美元),您将需要将您的模型“抽取”为多边形(三角形),这就是 Android Studio (OpenGL,Java,JavaFX)用于其 3D 渲染的方式。
目前,Android、JavaFX 或 HTML5 中没有对样条线或四边形的 OpenGL“原生”渲染支持。这些都使用 OpenGL ES 3.1。ES 代表“嵌入式系统”,指的是便携式低功耗消费电子设备。
从 3D 几何图形的其他样条或四边形表示抽取成多边形的算法过程将这些建模范例中使用的无限平滑曲线转变成具有直边的三角形面的集合。
这是通过滑块或对话框设置使用抽取或平滑数字因子来完成的。这或者是 3D 软件内部的抽取功能,或者是在文件导出功能中提供的,该功能将样条建模格式从基于曲线的建模器输出到多边形几何模型格式。这方面的一个很好的例子是在灵感的时刻 V3 NURBS 建模软件。现在让我们看看多边形、四边形和样条曲线是如何形成 3D 曲面的。
曲面:三条边形成多边形,四条边形成四边形
一旦你有三条三角形的边,你就有了一个多边形。这可用作表面,并可作为“皮肤”或“纹理”的宿主,以使 3D 数据看起来更真实。经验法则是,三角形越均匀(正方形),渲染效果越好。狭长的(长而细的三角形)会导致渲染“伪像”或视觉异常,但通常不会。你觉得幸运吗?然后使用狭长多边形。建模者通常更喜欢用四边形建模,并使用四边形建模器使它们尽可能地方形,例如 NeverCenter 的流行 Silo 2.3(如图 10-2 所示),它仅售 109 美元。
图 10-2。
Silo quad modeling software is affordable at $109
可以看到,Silo(目前是 2.3.1 版本)可以用于角色建模。这通常是使用有机样条建模器来完成的,例如 Hash Animation:Master(见图 10-3 )使用专有的 Hash patch 样条算法。
图 10-3。
Hash A:M character modeling software is only $79
一旦你有了一个曲面,对于 Android 来说需要是一个三角形,你也定义了你的曲面法线。在图 10-1 所示的 Blender 2.76 项目中,基本立方体上的面是四边形,但是正如你将看到的,四边形,就像 tris 一样,也有曲面法线。
法线是用于将纹理贴图应用到 3D 网格几何体以使其看起来实心的东西之一。
纹理映射将在本章的下一个主要章节中介绍。有一个与相邻多边形或面相关的原则,称为平滑组,您将在曲面法线之后看到它。
因此,曲面多边形、三角形、四边形或面至少包含一个法线、几个纹理贴图和一个平滑组的数据。正如我提到的,i3D 素材比 2D 媒体素材先进得多。3D 资源呈现在客户端,或正在观看它们的设备上。我将在本章的后面介绍渲染。涵盖大量的 i3D 主题!
表面朝向的方向:表面法线的概念
如果你知道如何在 3D 软件中打开“显示法线”功能,你可以看到你的 3D 面表面法线,它显示在面的正中心,正如你在图 10-4 中看到的浅蓝色。Blender 中也有显示顶点法线的按钮,顶点法线从顶点指向外;因此,对于这个模型,顶点法线从立方体的角(45 度)斜向指向外,与面法线的结果正好相反,面法线从每个面的中心垂直向上指向(90 度,像摩天大楼一样)。
图 10-4。
Display face normals as lines button shows normals
正如你在图 10-4 中看到的,看到的两条法线实际上与 X 轴(红色)和 Y 轴(绿色)对齐,它们与立方体成 90 度角相交。在 3D 编辑模式视图的左下角,您的轴向导显示哪个轴是 X 轴,哪个是 Y 轴,哪个是 z 轴。
这个曲面法线的函数相当简单。表面法线告诉渲染引擎表面面对的方向:向内或向外。同样的逻辑适用于顶点法线;它显示渲染引擎处理 3D 几何图形的哪一侧进行表面渲染。
如果这个立方体几何体的法线指向内侧,而不是外侧,那么这个立方体在渲染时将完全不可见。3D 软件中有一个翻转法线操作(算法),用于反转法线方向。这是为模型普遍做的;所有法线翻转 180 度。
渲染场景时使用翻转法线,渲染场景后导入的 3D 对象不可见。这几乎总是因为 3D 导入工具将导入的 3D 几何体的曲面法线指向(翻转)了错误的方向。相对于导入曲面法线的软件,3D 建模工具的导出器可能会以错误的方向导出曲面法线。这是一个相当常见的现象,所以,如果你打算使用 3D 或 i3D 新媒体资源,请定期使用翻转法线。
如果您需要某种东西(例如,一所房子),其中的 3D 几何体必须从外部和内部进行渲染(这在 3D 虚拟世界中很常见,也是固有的 i3D 模拟),因为您必须能够在其中导航,所以您必须将几何体的面创建为双面多边形。你需要应用一个双面纹理贴图,我将在下一节介绍。
需要注意的是,在 i3D 中,使用双面几何体和双面纹理需要 CPU 和 FPU 进行更多的实时渲染引擎处理。
平滑多面曲面:使用平滑组
您已经看到了渲染为实体(而不是线框)的 3D 模型,但看起来像是经过雕琢的;也就是说,你可以看到渲染的多边形(面)就像是平面一样,如图 10-5 所示。这通常被称为平阴影;渲染引擎不应用平滑。如果在启用平滑的情况下渲染相同的几何体,这种效果会消失,3D 几何体看起来就像预期的那样,无限平滑,就像是使用样条线创建的一样,而实际上是使用多边形。让渲染引擎进行平滑比拥有大量网格(多边形)数据更有效。渲染器使用称为平滑组的东西来应用平滑,该平滑组应用于每个面,以告诉渲染器何时在两个面之间平滑,何时不平滑,这留下了通常称为“接缝”的部分平滑组使用简单的整数。如果边的每一侧的数字都匹配(对于该边相对侧的每个相邻面),则渲染为平滑的颜色过渡。如果数字不同,它会渲染一条接缝,并且边缘清晰可见,因为边缘每一侧的颜色渐变不同,所以颜色渐变在两个面(多边形)之间不是无缝的。
图 10-5。
Set faceted shading via Transform ➤ Shading ➤ Flat
在某些 3D 软件包(例如 Autodesk 3D Studio Max)中,平滑组编号模式位于用户界面中。在其他情况下,如 Blender,使用 Blender Edges 菜单中的 Mark Seam、Clear Seam、Mark Sharp 或 Clear Sharp 命令,编号被隐藏,平滑组的功能被“暴露”,如图 10-6 左侧所示,标记 Sharp 选项为蓝色。
图 10-6。
The Blender Edges menu allows you to set smoothing
在 Blender 中,一些 3D 建模者(人,而不是软件)会犯错误,试图通过实际分割 3D 几何本身中的边来暴露其 3D 几何中的接缝或锐边,这实现了这种视觉效果,但也可能在 3D 几何拓扑优化工作过程中导致问题,因为您的模型会不断优化。通过在 Blender 中使用“标记接缝”或“标记锐边”修改器,可以避免分割几何体边以获得接缝。
这些特定的混合器修改器是基于平滑组的,因此可以实现平滑(或边缝)效果,而不会实际影响 3D 几何体拓扑本身。3D 几何拓扑是多边形相对于彼此的布局方式。
Blender 中的修改器是在渲染之前应用的,因此实际上不会影响底层 3D 几何体的实际数学拓扑。如果您熟悉映射中使用的术语“拓扑”,那么拓扑非常类似,因为它是一个 3D 术语,指的是如何构建 3D 几何图形的表面。
使用 Blender 修改器始终是一种更灵活的 i3D 内容创建方法,因为它在渲染引擎级别应用平滑度或其他所需的效果或结果,而不是在 3D 几何体拓扑级别。这使得 3D 网格保持完整,最终更加简单。一如既往,越简单越好。
通过使用变换面板和阴影面板区域,然后单击平滑按钮,可以对 3D 模型全局(同时对所有面)应用平滑,如图 10-7 所示。这会将平滑组应用于整个模型,从而产生平滑的表面颜色渐变。
图 10-7。
Set smoothing using Transform ➤ Shading ➤ Smooth
接下来,让我们来看看如何应用一个“皮肤”到你的网格几何体表面,使用一种叫做纹理映射的东西。
蒙皮 3D 模型:纹理映射概念
完成 3D 几何图形(这是 3D 模型的基础)后,可以对其应用纹理贴图,以创建 3D 模型的实体外观。纹理贴图还可以用来为 3D 模型添加细节和特殊效果,使其看起来更真实。如果您想知道 3D 几何体和 3D 模型之间的区别,3D 几何体只是网格或线框,而 3D 模型应该已经应用了纹理贴图。如果你购买第三方 3D 模型,你希望它们呈现时看起来像它们应该呈现的样子,而不是单调的灰色,这是没有应用任何纹理映射(和没有顶点颜色)信息的渲染模型的样子,如图 10-7 所示。
纹理贴图基础:通道,阴影,效果和 UVW 贴图
纹理映射几乎与创建拓扑正确的几何图形一样复杂。事实上,3D 的每个领域都同样复杂,这也是 3D 成为整体上最复杂的新媒体类型的原因。这就是为什么 3D 故事片雇佣艺术家专门关注(工作)和处理你在这一章中看到的每一个领域。纹理映射是 3D 新媒体素材制作的主要领域之一,能够使用 2D 矢量和 2D 光栅图像素材。
值得注意的是,还有一个使用 3D 纹理算法的更复杂的 3D 纹理映射领域。它通常被称为体积纹理;它使用算法来创建真正的 3D 纹理效果,这些效果贯穿整个 3D 对象,就好像它是实心的,而不是空心的或需要双面纹理映射的 3D 对象。
纹理映射背后的一个基本概念是利用你在本书中学到的资源,将 2D 资源应用到 3D 几何体的表面。这是通过使用 UVW 映射坐标来实现的。这些 3D 坐标显示了如何将 2D 图像(平面)定向或投影到 3D 几何表面拓扑上。UVW 曾经与 XYZ 不同,但它们代表着相同的维度(宽度、高度、深度)。有必要使用不同于 XYZ 的字母,因此在 XYZ (UVW-XYZ)之前的字母表中有三个字母,这样你就不会在应用你的纹理贴图坐标时感到困惑!).
通过使用纹理通道,可以将多个纹理贴图添加到 3D 几何体的表面。这些类似于您在 2D 图像中用来定义每个像素特征的颜色和 alpha 通道。Android、HTML5 和 JavaFX 等开放平台目前支持四种最重要的纹理通道。这些包括漫反射纹理贴图(基本 ARGB 颜色值),高光纹理贴图(表面有光泽或暗淡),照明纹理贴图(也称为发光贴图),以及凹凸纹理贴图。
3D 软件支持用于附加纹理效果的其他高级纹理贴图通道类型。要将它们引入 Android,你必须使用一种叫做“纹理烘焙”的过程
烘焙纹理贴图包括将所有的纹理通道渲染到一个主漫射纹理贴图中,因为这是 Android 支持的。这提供了与在 3D 包中渲染 3D 对象时类似的视觉效果。
正如你在图 10-8 中看到的,Blender 2.76 也使用场景图,就像大多数现代 3D 软件包一样,JavaFX 也提供了相同的场景图功能。
图 10-8。
Using a scene graph (right) to apply a gold texture map and shader (bottom) to a sphere object in Blender
这个球体几何体和它的纹理映射在一个场景图形层次中组合在一起,我已经为你展开了这个层次。纹理映射定义包含一个或多个纹理通道;在这种情况下,漫反射(颜色)和镜面反射(表面特征,如光泽、金属光泽等)。
正如你在图 10-8 中看到的,你可以从 Android、JavaFX 和 HTML5 等开放平台现在支持的少数纹理通道中获得大量良好的蒙皮结果。
随着时间的推移,OpenGL ES 3.1 可以添加更多的纹理通道支持,为开发人员的 3D 新媒体资源使用提供更大的视觉灵活性。透明区域(不透明贴图)和表面细节(法线贴图)是高级纹理贴图支持的两个最重要的区域,需要添加到 Android Studio、JavaFX 和 HTML5 中。
这些最终将需要添加到 Android Studio 中,要么通过支持 JavaFX API,以便开发人员能够为 Java 7、8 或 9 创建逼真的 3D 模型,要么通过使用 nVidia 的 Android 扩展包(AEP ),您目前必须安装该包,但最终将成为 Android Studio、Android APIs 和 Android OS 的永久组成部分。
着色器定义是纹理通道和控制这些通道相互关系的任何代码的集合,也是它们相对于彼此如何合成、应用和渲染的集合。
着色器在行业中也通常被称为“材质”。着色器和着色器语言(3D 和 i3D Android Studio 应用开发的另一个专门和复杂的领域)将在下一节中介绍。正如你所看到的,i3D 产品有很多“层”——其中涉及到着色器,子层!
着色器设计:着色器通道和 GLSL 着色器语言
正如本章中涉及的 3D 对象创建的每个领域一样,纹理贴图着色器设计本身也是另一种艺术形式。数百名着色器艺术家在 3D 电影、流行的控制台游戏和电视节目中工作,确保用于纹理或皮肤 3D 几何图形的着色器使生成的 3D 模型看起来尽可能真实。这通常是 3D 和 i3D 的主要目标:通过创建一个虚拟世界并让计算机(渲染农场)为您创建所有相机运动,将它们转化为像素(图像)、帧(视频)或体验(游戏或应用),来取代更昂贵的摄像机拍摄(以及后续的重拍)。
基本着色器由一系列矢量形状和光栅图像(或算法,体积纹理)组成,保存在不同类型的纹理通道中。这些纹理通道使用矢量和光栅资源来应用各种类型的效果,如扩散(RGB 颜色通道)、不透明度(透明度)、发光(自发光)、镜面反射(表面特征)、环境(周围环境)、凹凸(高度)、法线(拓扑)以及类似的增强照片真实感的细节效果通道。
在此基础上,像 Open GL 着色器语言(GLSL)这样的高级着色器语言使用代码来定义这些通道如何相互关联,如何应用或处理通道中包含的数据,以及基于时间、方向或 i3D 空间中的位置等因素的这些通道中数据的其他复杂应用。着色器的复杂性也意味着着色器越复杂,渲染时处理周期就越耗时。
这可能是 OpenGL ES3 目前支持四种最容易处理的基本着色器的主要原因。随着硬件变得更加强大(消费电子产品中的 4 核或 8 核 CPU),OpenGL ES 可能会添加最后两个重要的着色器通道:不透明度(alpha 通道)和法线贴图。
一旦在着色器内部定义了纹理通道,您需要将 2D 资源定向到 3D 几何体,这是通过使用纹理映射坐标来完成的。如果需要,每个通道都有自己的坐标系,以便将每个效果应用到网格,从而实现所需的效果。
这是通过一种叫做 UVW 映射的东西来实现的,在你进入第四维空间并学习 3D 动画原理和术语之前,下一节也会涉及到它。
纹理贴图方向:投影类型和 UVW 坐标
将 2D 纹理贴图通道中的细节特征(尤其是基本的漫反射颜色通道,因为它对对象的表面进行绘制或着色)与 i3D 几何体正确对齐是非常重要的。如果您没有正确地做到这一点,在渲染 3D 对象时会出现一些非常奇怪的结果,或者至少在视觉上是不正确的。对齐需要在 3D 空间中完成,因为纹理映射这是 UVW(特别是对于体积“真正的 3D”纹理,但对于 2D 纹理也是如此)来定义它们如何投影到 i3D 几何图形上、顶部或包围 i3D 几何图形。
实现这一点的一个简单方法是应用纹理贴图投影类型及其相关设置。这将自动为您设置 UVW 映射数值。这些 UVW 地图坐标值定义了 2D 影像平面在 3D 空间中映射到 3D 几何的方式。这提供了你的“数学桥梁”,在你的 2D 空间和你的三维空间之间。可以手动设置或调整 UVW 贴图浮点值,以微调纹理贴图的视觉效果。
最简单的投影类型是平面投影,因为平面就是一个简单的 2D 正方形。您可以想象这种类型的贴图,就好像您的 2D 纹理贴图图像在 3D 对象的前面,并且您用灯光穿过它,因此它看起来就像您的漫反射纹理贴图中的颜色被投影到 3D 对象上。平面投影对于计算机来说也是最简单的处理方法,所以如果你能得到你的 Android Studio 应用所需要的结果,就使用它。平面贴图通常用于静态 3D 对象,如广告牌,因为一旦您将(相机)移动到 3D 模型的侧面,这种类型的投影贴图不会提供照片级的真实效果。
相机投影非常类似于平面投影,因为相机将来自相机镜头的纹理投影到 3D 对象表面,就像幻灯机一样。投影与镜头前部 100%平行。这应该用于将视频背景投影到场景中,以便您可以在投影前对 3D 资源进行建模或最终制作动画。如果相机移动,相机投影贴图将保持与镜头前方平行。这有时被称为广告牌映射模式(广告牌投影)。
下一个最简单的类型是圆柱投影,它为纹理贴图提供了更多的 3D 应用。一个圆柱形的贴图在你的上下(3D z 轴)维度上围绕着物体,把你的图像投射到你的物体周围!如果你在 3D 物体上走来走去,在另一个维度上会有独特的纹理细节,这是平面或相机投影所不能提供的。确保你的纹理贴图沿着 y 轴无缝拼接!
一种更复杂的投影贴图类型称为球形投影。这为你的纹理贴图提供了比圆柱投影更完整的 3D 应用。球形投影试图处理所有三个(x、y 和 z 轴)投影方向。同样,你要确保你的纹理贴图是可平铺的,以避免任何“视觉接缝”
与球形投影相似的是立方体投影。这就像有六个立方体格式的平面投影,并使用特殊的立方体纹理贴图数据格式给出类似于球形投影的结果。
当您将立方投影贴图类型应用到 i3D 对象时,正如您可能已经猜到的那样,对象的面被指定给立方纹理贴图中的特定面。这是基于每个 3D 对象的多边形法线的方向,或者通过面与立方体纹理贴图(坐标)UVW 贴图空间的接近度。然后使用平面投影方法从立方体纹理贴图的面投影立方体纹理。
如果使用体积纹理,则空间投影是通过 3D 对象的体积投影的三维 UVW 纹理投影。它通常用于需要内部结构的程序或体积纹理,如木材、大理石、海绵、玛瑙等。如果对 3D 对象进行切片,或者相对于 3D 对象变换纹理贴图坐标,随后会显示体积或程序纹理的不同部分。
还有一个更简单的纹理贴图叫做 UV 贴图(没有 W 维度)。这将在二维空间而不是三维空间中应用你的纹理,并且因为它有较少的数据,所以更容易处理。您可能会使用 3D 软件在 Android Studio 之外映射您的 3D 模型,然后使用模型导入器将您已经纹理映射的 3D 对象导入 Java 或 JavaFX。现在你已经准备好看一看第四维和 3D 动画了。
3D 动画:关键帧、运动曲线和 IK
在你已经创建了你的 3D 几何图形,并使用着色器和 UVW 贴图坐标对其进行了纹理贴图后,你可能想要让它以某种方式移动;让我们以一个飞行直升机模型为例。正如您可能想象的那样,您所了解的数字视频资源的概念同样适用于 3D 动画资源,因为两者都使用关键帧。3D 软件包通常被称为“轨迹编辑器”,它允许您向轨迹添加关键帧和“运动曲线”。每个轨迹都与一个 3D 模型相关。如果 3D 模型使用子组件分组,那么可以有必要的组和子组的轨迹,以实现 Android Studio 应用、游戏或 3D 虚拟世界的任何复杂动画或模拟。
线性动画:轨迹、关键帧、循环和范围
最简单的 3D 和 2D 动画是线性动画。线性动画使用的处理能力最少,因此效率最高。如果可以使用线性动画来实现 3D 动画目标,请使用最少数量的轨迹和最少数量的关键帧,因为这样使用的系统内存最少。图 10-9 显示了如何在 Blender 2.76 中添加一个关键帧到立方体对象,方法是使用热键“I”访问一个插入关键帧菜单并选中一个立方体对象。我选择了增量缩放关键帧类型,它从当前缩放值添加一个增量(差)缩放值。
图 10-9。
Use Insert Keyframe menu; add Delta Scale keyframe
如果动画运动是重复的,请使用无缝循环,而不是包含重复关键帧数据的长范围。一个无缝运动循环比一个长范围占用的内存少,特别是当该范围包含同一运动的多个副本时,这是非常多余的。所以循环是线性 3D 动画中一个很好的优化原则。
接下来让我们看看一些更复杂的动画类型,包括那些非线性的。它们不会在一条直线上,关键帧间隔均匀。您还将了解角色动画和用于物理模拟和粒子系统的程序动画。
非线性动画:运动路径和运动曲线
一种更复杂的非线性动画类型不太规则,通常看起来更真实,尤其是在涉及人体运动和简单物理模拟的情况下,它为动画 3D 对象或元素(层次中的子对象)实现了一条运动路径。为了给沿该路径的运动添加更多的复杂性,可以使用运动曲线,以便运动本身可以加速或减速,模拟重力或摩擦等情况。使用这些运动曲线直观表示的数学算法称为插值器。JavaFX 有一个插值器类,它包含了各种最标准的(如果有效使用的话,功能非常强大)运动曲线算法。下一章将介绍 JavaFX,包括 3D 格式、平台、场景图和编程相关的主题。
非线性不规则运动关键帧的一个很好的例子是一个橡胶球在多风的路上弹跳。道路的弯曲路径使用运动路径来确保球停留在道路曲率上,并且球地板符合道路的坡度(角度)。球的反弹应该使用运动曲线,也称为运动插值器,以使每次反弹在空间运动的加速或减速时间上看起来更真实。在这种情况下,这就是球对地面的反应。
图 10-10 在屏幕底部显示了一个 Blender 时间线编辑器;它有两个旋转关键帧,用垂直黄线表示,当前帧设置是垂直绿线。
图 10-10。
The Blender 2.75 Timeline editor with two keyframes at Frame 0 and Frame 10 and current Frame 6 setting
复杂的物理模拟和角色动画可以使用关键帧完成,如果你想花几个月的时间;然而,编写算法和代码例程来实现这一点实际上比绘制运动曲线和关键帧来尝试和模拟这些现象更容易。
因此,接下来将介绍角色动画原理和程序动画原理,因为您将从较不高级的概念发展到更高级的概念。
接下来让我们概述一下角色动画,因为它是 JavaFX 和 Android Studio 的类似 3D 平台可能支持的 3D 动画类型。
角色动画:骨骼、肌肉和反向运动学
更复杂的动画类型是角色动画。角色动画师是 3D 电影、游戏或电视内容制作团队中最受欢迎的职位之一。角色动画涉及许多复杂的层,包括使用反向运动学设置骨骼,以控制附着到肌肉和皮肤的骨骼;所以角色动画的事情是在不使用直接编码的情况下尽可能复杂的,这被称为程序动画。有一个为制作角色动画定制的动画软件包,叫做 Hash Animation:Master,或 A:M,幸运的是,它有一个负担得起的 79 美元年费,可以拥有它并获得免费升级。如图 10-3 所示。正如你所看到的,这是一个惊人的产品,在二十多年的第 18 次修订中,从 Amiga 3000 上的玩伴开始。
在角色动画的最底层,您有自己的骨骼,它使用反向运动学算法。这控制了运动(旋转)的范围,所以你不会有弯曲错误的肘部,或者像驱魔人一样旋转的头部。
骨骼以层次结构连接在一起,形成骨骼。这是您稍后将设置动画(关键帧)以赋予角色生命的内容。还可以通过将肌肉和皮肤附加到骨骼来模拟肌肉和皮肤,并定义骨骼运动应该如何为角色弯曲肌肉和拉伸皮肤。肌肉伸缩和皮肤变形也是复杂的算法,就像 IK 算法控制骨骼组成部分的运动范围一样。
可以想象,设置所有这些可能是一个非常漫长而复杂的过程;这是角色动画的一个领域,叫做“操纵”是的,正如我提到的 3D 和 i3D 素材创造的所有领域,如果你想在电影或主机游戏行业工作,索具是它自己的工作领域。3D 非常复杂,每个领域都有自己的专长。
程序动画:物理、流体、头发和粒子系统
最复杂的动画类型是程序动画,因为它需要使用算法来完成。在 3D 包中,这通常使用 C++、Python 或 Java 来完成。Android Studio 应用中的程序化 3D 动画应该使用 Java APIs、JavaFX APIs 和第三方 API 的组合来完成,这将在下一章中介绍。
这是最复杂也是最强大的 3D 动画类型。这就是为什么程序动画程序员是 3D 电影、游戏、物联网和电视制作行业中另一个更受欢迎的 3D 职位空缺的原因。你开始明白为什么 i3D 是最复杂的新媒体类型,为什么我把它留到了本书的最后部分。
3D 建模和动画包中有许多功能,如 Blender、A:M、Silo 和 3D Studio Max,它们实际上是程序动画算法插件。
这些插件将用户界面展示给用户,以指定参数,这些参数在程序动画应用于 3D 模型或使用 3D 软件创建的复杂 3D 模型层级时控制程序动画的结果。
以下是一些具有模拟和控制功能的程序动画算法的示例:粒子系统、流体动力学、布料动力学、绳索动力学、毛发动力学、软体动力学、刚体动力学和视频运动跟踪。其中许多包括现实世界物理模拟支持,这些支持通常是添加到高级 3D 动画软件包中的插件。还有许多其他的高级特性需要合理的努力来实现算法。3D 就是利用计算机处理器和内存来创建内容!
摘要
在本章中,您了解了 3D 新媒体的概念和术语。您了解了 3D 网格几何体以及添加纹理贴图如何使其成为完整的 3D 模型。您了解了 UVW 贴图以及如何使用投影贴图、着色器和着色器语言以及不同类型的 3D 动画(从简单的线性动画到复杂的动画类型,如角色动画和程序或算法动画)轻松应用它。您已经看到了 3D 新媒体领域的复杂性,因为它支持高级主机游戏和电影电视制作。
在下一章中,您将学习使用场景图层次 3D 素材组织的 3D 平台和 3D 文件格式。