Android 窗帘(Curtain)效果三之波浪式扭曲效果优化提升

最新推荐文章于 2024-08-30 08:17:33 发布

白鹭飞

最新推荐文章于 2024-08-30 08:17:33 发布

阅读量1.5k

点赞数

分类专栏： android Android窗帘皱褶菜单文章标签： Curtain 窗帘折叠

本文链接：https://blog.csdn.net/u010949962/article/details/82120163

版权

本文介绍了Android窗帘(Curtain)效果的优化，包括竖直方向像素的正弦曲线扭曲以增强自然感，以及通过drawBitmapMesh添加阴影效果以提升美观度。文章提供了核心代码示例，并展示了优化前后的效果对比。

摘要由CSDN通过智能技术生成

1.竖直方向像素优化

前一篇文章张我们已经实现图片的扭曲效果，但是只是仅仅扭曲了水平直线上的像素，这些扭曲后的像素在竖直方向还是处于一条直线中一次，图片的垂直边是竖直的看着很不自然。下面第一步我们要做的优化就是把这些竖直线上的像素y坐标代入正弦公式得到Y轴上优化过后的x坐标，那么整个扭曲图片看起来就更自然了。前面我们已经详细介绍了水平方向像素的扭曲原理，竖直方向上的扭曲我们就直接上核心代码吧，核心代码如下：

   @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        for (int i = 0; i < HEIGHT + 1; i++) {
            for (int j = 0; j < WIDTH + 1; j++) {

                //把每一个水平像素通过正弦公式转换成正弦曲线
                //H_MAX_WAVE_HEIGHT表示波峰跟波低的垂直距离，皱褶后会王桑超过水平线，所以往下偏移WAVE_HEIGHT / 2
                //5表示波浪的密集度，表示波峰波谷总共有五个,对应上面左图的1,2,3,4,5
                //j就是水平像的X轴坐标
                //K决定正弦曲线起始点(x=0)点的Y坐标，k=0就是从波峰波谷的中间开始左->右绘制曲线
                float yOffset = H_MAX_WAVE_HEIGHT / 2 * progress + H_MAX_WAVE_HEIGHT / 2 * progress * (float) Math.sin((float)j/WIDTH*5*Math.PI+k);

                //垂直方向竖直压缩时的坐标
                float xPostion = origs[(i*(WIDTH+1)+j)*2+0] + (bitmapwidth - origs[(i*(WIDTH+1)+j)*2+0]) * progress;
                //垂直方向正弦曲线优化后的坐标,1.1->个波峰波谷
                float vXSinPostion = V_MAX_WAVE_HEIGHT / 2 * progress * (float) Math.sin((float)i/WIDTH*1.1*Math.PI + k);
                //每个像素扭曲后的x坐标
                //origs[(i*(WIDTH+1)+j)*2+0] 原图x坐标
                verts[(i*(WIDTH&