5

Canvas Androidを使用して描画される、指定された境界とその長方形のテキスト内に塗りつぶされた長方形を描画するにはどうすればよいですか？私は試した

mPaint.setColor(Color.GREEN);
canvas.drawText(mText, x, y, mPaint);
mPaint.setColor(Color.BLACK);
canvas.drawRect(x, y, x + w, y + h, mPaint);

しかし、テキストはその長方形の内側にはありません。テキストサイズを考慮して、指定したテキストを囲む長方形を描く方法を教えてもらえますか？

4

3 に答える 3

14

ここでは、x値とy値をハードコーディングしています。あなたはそれらを変えることができます

        mpaint= new Paint();
        mpaint.setColor(Color.RED);
        mpaint.setStyle(Style.FILL);
        paint2= new Paint();
        paint2.setColor(Color.GREEN);
        paint2.setTextSize(50);  //set text size
        float w = paint2.measureText(s)/2;
        float textSize = paint2.getTextSize();


        @Override
        protected void onDraw(Canvas canvas) {
            paint2.setTextAlign(Paint.Align.CENTER);
            canvas.drawRect(300-w, 300 - textsize, 300 + w, 300, mpaint);
            canvas.drawText(s, 300, 300 ,paint2); //x=300,y=300    
        }

編集 ：

を呼び出すのは悪い考えmeasureTextですonDraw。の外でそれを行うことができますonDraw。

パフォーマンスと、での割り当てを避ける必要がある理由についてのビデオもありますonDraw。https://www.youtube.com/watch?v=HAK5acHQ53E

結果のスナップショット

ここに画像の説明を入力してください

于 2013-03-25T07:25:24.413 に答える
4

テキストをderectの中央に配置する必要がある場合は、このコードを使用します

    mpaint= new Paint();
    mpaint.setColor(Color.RED);
    mpaint.setStyle(Style.FILL);
    paint2= new Paint();
    paint2.setColor(Color.GREEN);
    paint2.setTextSize(50);  //set text size
    float w = paint2.measureText(s)/2;
    float textSize = paint2.getTextSize();


    @Override
    protected void onDraw(Canvas canvas) {
        paint2.setTextAlign(Paint.Align.CENTER);
        Rect rect = new Rect(300-w, 300 - textsize, 300 + w, 300);
        canvas.drawRect(rect, mpaint);
        canvas.drawText(s, rect.centerX(), rect.centerY() ,paint2); // center text inside rect
    }

ここに画像の説明を入力してください

于 2019-10-24T14:23:12.427 に答える
-1

これは、この特定のクエリでは非常に遅いかもしれませんが、多くの人がこの回答が役立つと思うでしょう。したがって、CustomViewのCanvasの問題は、特定のテキストの幅を取得できることですが、テキストの高さを取得するのはそれほど簡単ではありません。また、canvas.drawText(....)単純なペイントオブジェクトで使用している場合、複数行のテキストを描画することはできません。したがって、onDraw()メソッド内で以下のコードを使用してください。

String displayText = "Hello World";
int mainTextPositionX = getWidth() / 2 ;
int mainTextPositionY = getHeight() / 2;

StaticLayout textStaticLayout;
TextPaint textPaint;
textPaint = new TextPaint();
textPaint.setTextAlign(Paint.Align.CENTER);
textPaint.setColor(Color.BLUE);
textPaint.setAntiAlias(true);
textPaint.setTextSize(convertDpToPixel(30, context));
textPaint.setTextAlign(Paint.Align.CENTER);
highlightedRectPaint = new Paint();

highlightedRectPaint.setStrokeWidth(12);
highlightedRectPaint.setStyle(Paint.Style.STROKE);
highlightedRectPaint.setColor(Color.RED);
highlightedRectPaint.setAntiAlias(true);

if(android.os.Build.VERSION.SDK_INT >= android.os.Build.VERSION_CODES.M) {
        textStaticLayout = StaticLayout
                .Builder
                .obtain(displayText, 0, displayText.length(), textPaint, (int) textPaint.measureText(displayText))
                .build();
    }else{
        textStaticLayout = new StaticLayout(
                displayText, textPaint, (int)textPaint.measureText(displayText), Layout.Alignment.ALIGN_CENTER, 1.0f, 0.0f, false);
    }

    Rect highlightedTextBorderRect = new Rect();
    highlightedTextBorderRect.top = mainTextPositionY-20;
    highlightedTextBorderRect.left = mainTextPositionX- 
    ((int)textPaint.measureText(displayText)/2)-20;
    highlightedTextBorderRect.right = mainTextPositionX+ 
    ((int)textPaint.measureText(displayText)/2) + 20;
    highlightedTextBorderRect.bottom = mainTextPositionY+ 
    (int)textStaticLayout.getHeight()+20;

    canvas.save();
    canvas.translate(mainTextPositionX, mainTextPositionY);
    textStaticLayout.draw(canvas);
    canvas.restore();

    canvas.drawRect(highlightedTextBorderRect,highlightedRectPaint);

メソッドの外部ですべてのオブジェクトと変数を宣言していることを確認してくださいdraw()。そして、これは複数行をサポートするテキストの周りに長方形の輪郭を描画します。長方形に塗りつぶしを含める場合は、highlightedRectPaintを使用してを変更しsetStyle(Paint.Style.FILL)ます。お役に立てば幸いです。

于 2018-11-17T02:10:46.130 に答える