Java – although the property is set, the canvas is not drawn correctly

• Java

I just made two drawings and tried to make one look the same as the other, but I had no luck For screenshots, the top drawing is created using canvas and the bottom drawing is created using XML XML drawing is perfect for me, but unfortunately according to Android, I shouldn't use it because it returns the "too many views" warning I have tried the following methods to draw the canvas, but I still don't get the desired results

>Use different drawings according to the orientation of the device > use floating point values instead of integers > adjust floating values multiple times

Who knows what other options can solve this annoying canvas problem and ensure that canvas drawings look exactly like XML drawings, regardless of screen size and orientation? Should I ignore the "too many views" warning and / or increase my view limit to more than 80 in this scenario? All relevant help will be highly appreciated

Java code

http://pastebin.com/VXgkJR2Z

XML code

http://pastebin.com/JyVvxS5n

Solution

You can see the result of processing the code below It's almost similar to XML, but if you look at it with mignifier, you can find some differences

So there are some important things when you draw

>Don't use int. you're losing accuracy I replace all ints with float. > Careful cycling You also lose accuracy in the cycle

Common patterns in Code:

float @R_823_2419@Width = (getWidth() - mSideRectWidth) / 8; // I replaced int to float
for (int i = 0; i < 8; i++) {
    float position = i * @R_823_2419@Width; // loss of precision
    ...
}

It is best to calculate the position in the cycle:

for (int i = 0; i < 8; i++) {
    float position = i * (getWidth() - mSideRectWidth) / 8;
    ...
}

>Don't forget the stroke width You will miss this value when calculating the position of shapes and lines

This is my complete code:

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.RectF;
import android.text.TextPaint;
import android.util.AttributeSet;
import android.util.TypedValue;
import android.view.View;

public class Car extends View {
    private final Paint mBlackPaint = new Paint();
    private final Paint mRedPaint = new Paint();
    private final TextPaint mTextPaint;

    public static final int @R_823_2419@ES_COUNT = 8;

    private float oneDp;
    private float textSize;
    private float windowHeight;

    public Car(Context context,AttributeSet attrs) {
        super(context,attrs);
        oneDp = TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP,1,getResources().getDisplayMetrics());
        windowHeight = TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP,10,getResources().getDisplayMetrics());
        textSize = TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_SP,15,getResources().getDisplayMetrics());

        mRedPaint.setColor(Color.parseColor("#CC3333"));

        mBlackPaint.setAntiAlias(true);
        mBlackPaint.setColor(Color.BLACK);
        mBlackPaint.setstrokeWidth(oneDp);
        mBlackPaint.setStyle(Paint.Style.stroke);

        mTextPaint = new TextPaint(TextPaint.ANTI_ALIAS_FLAG);
        mTextPaint.setColor(Color.BLACK);
        mTextPaint.setTextAlign(Paint.Align.CENTER);
        mTextPaint.setTextSize(textSize);

        mWindowPaint = new Paint();
        mWindowPaint.setAntiAlias(true);
        mWindowPaint.setColor(Color.parseColor("#CC3333"));
        mWindowPaint.setStyle(Paint.Style.stroke);
        mWindowPaint.setstrokeWidth(oneDp);
    }

    private Paint mWindowPaint;
    RectF rect = new RectF();
    RectF rect2 = new RectF();

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);

        if (getWidth() == 0) return;

        int w = canvas.getWidth();
        int h = canvas.getHeight();

        //draw red rectangles
        float mSideRectWidth = TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP,5,getResources().getDisplayMetrics());
        canvas.drawRect(0,mSideRectWidth,getHeight(),mRedPaint); //draw left end rectangle
        canvas.drawRect(getWidth() - mSideRectWidth,getWidth(),mRedPaint); //draw right end rectangle

        //draw grey @R_823_2419@es
        setBackgroundColor(Color.parseColor("#808080"));

        for (int i = 0; i < @R_823_2419@ES_COUNT; i++) {
            float leftPosition = mSideRectWidth
                + i * oneDp
                + (getWidth() - mSideRectWidth * 2 - (@R_823_2419@ES_COUNT - 1) * oneDp) * i / @R_823_2419@ES_COUNT;
            float rightPosition = mSideRectWidth
                + i * oneDp
                + (getWidth() - mSideRectWidth * 2 - (@R_823_2419@ES_COUNT - 1) * oneDp) * (i + 1)
                / @R_823_2419@ES_COUNT;
            if (i == 0) {
                fillRectLeft(canvas,leftPosition,rightPosition,(i + 1) + "");
            } else if ( i == @R_823_2419@ES_COUNT - 1) {
                fillRectRight(canvas,(i + 1) + "");
            } else {
                fillRect(canvas,(i + 1) + "");
            }
        }

        //draw black lines
        for (int i = 1; i < @R_823_2419@ES_COUNT; i++) {
            float position = mSideRectWidth + (getWidth() - mSideRectWidth * 2) * i / @R_823_2419@ES_COUNT;
            canvas.drawLine(position,position,mBlackPaint);
        }
    }

    private void fillRect(Canvas canvas,float left,float right,String number) {
        rect.set(left + oneDp / 2,0 + oneDp / 2,right - oneDp / 2,getHeight() - oneDp / 2);
        float xPos = left + ((right - left) / 2);
        float yPos = (canvas.getHeight() / 2) - ((mTextPaint.descent() + mTextPaint.ascent()) / 2);
        //((textPaint.descent() + textPaint.ascent()) / 2) is the distance from the baseline to the center.
        canvas.drawText(number,xPos,yPos,mTextPaint);
        //canvas.drawRect(rect,mWindowPaint);

        // top row
        rect2.set(left + oneDp / 2,left + (right - left) * 20 / 100 - oneDp / 2,windowHeight - oneDp / 2);
        canvas.drawRect(rect2,mWindowPaint);
        rect2.set(left + (right - left) * 27 / 100 + oneDp / 2,left + (right - left) * 47 / 100 - oneDp / 2,mWindowPaint);
        rect2.set(left + (right - left) * 53 / 100 + oneDp / 2,left + (right - left) * 73 / 100 - oneDp / 2,mWindowPaint);
        rect2.set(left + (right - left) * 80 / 100 + oneDp / 2,left + (right - left) * 100 / 100 - oneDp / 2,mWindowPaint);

        // bottom row
        rect2.set(left + oneDp / 2,getHeight() - windowHeight + oneDp / 2,getHeight() - oneDp / 2);
        canvas.drawRect(rect2,mWindowPaint);
    }

    private void fillRectLeft(Canvas canvas,mWindowPaint);

        // top row
        rect2.set(left + (right - left) * 4 / 100 + oneDp / 2,left + (right - left) * 24 / 100 - oneDp / 2,mWindowPaint);
        rect2.set(left + (right - left) * 42 / 100 + oneDp / 2,left + (right - left) * 62 / 100 - oneDp / 2,mWindowPaint);

        // bottom row
        rect2.set(left + (right - left) * 4 / 100 + oneDp / 2,mWindowPaint);
    }

    private void fillRectRight(Canvas canvas,mWindowPaint);

        // top row
        rect2.set(left + (right - left) * 0 / 105 + oneDp / 2,left + (right - left) * 20 / 105 - oneDp / 2,mWindowPaint);
        rect2.set(left + (right - left) * 38 / 105 + oneDp / 2,left + (right - left) * 58 / 105 - oneDp / 2,mWindowPaint);
        rect2.set(left + (right - left) * 78 / 105 + oneDp / 2,left + (right - left) * 98 / 105 - oneDp / 2,mWindowPaint);

        // bottom row
        rect2.set(left + (right - left) * 0 / 105 + oneDp / 2,mWindowPaint);
    }
}

portrait

Scenery

The content of this article comes from the network collection of netizens. It is used as a learning reference. The copyright belongs to the original author.
THE END
分享
二维码
< <上一篇
下一篇>>