炒股振幅编程(春秋电子那个炒股软件可以自己编程)
阿里妹导读：翻开盒马app，相信你跟阿里妹相同，很难反抗各种甘旨的引诱。颜值即正义，盒马的图片视频技能逼真地复原了食物细节，并在短短数秒内呈现出食物的最佳作用。今日，咱们请来阿里高档无线开发工程师莱宁，解密盒马app里那些“甘旨”视频是怎么出产的。一、前语图片组成视频并发生相似PPT中每页过渡特效的才能是现在许多短视频软件带有的功用，比方抖音的影集。这个功用首要包含图片组成视频、转场时刻线界说和OpenGL特效等三个部分。其间图片转视频的流程直接决议了后边过渡特效的完成计划。这儿首要有两种计划：图片预先组成视频，中心不做处理，记载每张图片展现的时刻戳方位，然后在相邻图片切换的时刻段用OpenGL做画面处理。图片组成视频的过程中，在画面帧写入时一起做特效处理。计划1每个流程都比较独立，更便利完成，可是要重复处理两次数据，一次兼并一次加特效，耗时更长。计划2的流程是彼此交叉的，只需求处理一次数据，所以咱们选用这个计划。下面首要介绍下几个要点流程，并以几个简略的转场特效作为比如，演示详细作用。二、图片组成1.计划图片组成视频有多种手段能够完成。下面谈一下比较常见的几种技能完成。I.FFMPEG界说输出编码格局和帧率，然后指定需求处理的图片列表即可组成视频。II.MediaCodec在运用Mediacodec进行视频转码时，需求解码和编码两个codec。解码视频后将原始帧数据依照时刻戳次序写入编码器生成视频。可是图片自身就已经是帧数据，假如将图片转化成YUV数据，然后合作一个自界说的时钟发生时刻戳，不断将数据写入编码器即可到达图片转视频的作用。III.MediaCodec&OpenGL已然Mediacodec组成过程中已经有了处理图片数据的流程，能够把这个过程和特效生成结合起来，把图片处理成特效序列帧后再按序写入编码器，就能一起生成转场作用。2.技能完成首要需求界说一个时钟，来操控图片帧写入的频率和编码器的时刻戳，一起也决议了视频终究的帧率。这儿假定需求24fps的帧率，一秒便是1000ms，因而写入的时刻间隔是1000/24=42ms。也便是每隔42ms自动生成一帧数据，然后写入编码器。时刻戳需求是递加的，从0开端，依照前面界说的间隔时刻差deltaT，每写入一次数据后就要将这个时刻戳加deltaT，用作下一次写入。然后是设置一个EGL环境来调用OpenGL，在Android中一个OpenGl的履行环境是threadlocal的，所以在组成过程中需求一向保持在同一个线程中。Mediacodec的结构函数中有一个surface参数，在编码器中是用作数据来历。在这个surface中输入数据就能驱动编码器出产视频。经过这个surface用EGL获取一个EGLSurface，就到达了OpenGL环境和视频编码器数据绑定的作用。这儿不需求手动将图片转化为YUV数据，先把图片解码为bitmap，然后经过texImage2D上传图片纹路到GPU中即可。终究便是依据图片纹路的uv坐标，依据外部时刻戳来驱动纹路改变，完成特效。三、转场时刻线关于一个图片列表，在组成过程中怎么联接前后序列图片的展现和过渡机遇，决议了终究的视频作用。假定有图片合集{1,2,3,4}，按序组成，能够有如下的时刻线：每个Stage是组成过程中的一个最小单元，首尾的两个Stage最简略，仅仅单纯的显现图片。中心阶段的Stage，包含了过渡过程中前后两张图片的展现和过渡动画的时刻戳界说。假定每张图片的展现时刻为showT(ms)，动画的时刻为animT(ms)。相邻Stage中同一张图的静态显现时刻的总和为一张图的总显现时刻，则首尾两个Stage的有用时长为showT/2，中心的过渡Stage有用时长为showT+animT。其间过渡动画的时刻段又需求分为：前序离场开始点enterStartT，前序动画开端时刻点。前序离场完毕点enterEndT，前序动画完毕时刻点。后序进场开始点exitStartT，后序动画开端时刻点。后序进场完毕点exitEndT，后序动画完毕时刻点。动画时刻线一般只界说为非淡入淡出外的其他特效运用。为了过渡的视觉连续性，前后序图片的淡入和淡出是贯穿整个动画时刻的。考虑到序列的联接性，离场完毕后会马上进场，因而enterEndT=exitStartT。四、OpenGL特效1.根底架构依照前面时刻线界说回调接口，用于处理动画参数：界说几个通用的片段着色器变量，辅佐过渡动画的处理：前后序列的混合流程，依据动画流程核算出的两个纹路的UV坐标混合色彩值：解析图片，先读取Exif信息获取旋转值，再将旋转矩阵应用到bitmap上，确保上传的纹路图片与用户在相册中看到的旋转视点是共同的：在运用图片之前，还要依据终究的视频宽高调整OpenGL窗口尺度。一起纹路的贴图坐标的开始(0,0)是在纹路坐标系的左下角，而Android体系上canvas坐标原点是在左上角，需求将图片做一次y轴的翻转，否则图片上传后是笔直镜像。上传图片纹路，并记载纹路的handle：加载第二张图片时要敞开非0的其他纹路单元，过渡动画需求一起操作两个图片纹路：终究是实践制作的部分，由于用到了透明度突变，要手动敞开GL_BLEND功用，并留意切换正在操作的纹路：2.平移掩盖转场I.着色器完成GLSL中的step函数界说如下，当x<edge是回来0，反之则回来1：已知咱们有前后两张图，将他们掩盖展现。然后从一个方向逐步修正这一条轴上的所扫过的像素的intensity值，躲藏前图，展现后图。经过时钟动画驱动后就有了掩盖转场的作用。再界说一个direction参数，操控扫描的方向，即可设置不同的转场方向，有PPT翻页的作用。II.作用图3.像素化转场I.着色器完成首要是界说像素块的作用，咱们需求像素块逐突变大，到动画中心值时再逐突变小到消失。经过对progress(0到1)取反向值1-progress，得到distFromEdges，可知这个值在progress从0到0.5时会从0到0.5，在0.5到1时会从0.5到0，即到达了咱们需求的变大再变小的作用。像素块便是一整个方格规模内的像素都是同一个色彩，视觉作用看起来就构成了显着的像素间隔。假如咱们将一个方格规模内的纹路坐标都映射为同一个色彩，即完成了像素块的作用。squareSizeFactor是影响像素块巨细的一个参数值，设为50，即最大像素块为50像素。imageWidthFactor和imageHeightFactor是窗口高宽取倒数，即1/width和1/height。经过dx * floor(uv.x / dx)和dy * floor(uv.y / dy)的两次坐标转化，就把一个区间规模内的纹路都映射为了同一个色彩。II.作用图4.水波纹特效I.数学原理水波纹路的周期改变，实践便是三角函数的一个变种。现在业界最盛行的简易水波纹完成，Adrian的博客中描绘了根本的数学原理：水波纹实践是Sombero函数的求值，也便是sinc函数的2D版别。下图的左面是sin函数的图画，右边是sinc函数的图画，能够看到显着的水波纹特征。博客中一起供给了一个WebGL版别的着色器完成，不过功用较简略，仅仅做了作用验证。将其移植到OpenGLES中，并做参数调整，即可整合到图片转场特效中。完好的水波纹片段着色器如下：其间最要害的代码便是水波纹像素坐标的核算：vTextureCoord + (curPosition/centerLength)*cos(centerLength*rippleAmplitude-rippleTime*rippleSpeed)*rippleOffset;简化一下即：vTextureCoord + A*cos(L*x - T*y)*rippleOffset，一个规范的余弦函数。vTextureCoord是当时纹路的归一化坐标(0,0)到(1,1)之间。curPosition是(-1,-1)到(1,1)之间的当时像素坐标。centerLength是当时点间隔波纹中心的间隔。curPosition/centerLength便是线性代数中的单位矢量，这个参数用来决议波纹推进的方向。cos(centerLength*rippleAmplitude-rippleTime*rippleSpeed)经过一个外部时钟rippleTime来驱动cos函数生成周期性的相位偏移。rippleAmplitude是相位的扩展因子。rippleSpeed调理函数的周期，即波纹传递速度。终究将偏移值乘以一个最大偏移规模rippleOffset(一般为0.03)，限制单个像素的偏移规模，否则波纹会很不天然。II.时刻线动画设定色彩混合，在整个动画过程中，图1逐步消失(1到0)，图2逐步展现(0到1)。设定画布透明度，在开始时为1，逐步改变到0.7，终究再逐步回到1。设定波纹的振幅，在开始时最大，过渡到动画中心点到最小，终究逐突变大到动画完毕。设定波纹的速度，在开始时最大，过渡到动画中心点到最小，终究逐突变大到动画完毕。设定波纹的像素最大偏移值，在开始时最大，过渡到动画中心点到最小，终究逐突变大到动画完毕。将本次动画帧的参数更新到着色器：其间GLClock是一个与mediacodec编码时刻戳绑定的外部时钟，用于同步组成时刻和动画时刻戳方位。III.终究作用图片展现时长：3s过渡动画时长：1.5s波纹中心为图片中心点5.随机方格I.噪声函数咱们想完成的作用是前一个画面上随机呈现许多方块，每个方块中展现下一张图的画面，当图片上每一块方位都构成方块后就完成了画面的转化。首要就需求处理随机函数的问题。尽管Java上有许多现成的随机函数，可是GLSL是个很底层的言语，根本上除了加减乘除其他的都需求自己想办法。这个着色器里用的rand函数是撒播已久简直找不到来历的一个完成，很有上古时期游戏编程代码的风格，有魔法数，代码只需一行，证明要写两页。网上一个比较靠谱且简练的阐明是StackOverflow上的，这个随机函数实践是一个hash函数，对每一个相同的(x,y)输入都会有相同的输出。II.着色器完成首要将当时纹路坐标乘以方格巨细，用随机函数转化后获取这个方格区域的随机突变值。然后用smoothstep做一个厄米特插值，将突变的intensity滑润化。终究用这个intensity值mix前后图画序列。III.作用图