用图文在Rect上绘制canvas

Question

我正在尝试使用 Rect 创建一个 button。我已经成功地创建了这个，但是我的图像和文本没有正确地居中。我想设置在精确的中心但无法实现。我需要在 Rect 之前完成此操作。请指导我，任何帮助将不胜感激。谢谢

这是我的代码片段

RectF rightButton = new RectF(itemView.getRight() - 
buttonWidthWithoutPadding, itemView.getTop(), itemView.getRight(), itemView.getBottom());
    p.setColor(Color.parseColor("#F44336"));
    c.drawRoundRect(rightButton, corners, corners, p);
    drawView("DELETE", c, rightButton, p); 


//draw view method
private void drawView(String text, Canvas c, RectF button, Paint p) {
    float textSize = 20;
    p.setColor(Color.WHITE);
    p.setAntiAlias(true);
    p.setTextSize(textSize);

    float textWidth = p.measureText(text);
    Bitmap bmp = drawableToBitmap(ContextCompat.getDrawable(mContext, R.drawable.delete_white_24dp));
    c.drawBitmap(bmp, button.centerX() - (bmp.getWidth() / 2), button.centerY() - (bmp.getHeight()/2), null);
    c.drawText(text, button.centerX() - (textWidth / 2), button.centerY() + bmp.getHeight(), p);
}

Expected output

My output (Not exactly in center also no space between image and text

Answer 1

在 drawView 中试试这个（而不是最后两行）：

float spaceHeight = 10; // change this to whatever looks good to you
Rect bounds = new Rect();
p.getTextBounds(text, 0, text.length(), bounds);
float combinedHeight = bmp.getHeight() + spaceHeight + bounds.height();
c.drawBitmap(bmp, button.centerX() - (bmp.getWidth() / 2), button.centerY() - (combinedHeight / 2), null);
c.drawText(text, button.centerX() - (textWidth / 2), button.centerY() + (combinedHeight / 2), p);

您想要图标+space+文本居中的组合，而不仅仅是图标。现在图标完美地位于中间，而文本由于只有图标的一半高，正好位于图标下方。

用图文在Rect上绘制canvas

Draw canvas on Rect with image and text

android

android-canvas