Android Studio贪吃蛇开发：将圆形Tiles替换为方形的实现问题

我帮你排查了代码里的问题，核心错误是canvas.drawRect()的参数填错了，导致布局完全混乱。

问题根源 #

drawRect()的正确参数顺序是：left, top, right, bottom，分别对应矩形的左、上、右、下边界坐标。而你写的canvas.drawRect(x*tileSizeX,tileSizeY*x,tileSizeY*y, x, mPaint)完全搞混了变量对应关系，甚至把索引x直接当成了坐标值，这肯定会出问题。

修正方案 #

把drawRect()的参数替换成正确的坐标计算方式，同时保持和原圆形Tile一致的网格对齐逻辑：

// 替换原来的drawRect行
canvas.drawRect(
    x * tileSizeX,          // 左边界：横向索引x乘以单个tile的宽度
    y * tileSizeY,          // 上边界：纵向索引y乘以单个tile的高度
    x * tileSizeX + tileSizeX,  // 右边界：左边界加上tile宽度
    y * tileSizeY + tileSizeY,  // 下边界：上边界加上tile高度
    mPaint
);

完整修正后的SnakeView类代码 #

public class SnakeView extends View { 
    private Paint mPaint = new Paint(); 
    private TileType snakeViewMap[][]; 

    public SnakeView(Context context, @Nullable AttributeSet attrs) { 
        super(context, attrs); 
        // 给Paint加抗锯齿，让方形边缘更平滑
        mPaint.setAntiAlias(true);
    } 

    public void setSnakeViewMap (TileType[][] map){ 
        this.snakeViewMap = map; 
    } 

    @Override 
    protected void onDraw (Canvas canvas){ 
        super.onDraw(canvas); 
        if (snakeViewMap != null) { 
            float tileSizeX = (float) canvas.getWidth() / snakeViewMap.length; 
            float tileSizeY = (float) canvas.getHeight() / snakeViewMap[0].length; 

            for (int x=0; x < snakeViewMap.length; x++) { 
                for (int y = 0; y < snakeViewMap[x].length; y++) { 
                    switch (snakeViewMap[x][y]) { 
                        case Nothing: 
                            mPaint.setColor(Color.BLACK); 
                            break; 
                        case Wall: 
                            mPaint.setColor(Color.GREEN); 
                            break; 
                        case SnakeHead: 
                            mPaint.setColor(Color.RED); 
                            break; 
                        case SnakeTail: 
                            mPaint.setColor(Color.GREEN); 
                            break; 
                        case Apple: 
                            mPaint.setColor(Color.RED); 
                            break; 
                    } 
                    // 修正后的drawRect调用
                    canvas.drawRect(
                        x * tileSizeX,
                        y * tileSizeY,
                        x * tileSizeX + tileSizeX,
                        y * tileSizeY + tileSizeY,
                        mPaint
                    ); 
                } 
            } 
        } 
    } 
}

额外优化建议 #

• 我给Paint加了setAntiAlias(true)，可以让方形的边缘更平滑，避免出现锯齿。
• 注意tileSizeX和tileSizeY的计算用了(float)强制转换，避免整数除法导致的精度丢失（比如宽度不能被格子数整除时，会出现布局偏移）。

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