Question

怎么了家伙，我需要一点帮助。我正在尝试在滚动的列表视图上实现一个简单（但不是真正的）折叠动画。基本上，我试图向后折叠列表视图的第一个可见子项，就像一张纸沿X轴向下折叠一样。当用户在列表中上下滚动时，这将持续进行。这是我第一次在图形api中使用Matrix动画和Android相机，所以我绝对不在这里。

这是我想要实现的效果

This is the effect I'm trying to achieve

这就是我得到的效果。 And this is the effect I'm currently getting

我希望动画从原点（0,0）开始，但左侧和右侧都是动画，从列表项的顶部而不是左上角开始动画。我对矩阵翻译或动画不是很熟悉，所以如果有更多使用这些技术的经验比我自己能够提供一些知识，那将非常感激。

基本上我覆盖了ListView的onDrawChild方法，从绘图缓存中抓取子位图，并使用矩阵来执行动画。照明和相机实现是我从另一个示例应用程序中获取的代码，以使动画尽可能看起来像3D。

我尝试使用ListView animations库，但没有太多运气。我还尝试使用开发人员指南here中的代码来破解解决方案，这些代码使用对象动画师来实现一个漂亮的小卡片翻转动画，但它开始感觉有点hacky而且我不能像我一样得到它想要的。

这是我目前的实施。如果有人能够在这个问题上找到一些亮点或方向，或者如果有人写了一篇我在搜索中没有遇到过的令人敬畏的图书馆，请随意分享。感谢

   @Override
protected boolean drawChild(Canvas canvas, View child, long drawingTime) {

    View first = getChildAt(0);

    if (child == first) {
        if (child.getTop() < 0) {

            Bitmap bitmap = getChildDrawingCache(child);
            final int top = child.getTop();
            child.getRight();
            child.getBottom();
            child.getLeft();

            final int childCenterY = child.getHeight() / 2;
            // final int childCenterX = child.getWidth() / 2;
            final int parentCenterY = getHeight() / 2; // center point of
            // child relative to list

            final int absChildCenterY = child.getTop() + childCenterY;

            // final int bottom = child.getBottom();

            // distance of child center to the list center final int
            int distanceY = parentCenterY - absChildCenterY;

            final int r = getHeight() / 2;

            if (mAnimate) {

                prepareMatrix(mMatrix, distanceY, r);



                mMatrix.preTranslate(0, top);

                mMatrix.postTranslate(0, -top);



            }
            canvas.drawBitmap(bitmap, mMatrix, mPaint);

        }

        else {
            super.drawChild(canvas, child, drawingTime);
        }
    } else {
        super.drawChild(canvas, child, drawingTime);
    }
    return false;

}

private void prepareMatrix(final Matrix outMatrix, int distanceY, int r) { // clip
                                                                            // the
                                                                            // distance

    final int d = Math.min(r, Math.abs(distanceY)); //
    // circle formula
    final float translateZ = (float) Math.sqrt((r * r) - (d * d));

    double radians = Math.acos((float) d / r);
    double degree = 45 - (180 / Math.PI) * radians;

    // double degree = -180;

    mCamera.save();
    mCamera.translate(0, 0, r - translateZ);
    mCamera.rotateX((float) degree);
    if (distanceY < 0) {
        degree = 360 - degree;
    }
    mCamera.rotateY((float) degree);
    mCamera.getMatrix(outMatrix);
    mCamera.restore();

    // highlight elements in the middle
    mPaint.setColorFilter(calculateLight((float) degree));
}

private Bitmap getChildDrawingCache(final View child) {
    Bitmap bitmap = child.getDrawingCache();
    if (bitmap == null) {
        child.setDrawingCacheEnabled(true);
        child.buildDrawingCache();
        bitmap = child.getDrawingCache();
    }
    return bitmap;
}

private LightingColorFilter calculateLight(final float rotation) {
    final double cosRotation = Math.cos(Math.PI * rotation / 180);
    int intensity = AMBIENT_LIGHT + (int) (DIFFUSE_LIGHT * cosRotation);
    int highlightIntensity = (int) (SPECULAR_LIGHT * Math.pow(cosRotation,
            SHININESS));
    if (intensity > MAX_INTENSITY) {
        intensity = MAX_INTENSITY;
    }
    if (highlightIntensity > MAX_INTENSITY) {
        highlightIntensity = MAX_INTENSITY;
    }
    final int light = Color.rgb(intensity, intensity, intensity);
    final int highlight = Color.rgb(highlightIntensity, highlightIntensity,
            highlightIntensity);
    return new LightingColorFilter(light, highlight);
}

Answer 1

JazzyListView

有很多东西与你想要的东西相似，如果不是你想要的东西。看看它们是如何在爵士效果和混合搭配下定义的。我认为反向飞行或者翻转都接近你想要的。

我怎样才能实现这个ListView动画？

1 个答案: