如何在Android(Java)中自定义Drawable实现3D Carousel轮播效果

你的第二个实现思路方向完全正确，仅需补充Z轴平移逻辑即可达到预期效果，无需重构现有代码。

问题根因 #

你第二版实现中仅对卡片做了Y轴旋转，没有将卡片沿Z轴偏移对应半径距离，因此所有卡片都重合在中心位置。3D轮播的核心逻辑是每张卡片先沿Z轴平移到圆周半径位置，再绕Y轴旋转对应角度，即可自动实现朝向外侧、按圆周排布的效果。

注意：Android Camera的变换调用顺序和实际执行顺序相反，因此代码中需要先写旋转逻辑，再写平移逻辑。

修改后的实现代码 #

public class CarouselCard extends Drawable {

    Paint paintBackground = null;
    // 可添加该变量控制轮播滚动，每次更新后调用invalidateSelf()即可触发动画
    float offsetTheta = 0;
    
    /* CONSTRUCTOR */
    public CarouselCard() {
        super();
        invalidateSelf();
    }

    @Override
    public void draw(Canvas canvas) {
        if (paintBackground == null) {    // 初始化
            paintBackground = new Paint(Paint.ANTI_ALIAS_FLAG);
            paintBackground.setStyle(Paint.Style.FILL);
            paintBackground.setColor(Color.BLUE);
        }

        int HALF_CHORD_WIDTH = 120; // 卡片半宽，可自行调整
        float RADIUS = 400; // 轮播圆周半径，可自行调整
        float INTERIOR_ANGLE = 30;
        INTERIOR_ANGLE %= 360;
        int numObjects = (int) (360 / INTERIOR_ANGLE);

        for (int i = 0; i < numObjects; i++) {
            // 配置卡片颜色
            if (i % 4 == 0) paintBackground.setColor(Color.YELLOW);
            if (i % 4 == 1) paintBackground.setColor(Color.GREEN);
            if (i % 4 == 2) paintBackground.setColor(Color.BLUE);
            if (i % 4 == 3) paintBackground.setColor(Color.GRAY);
            paintBackground.setAlpha(128);

            float theta = INTERIOR_ANGLE * i + offsetTheta;

            canvas.save();
            // 先移到画布中心
            canvas.translate(canvas.getWidth() / 2f, canvas.getHeight() / 2f);

            Camera camera = new Camera();
            camera.save();
            // 调整Camera位置控制透视强度，默认z=-8，值越小透视效果越强
            camera.setLocation(0, 0, -10);
            // 注意调用顺序：先旋转，再平移
            camera.rotateY(theta);
            camera.translate(0, 0, RADIUS);
            camera.applyToCanvas(canvas);
            camera.restore();

            // 直接绘制中心在原点的卡片即可
            canvas.drawRect(
                    -HALF_CHORD_WIDTH,
                    -HALF_CHORD_WIDTH,
                    HALF_CHORD_WIDTH,
                    HALF_CHORD_WIDTH,
                    paintBackground);

            canvas.restore();
        }
    }

    @Override
    public void setAlpha(int alpha) {}

    @Override
    public void setColorFilter(ColorFilter colorFilter) {}

    @Override
    public int getOpacity() {
        return PixelFormat.UNKNOWN;
    }
}

优化建议 #

• 为避免卡片遮挡顺序错误，可先计算所有卡片的Z轴坐标，按Z值从小到大排序（Z值越小离用户越近）后再依次绘制，保证近处卡片覆盖远处卡片。
• 若需要支持点击事件、懒加载等能力，可改用RecyclerView自定义LayoutManager实现3D轮播逻辑，更方便处理交互和视图复用。

内容的提问来源于stack exchange，提问作者Elliptica