连连看的游戏界面十分简单，大致可以分为两个区域：
--游戏主界面区
--控制按钮和数据显示区
1、开发界面布局
本程序使用一个RelativeLayout作为整体的界面布局元素，界面布局上面是一个自定义组件，下面是一个水平排列的LinearLayout。
下面是本程序的布局文件：/res/layout/main.xml
其中指定按钮背景色使用了@drawable/button_selector,这是在res/drawable目录下配置的StateListDrawable对象，配置文件代码如下：res/drawable/button_selector.xml
2、开发游戏界面组件
本游戏采用了一个自定义View:GameView，它从View的基类派生出来，这个自定义View的功能就是根据游戏状态来描绘游戏界面上的全部方块。
为了开发这个GameView，本程序还提供了一个Piece类，一个Piece对象代表游戏界面中的一个方块，它除了封装了方块上的图片之外，还需要封装该方块代表二维数组中的那个元素，也需要封装它的左上角在游戏界面中的X、Y坐标,这X、Y坐标可以决定方块的绘制位置，GameView根据这两个坐标值绘制全部方块即可。
下面是Piece类的代码：cnoyplinkviewPiece.java
package cn.oyp.link.view;
import android.graphics.Point;
public class Piece {
private PieceImage pieceImage;
private int beginX;
private int beginY;
private int indexX;
private int indexY;
public Piece(int indexX, int indexY) {
this.indexX = indexX;
this.indexY = indexY;
}
public Point getCenter() {
return new Point(getBeginX() + getPieceImage().getImage().getWidth()
/ 2, getBeginY() + getPieceImage().getImage().getHeight() / 2);
}
public boolean isSameImage(Piece otherPieceImage) {
if (pieceImage == null) {
if (otherPieceImage.pieceImage != null)
return false;
}
// 当两个Piece封装图片资源ID相同时，即可认为这两个Piece上的图片相同。
return pieceImage.getImageId() == otherPieceImage.pieceImage
.getImageId();
}
public int getBeginX() {
return beginX;
}
public void setBeginX(int beginX) {
this.beginX = beginX;
}
public int getBeginY() {
return beginY;
}
public void setBeginY(int beginY) {
this.beginY = beginY;
}
public int getIndexX() {
return indexX;
}
public void setIndexX(int indexX) {
this.indexX = indexX;
}
public int getIndexY() {
return indexY;
}
public void setIndexY(int indexY) {
this.indexY = indexY;
}
public PieceImage getPieceImage() {
return pieceImage;
}
public void setPieceImage(PieceImage pieceImage) {
this.pieceImage = pieceImage;
}
}
上面Piece类中封装的PieceImage代表了该方块上的图片，它封装了两个信息：Bitmap对象和图片资源ID。其中Bitmap对象用于在游戏界面上绘制方块；而图片资源ID则表示该Piece对象的标识，当两个Piece所封装的图片资源ID相等时，即可认为这两个Piece上的图片相同。
下面是PieceImage的代码：cnoyplinkviewPieceImage.java
package cn.oyp.link.view;
import android.graphics.Bitmap;
public class PieceImage {
private Bitmap image;
private int imageId;
public PieceImage(Bitmap image, int imageId) {
super();
this.image = image;
this.imageId = imageId;
}
public Bitmap getImage() {
return image;
}
public void setImage(Bitmap image) {
this.image = image;
}
public int getImageId() {
return imageId;
}
public void setImageId(int imageId) {
this.imageId = imageId;
}
}
GameView主要就是根据游戏的状态来绘制界面上的方块，GameView继承了View组件，重写了View组件上的onDraw(Canvas canvas)方法，重写该方法主要就是绘制游戏里剩余的方块，除此之外，它还复杂绘制连接方块的连接线。GameView的代码如下：cnoyplinkviewGameView.java
package cn.oyp.link.view;
import java.util.List;
import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Point;
import android.util.AttributeSet;
import android.view.View;
import cn.oyp.link.board.GameService;
import cn.oyp.link.utils.ImageUtil;
import cn.oyp.link.utils.linkInfo;
public class GameView extends View {
private GameService gameService;
private Piece selectedPiece;
private linkInfo linkInfo;
private Paint paint;
private Bitmap selectImage;
public GameView(Context context, AttributeSet attrs) {
super(context, attrs);
this.paint = new Paint();
// 设置连接线的颜色
this.paint.setColor(Color.RED);
// 设置连接线的粗细
this.paint.setStrokeWidth(3);
// 初始化被选中的图片
this.selectImage = ImageUtil.getSelectImage(context);
}
public void setlinkInfo(linkInfo linkInfo) {
this.linkInfo = linkInfo;
}
public void setSelectedPiece(Piece piece) {
this.selectedPiece = piece;
}
public void setGameService(GameService gameService) {
this.gameService = gameService;
}
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
if (this.gameService == null)
return;
Piece[][] pieces = gameService.getPieces();
if (pieces != null) {
// 遍历pieces二维数组
for (int i = 0; i < pieces.length; i++) {
for (int j = 0; j < pieces[i].length; j++) {
// 如果二维数组中该元素不为空（即有方块），将这个方块的图片画出来
if (pieces[i][j] != null) {
// 得到这个Piece对象
Piece piece = pieces[i][j];
// 根据方块左上角X、Y座标绘制方块
canvas.drawBitmap(piece.getPieceImage().getImage(),
piece.getBeginX(), piece.getBeginY(), null);
}
}
}
}
// 如果当前对象中有linkInfo对象, 即连接信息
if (this.linkInfo != null) {
// 绘制连接线
drawLine(this.linkInfo, canvas);
// 处理完后清空linkInfo对象
this.linkInfo = null;
}
// 画选中标识的图片
if (this.selectedPiece != null) {
canvas.drawBitmap(this.selectImage, this.selectedPiece.getBeginX(),
this.selectedPiece.getBeginY(), null);
}
}
private void drawLine(linkInfo linkInfo, Canvas canvas) {
// 获取linkInfo中封装的所有连接点
List points = linkInfo.getlinkPoints();
// 依次遍历linkInfo中的每个连接点
for (int i = 0; i < points.size() - 1; i++) {
// 获取当前连接点与下一个连接点
Point currentPoint = points.get(i);
Point nextPoint = points.get(i + 1);
// 绘制连线
canvas.drawLine(currentPoint.x, currentPoint.y, nextPoint.x,
nextPoint.y, this.paint);
}
}
// 开始游戏方法
public void startGame() {
this.gameService.start();
this.postInvalidate();
}
}
linkInfo是一个非常简单的工具类，它用于封装两个方块之间的连接信息：其实就是封装了一个List,List里面保存了连接线所需要经过的点。两个方块之间最多只能用3条线段相连，也就是说最多只能2个拐点，加上这两个方块的中心，方块的连接信息最多只需要4个连接点。因此，linkInfo最多需要封装4个连接点，最少需要封装2个连接点。
下面是linkInfo的代码：cnoyplinkutils.linkInfo.java
package cn.oyp.link.utils;
import java.util.List;
import java.util.ArrayList;
import android.graphics.Point;
public class linkInfo {
private List points = new ArrayList();
public linkInfo(Point p1, Point p2) {
// 加到集合中去
points.add(p1);
points.add(p2);
}
public linkInfo(Point p1, Point p2, Point p3) {
points.add(p1);
points.add(p2);
points.add(p3);
}
public linkInfo(Point p1, Point p2, Point p3, Point p4) {
points.add(p1);
points.add(p2);
points.add(p3);
points.add(p4);
}
public List getlinkPoints() {
return points;
}
}
关于具体的实现步骤，请参考下面的链接：
我的Android进阶之旅------>Android疯狂连连看游戏的实现之游戏效果预览(一)
我的Android进阶之旅------>Android疯狂连连看游戏的实现之状态数据模型(三)
我的Android进阶之旅------>Android疯狂连连看游戏的实现之加载界面图片和实现游戏Activity(四)
我的Android进阶之旅------>Android疯狂连连看游戏的实现之实现游戏逻辑(五)
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持考高分网。
