簡體   English   中英

我怎樣才能實現這個ListView動畫?

[英]How can I achieve this ListView animation?

怎么了家伙,我需要一點幫助。 我正在嘗試在滾動的列表視圖上實現一個簡單(但不是真正的)折疊動畫。 基本上,我試圖向后折疊列表視圖的第一個可見子項,就像一張紙沿X軸向下折疊一樣。 當用戶在列表中上下滾動時,這將持續進行。 這是我第一次在圖形api中使用Matrix動畫和Android相機,所以我絕對不在這里。

這就是我想要達到的效果

這就是我想要達到的效果

這就是我得到的效果。 這就是我目前所獲得的效果

我希望動畫從原點(0,0)開始,但左側和右側都是動畫,從列表項的頂部而不是左上角開始動畫。 我不太熟悉矩陣翻譯或動畫,所以如果有更多的經驗,這些技術比我自己能夠提供一些知識,那將非常感激。

基本上我覆蓋了ListView的onDrawChild方法,從繪圖緩存中抓取子位圖,並使用矩陣來執行動畫。 照明和相機實現是我從另一個示例應用程序中獲取的代碼,以使動畫盡可能看起來像3D。

我嘗試使用ListView動畫庫,但沒有太多運氣。 我也試圖破解一起使用的開發者指南代碼的解決方案在這里使用對象的動畫,實現了漂亮的小卡片翻轉動畫,但它開始感覺有點哈克,我不能完全得到它,我想要的方式。

這是我目前的實施。 如果有人能夠在這個問題上找到一些亮點或方向,或者如果有人寫了一篇我在搜索中沒有遇到過的令人敬畏的圖書館,請隨意分享。 謝謝

   @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);
}

JazzyListView

有很多東西類似於你想要的東西,如果不是你想要的東西。 看看它們是如何在爵士效果和混合搭配下定義的。 我認為反向飛行或者翻轉接近你想要的。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM