如何绘制“阴影”?图像的版本?
我陷入了一个简单的问题,这让我发疯。在标准 Android MapView 中,当您调用 drawAt 方法时,覆盖图像会自动绘制阴影。我想重新创建相同的阴影效果,但我不确定如何使图像的阴影版本(与主图像分开绘制)与主图像正确对齐。
private static class SampleView extends View {
private Drawable mDrawable;
private int mMarkerXOffset;
private int mMarkerYOffset;
public SampleView(Context context) {
super(context);
mDrawable = context.getResources().getDrawable(R.drawable.icon);
mDrawable.setBounds(0, 0, mDrawable.getIntrinsicWidth(), mDrawable.getIntrinsicHeight());
mMarkerXOffset = (mDrawable.getIntrinsicWidth() / 2);
mMarkerYOffset = mDrawable.getIntrinsicHeight();
}
private void DrawNormalImg(Canvas canvas, int nX, int nY) {
canvas.save(Canvas.MATRIX_SAVE_FLAG);
canvas.translate(nX, nY);
mDrawable.draw(canvas);
canvas.restore();
}
private void DrawShadowImg(Canvas canvas, int nX, int nY) {
canvas.save(Canvas.MATRIX_SAVE_FLAG);
mDrawable.setColorFilter(0x7f000000, PorterDuff.Mode.SRC_IN);
canvas.translate(nX,nY);
canvas.skew(-0.9F, 0.0F);
canvas.scale(1.0F, 0.5F);
mDrawable.draw(canvas);
mDrawable.clearColorFilter();
canvas.restore();
}
@Override protected void onDraw(Canvas canvas) {
int nX = 100;
int nY = 50;
canvas.drawColor(Color.WHITE);
DrawShadowImg(canvas, nX, nY);
DrawNormalImg(canvas, nX, nY);
}
I'm stuck on a simple problem which is driving me nuts. In the standard Android MapView overlay images have a shadow drawn for them automatically when you call the drawAt method. I want to recreate the same shadow effect, but I'm not sure how to make the shadow version of the image (which is drawn separately from the main image) align properly with the main image.
private static class SampleView extends View {
private Drawable mDrawable;
private int mMarkerXOffset;
private int mMarkerYOffset;
public SampleView(Context context) {
super(context);
mDrawable = context.getResources().getDrawable(R.drawable.icon);
mDrawable.setBounds(0, 0, mDrawable.getIntrinsicWidth(), mDrawable.getIntrinsicHeight());
mMarkerXOffset = (mDrawable.getIntrinsicWidth() / 2);
mMarkerYOffset = mDrawable.getIntrinsicHeight();
}
private void DrawNormalImg(Canvas canvas, int nX, int nY) {
canvas.save(Canvas.MATRIX_SAVE_FLAG);
canvas.translate(nX, nY);
mDrawable.draw(canvas);
canvas.restore();
}
private void DrawShadowImg(Canvas canvas, int nX, int nY) {
canvas.save(Canvas.MATRIX_SAVE_FLAG);
mDrawable.setColorFilter(0x7f000000, PorterDuff.Mode.SRC_IN);
canvas.translate(nX,nY);
canvas.skew(-0.9F, 0.0F);
canvas.scale(1.0F, 0.5F);
mDrawable.draw(canvas);
mDrawable.clearColorFilter();
canvas.restore();
}
@Override protected void onDraw(Canvas canvas) {
int nX = 100;
int nY = 50;
canvas.drawColor(Color.WHITE);
DrawShadowImg(canvas, nX, nY);
DrawNormalImg(canvas, nX, nY);
}
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
好问题!我认为解决方案是将图像倾斜为平行四边形。考虑一个地图图钉的图像,看起来像这样:
Where 。是透明度。您可能希望像这样倾斜图像以获得阴影:
请注意,顶部和底部的宽度与原始图像中的宽度相同。
Nice question! I think the solution will be skew the image as a parallelogram. Consider an image of a map pin that looks something like this:
Where . is transparency. You would want to skew the image like this for the shadow:
Notice the top and bottom are the same width as in the original image.