安致连连看实现.docVIP

18.2 开发游戏界面 连连看的游戏界面十分简单，大致上可分为两个区域： 游戏主界面区。 控制按钮与数据显示区。 ((18.2.1 开发界面布局 本程序将会使用一个RelativeLayout作为整体的界面布局元素，界面布局的上面是一个自定义组件，下面是一个水平排列的LinearLayout。 程序清单：codes\18\Link\res\layout\main.xml ?xml version=1.0 encoding=utf-8? RelativeLayout xmlns:android=/apk/res/android android:layout_width=fill_parent android:layout_height=fill_parent android:background=@drawable/room !-- 游戏主界面的自定义组件 -- org.crazyit.link.view.GameView android:id=@+id/gameView android:layout_width=fill_parent android:layout_height=fill_parent / !-- 水平排列的LinearLayout -- LinearLayout android:layout_width=fill_parent android:layout_height=fill_parent android:orientation=horizontal android:layout_marginTop=380px android:background=#1e72bb android:gravity=center !-- 控制游戏开始的按钮 -- Button android:id=@+id/startButton android:layout_width=wrap_content android:layout_height=wrap_content android:background=@drawable/button_selector / !-- 显示游戏剩余时间的文本框 -- TextView android:id=@+id/timeText android:layout_width=wrap_content android:layout_height=wrap_content android:gravity=center android:textSize=20dip android:width=150px android:textColor=#ff9 / /LinearLayout /RelativeLayout 这个界面布局很简单，指定按钮的背景色时使用了@drawable/button_selector，这是一个在res\drawable目录下配置的StateListDrawable对象，配置文件代码如下。 程序清单：codes\18\Link\res\drawable-mdpi\button_selector.xml ?xml version=1.0 encoding=UTF-8? selector xmlns:android=/apk/res/android !-- 指定按钮按下时的图片 -- item android:state_pressed=true android:drawable=@drawable/start_down / !-- 指定按钮松开时的图片 -- item android:state_pressed=false android:drawable=@drawable/start / /selector 其中GameView只是一个View的普通子类，开发了上面的界面布局文件之后，运行该程序将可以看到如图18.3所示的界面。 ((18.2.2 开发游戏界面组件 本游戏的界面组件采用了一个自定义View：GameView，它从View基类派生而出，这个自定义View的功能就是根据游戏状态来绘制游戏界面上的全部方块。 为了开发这个GameView，本程序还提供了一个Piece类，一个Piece对象代表游戏界面上的一个方块，它除了封装方块上的图片之外，还需要封装该方块代表二维数组中的哪个元素；也需要封装它的左上角在游戏界面中X、Y坐标。图18.4示意了方块左上角的X、Y坐标的作用。 图18.3 游戏布局 图18.4 方块的左上角 方块左上角的X、Y坐标可决定它的绘制位置，GameView根据这两个坐标值绘制全部方块即可。下面是该程序中Piece类的代码。