如何使用PorterDuff.Mode.SRC_ATOP在ImageView上叠加Drawable

嘿，我来帮你搞定这个叠加效果的问题！你现在的代码只是把两个Drawable简单叠进LayerDrawable，但没指定PorterDuff.Mode.SRC_ATOP的混合规则，所以达不到你想要的Atop效果。下面是具体的修改方案：

核心思路 #

LayerDrawable默认只会按顺序堆叠Drawable，不会自动应用混合模式。要实现SRC_ATOP，我们需要给上层的Drawable设置对应的PorterDuffXfermode，同时确保Drawable是可修改的（避免系统复用导致设置失效）。

完整代码示例 #

1. 基础实现（无需自定义LD类） #

如果你的自定义LD类没有特殊逻辑，直接用系统的LayerDrawable就能搞定：

ImageView imageView = findViewById(R.id.imageView);
Context context = imageView.getContext();

// 获取可修改的Drawable实例（必须调用mutate()，否则设置Xfermode可能不生效）
Drawable drawable1 = AppCompatResources.getDrawable(context, R.drawable.drawable1).mutate();
Drawable drawable2 = AppCompatResources.getDrawable(context, R.drawable.drawable2).mutate();

// 给上层Drawable（drawable2）设置SRC_ATOP混合模式
drawable2.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_ATOP));

// 组合图层：底层是原图drawable1，上层是叠加的drawable2
LayerDrawable layerDrawable = new LayerDrawable(new Drawable[]{drawable1, drawable2});
imageView.setImageDrawable(layerDrawable);

2. 基于自定义LD类的实现 #

如果必须使用你定义的LD类（继承自LayerDrawable），可以在类内部处理混合模式：

public class LD extends LayerDrawable {
    private final PorterDuffXfermode srcAtopMode;

    public LD(Drawable[] layers) {
        super(layers);
        srcAtopMode = new PorterDuffXfermode(PorterDuff.Mode.SRC_ATOP);
    }

    @Override
    public void draw(Canvas canvas) {
        // 保存画布状态，避免混合模式影响其他绘制内容
        int saveCount = canvas.saveLayer(null, null, Canvas.ALL_SAVE_FLAG);
        
        // 先绘制底层Drawable（drawable1）
        getDrawable(0).draw(canvas);
        
        // 给上层Drawable设置混合模式后绘制
        Drawable topDrawable = getDrawable(1);
        if (topDrawable != null) {
            topDrawable.setXfermode(srcAtopMode);
            topDrawable.draw(canvas);
        }
        
        // 恢复画布状态
        canvas.restoreToCount(saveCount);
    }
}

然后调用方式和你原来的类似，只需要确保Drawable是mutable的：

ImageView imageView = findViewById(R.id.imageView);
Context context = imageView.getContext();

Drawable drawable1 = AppCompatResources.getDrawable(context, R.drawable.drawable1).mutate();
Drawable drawable2 = AppCompatResources.getDrawable(context, R.drawable.drawable2).mutate();

LD layerDrawable = new LD(new Drawable[]{drawable1, drawable2});
imageView.setImageDrawable(layerDrawable);

关键注意事项 #

• 必须调用mutate()：系统返回的Drawable可能是共享实例，不调用mutate()会导致设置的Xfermode影响其他使用该Drawable的控件。
• 图层顺序不能搞反：SRC_ATOP是以上层Drawable（drawable2）为源，下层（drawable1）为目标，所以数组顺序必须是[drawable1, drawable2]。
• 理解SRC_ATOP效果：该模式下，只有drawable2与drawable1重叠的部分会显示，drawable1的非重叠区域保持原样，drawable2的非重叠区域会被隐藏。

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