Android拼图游戏开发全纪录1
分享一下我老师大神的人工智能教程！零基础，通俗易懂！http://blog.csdn.net/jiangjunshow
也欢迎大家转载本篇文章。分享知识，造福人民，实现我们中华民族伟大复兴！
今天我们继续来讲解Android拼图游戏全纪录的第二篇，今天要完成的任务比较简单：界面布局和资源文件
1资源文件：
我们在开发一个项目的时候，首先要定下这个App的基调，是小清新呢还是重口味，所以我们需要定义一些颜色、style等
首先是颜色等：
xml version="1.0" encoding="utf-8"?><resources> <color name="app_bg">#000000color> <color name="title_text">#FFFFFFcolor> <color name="record_title_bg">#F56A47color> <color name="record_title_text">#FFFFFFcolor> <color name="record_title_text_dark">#727272color> <color name="main_bg">#3EC5FFcolor> <color name="main_text">#FFFFFFcolor> <color name="setting_reg_bg">#A2A2A2color> <color name="setting_text_light">#C3C3C3color> <color name="setting_text_dark">#111111color> <color name="tv_click">#33444444color>resources>以上就定义好了我们这个App的小清新的风格
然后是字符串资源，这个随意吧
xml version="1.0" encoding="utf-8"?><resources> <string name="app_name">XPuzzlestring> <string name="action_settings">Settingsstring> <string name="hello_world">Hello world!string> <string name="puzzle_main_type">选择难度：string> <string name="puzzle_main_steps">步数：string> <string name="puzzle_main_img">原 图string> <string name="puzzle_main_reset">重 置string> <string name="puzzle_main_back">返 回string> <string name="puzzle_main_time">时间：string> <string name="puzzle_main_type_selected">2 X 2string> <string name="puzzle_main_record">查看记录string> <string name="puzzle_main_more">了解更多string>resources>接下来是自定义的一个带Selector的Shape，这样Button使用这个背景后，就比较配合小清新的风格了
xml version="1.0" encoding="UTF-8"?><selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:state_pressed="true"><shape android:shape="rectangle"> <solid android:color="#33444444" /> <corners android:radius="5dip" /> <padding android:bottom="10dp" android:left="10dp" android:right="10dp" android:top="10dp" /> shape>item> <item><shape android:shape="rectangle"> <solid android:color="@color/title_text" /> <corners android:radius="5dip" /> <padding android:bottom="10dp" android:left="10dp" android:right="10dp" android:top="10dp" /> shape>item>selector>这个就是我们在前面图中看见的Button了，是不是很好看啊
嗯 还有个TextView的selector
xml version="1.0" encoding="utf-8"?><selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:drawable="@color/tv_click" android:state_pressed="true">item> <item android:drawable="@android:color/transparent">item>selector>下面我们就要开始实现我们的界面了：
首先是首页界面：
布局比较简单，相信大家都看得懂
xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:background="@color/main_bg" > <LinearLayout android:id="@+id/ll_puzzle_main_spinner" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerHorizontal="true" android:layout_margin="10dip" > <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" android:text="@string/puzzle_main_type" android:textColor="@color/main_text" android:textSize="@dimen/text_title" /> <TextView android:id="@+id/tv_puzzle_main_type_selected" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" android:background="@drawable/textview_click" android:text="@string/puzzle_main_type_selected" android:textColor="@color/main_text" android:textSize="@dimen/text_title" /> LinearLayout> <LinearLayout android:id="@+id/ll_xpuzzle_main_functions" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignLeft="@+id/gv_xpuzzle_main_pic_list" android:layout_alignParentBottom="true" android:gravity="center" android:layout_alignRight="@+id/gv_xpuzzle_main_pic_list" android:layout_margin="@dimen/padding" > <Button android:id="@+id/btn_puzzle_main_record" style="@style/btn_style" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="@dimen/padding" android:background="@drawable/white_button" android:text="@string/puzzle_main_record" /> <Button android:id="@+id/btn_puzzle_main_setting" style="@style/btn_style" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="@dimen/padding" android:background="@drawable/white_button" android:text="@string/puzzle_main_more" /> LinearLayout> <GridView android:id="@+id/gv_xpuzzle_main_pic_list" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_above="@id/ll_xpuzzle_main_functions" android:layout_below="@id/ll_puzzle_main_spinner" android:layout_centerHorizontal="true" android:layout_margin="@dimen/padding" android:gravity="center_horizontal" android:horizontalSpacing="@dimen/padding" android:numColumns="4" android:padding="@dimen/padding" android:verticalSpacing="@dimen/padding" > GridView>RelativeLayout>这就OK了。
里面的选择难度是一个popupwindow，所以还有个布局文件
这个。。so easy了
xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@android:color/transparent" android:orientation="horizontal" > <TextView android:id="@+id/tv_main_type_2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginRight="8dp" android:text="2x2" android:textColor="@color/main_text" android:textSize="@dimen/text_title_sub" /> <TextView android:id="@+id/tv_main_type_3" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginRight="8dp" android:text="3x3" android:textColor="@color/main_text" android:textSize="@dimen/text_title_sub" /> <TextView android:id="@+id/tv_main_type_4" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="4x4" android:textColor="@color/main_text" android:textSize="@dimen/text_title_sub" />LinearLayout>最后是拼图的布局界面：如下图
就是这样啦，其实界面也很简单
xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/rl_puzzle_main_main_layout" android:layout_width="match_parent" android:layout_height="match_parent" android:background="@color/main_bg" > <LinearLayout android:id="@+id/ll_puzzle_main_spinner" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_margin="@dimen/padding" android:gravity="center_horizontal" > <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" android:text="@string/puzzle_main_steps" android:textColor="@color/title_text" android:textSize="@dimen/text_title" /> <TextView android:id="@+id/tv_puzzle_main_counts" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" android:gravity="center" android:paddingRight="50dip" android:text="1" android:textColor="@color/title_text" android:textSize="@dimen/text_title" /> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" android:text="@string/puzzle_main_time" android:textColor="@color/title_text" android:textSize="@dimen/text_title" /> <TextView android:id="@+id/tv_puzzle_main_time" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" android:gravity="center" android:text="1" android:textColor="@color/title_text" android:textSize="@dimen/text_title" /> LinearLayout> <LinearLayout android:id="@+id/ll_puzzle_main_btns" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:layout_centerHorizontal="true" android:layout_margin="@dimen/padding" > <Button android:id="@+id/btn_puzzle_main_img" style="@style/btn_style" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="@dimen/padding" android:background="@drawable/white_button" android:text="@string/puzzle_main_img" /> <Button android:id="@+id/btn_puzzle_main_restart" style="@style/btn_style" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="@dimen/padding" android:background="@drawable/white_button" android:text="@string/puzzle_main_reset" /> <Button android:id="@+id/btn_puzzle_main_back" style="@style/btn_style" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="@dimen/padding" android:background="@drawable/white_button" android:text="@string/puzzle_main_back" /> LinearLayout> <GridView android:id="@+id/gv_puzzle_main_detail" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_above="@id/ll_puzzle_main_btns" android:layout_below="@id/ll_puzzle_main_spinner" android:layout_centerInParent="true" android:layout_margin="@dimen/padding" > GridView>RelativeLayout>好了，今天的东西都是些准备工作，所以比较简单。
给我老师的人工智能教程打call！http://blog.csdn.net/jiangjunshow
