Android开发实例-高校录取分数线应用(二)

浏览数：20 / 时间：2015年06月11日

本系列文章提供简单Android应用开发实例方法，文章步骤如下所示：

1 获取应用所需的数据源

数据源一般来源于互联网、个人搜集或者其他方式

2 应用UI设计

每个应用软件都需要有一个简单的UI设计草图，便于开发者更好的实现编码

3 应用实现

实现完整的Android应用

特此说明：本系列文章的数据源均采用互联网方式获取，仅作为示例演示

应用介绍

提供各个高校历届的分数线录取查询功能，作为高考学子填写志愿的参考应用。

一、UI原型设计

根据Android开发实例-高校录取分数线应用(一)中的数据源获取，我们了解到查询共分为四个条件：学校所在省份、学校、用户所在地、文理科，查询结果为历届录取分数线的列表信息。

我们利用AxureRp进行基本的原型设计，设计原型图如下所示：

以上依次为：查询结果UI界面，选择省份下拉弹窗，选择学校下拉弹窗和选择科室下拉弹窗

二、Android UI布局实现

在实际实现中，我们不关心色调搭配，仅关心各个控件的布局信息。下面给出几个UI的简要描述：

四个选择条件，采用四分局方式布局
结果显示采用ListView自定义Item布局
每个条件选择弹窗采用PopupWindow实现

1 主布局控件(activity_main.xml)

先给出布局控件在Eclipse ADT中的预览效果：

我们把布局分为四个部分：标题栏，条件栏，查询按钮和结果栏

标题栏

采用填满父控件的TextView实现，并指定高度和背景等信息

<TextView
        android:layout_width="match_parent"
        android:layout_height="45dp"
        android:background="@drawable/title_bg"
        android:gravity="center"
        android:text="@string/app_name"
        android:textColor="@color/white"
        android:textSize="16sp" />

条件栏

采用LinearLayout实现四分局布局，每个按钮的右下角提供一个下拉箭头作为提示

<LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@color/white"
        android:orientation="horizontal"
        android:paddingRight="5dp" >

        <LinearLayout
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@drawable/selector_btn_text"
            android:gravity="center_horizontal"
            android:orientation="horizontal" >

            <TextView
                android:id="@+id/prov1_sel"
                android:layout_width="match_parent"
                android:layout_height="40dip"
                android:drawableRight="@drawable/selector_arrow_dropdown"
                android:gravity="center"
                android:text="@string/sel1"
                android:textColor="@color/green"
                android:textSize="14.0sp" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@drawable/selector_btn_text"
            android:gravity="center_horizontal"
            android:orientation="horizontal" >

            <TextView
                android:id="@+id/school_sel"
                android:layout_width="match_parent"
                android:layout_height="40dip"
                android:drawableRight="@drawable/selector_arrow_dropdown"
                android:ellipsize="marquee"
                android:focusable="true"
                android:focusableInTouchMode="true"
                android:gravity="center"
                android:lines="1"
                android:singleLine="true"
                android:text="@string/sel2"
                android:textColor="@color/green"
                android:textSize="14.0sp" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@drawable/selector_btn_text"
            android:gravity="center_horizontal"
            android:orientation="horizontal" >

            <TextView
                android:id="@+id/type_sel"
                android:layout_width="match_parent"
                android:layout_height="40dip"
                android:drawableRight="@drawable/selector_arrow_dropdown"
                android:gravity="center"
                android:text="@string/sel3"
                android:textColor="@color/green"
                android:textSize="14.0sp" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@drawable/selector_btn_text"
            android:gravity="center_horizontal"
            android:orientation="horizontal" >

            <TextView
                android:id="@+id/prov2_sel"
                android:layout_width="match_parent"
                android:layout_height="40dip"
                android:drawableRight="@drawable/selector_arrow_dropdown"
                android:gravity="center"
                android:text="@string/sel4"
                android:textColor="@color/green"
                android:textSize="14.0sp" />
        </LinearLayout>
    </LinearLayout>

查询按钮

<Button
        android:id="@+id/query_btn"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="5dp"
        android:background="@drawable/selector_btn"
        android:gravity="center"
        android:padding="10dp"
        android:text="@string/button_query"
        android:textColor="@color/white"
        android:textSize="16sp" />

结果栏

在结果栏中，我们除了提供一个LinearLayout作为结果控件，还提供一个TextView作为整个逻辑的提示控件。TextView和LinearLayout同一时间仅显示一个

<TextView
        android:id="@+id/text_tip"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@color/white"
        android:gravity="center"
        android:text="@string/tip1"
        android:textColor="@color/gray"
        android:textSize="16sp" />

    <LinearLayout
        android:id="@+id/layout_result"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        android:visibility="gone" >

        <TextView
            android:id="@+id/text_result"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:ellipsize="marquee"
            android:focusable="true"
            android:focusableInTouchMode="true"
            android:gravity="left"
            android:lines="1"
            android:padding="10dp"
            android:singleLine="true"
            android:textSize="16sp" />

        <View
            android:layout_width="match_parent"
            android:layout_height="0.5px"
            android:background="@color/lightgray" />

        <ListView
            android:id="@+id/list_result"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@color/white"
            android:cacheColorHint="#00000000"
            android:divider="@color/gray"
            android:dividerHeight="0.5px"
            android:orientation="vertical"
            android:scrollbars="none" />
    </LinearLayout>

完整布局xml如下所示：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/white"
    android:orientation="vertical"
    tools:context=".MainActivity" >

    <TextView
        android:layout_width="match_parent"
        android:layout_height="45dp"
        android:background="@drawable/title_bg"
        android:gravity="center"
        android:text="@string/app_name"
        android:textColor="@color/white"
        android:textSize="16sp" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@color/white"
        android:orientation="horizontal"
        android:paddingRight="5dp" >

        <LinearLayout
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@drawable/selector_btn_text"
            android:gravity="center_horizontal"
            android:orientation="horizontal" >

            <TextView
                android:id="@+id/prov1_sel"
                android:layout_width="match_parent"
                android:layout_height="40dip"
                android:drawableRight="@drawable/selector_arrow_dropdown"
                android:gravity="center"
                android:text="@string/sel1"
                android:textColor="@color/green"
                android:textSize="14.0sp" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@drawable/selector_btn_text"
            android:gravity="center_horizontal"
            android:orientation="horizontal" >

            <TextView
                android:id="@+id/school_sel"
                android:layout_width="match_parent"
                android:layout_height="40dip"
                android:drawableRight="@drawable/selector_arrow_dropdown"
                android:ellipsize="marquee"
                android:focusable="true"
                android:focusableInTouchMode="true"
                android:gravity="center"
                android:lines="1"
                android:singleLine="true"
                android:text="@string/sel2"
                android:textColor="@color/green"
                android:textSize="14.0sp" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@drawable/selector_btn_text"
            android:gravity="center_horizontal"
            android:orientation="horizontal" >

            <TextView
                android:id="@+id/type_sel"
                android:layout_width="match_parent"
                android:layout_height="40dip"
                android:drawableRight="@drawable/selector_arrow_dropdown"
                android:gravity="center"
                android:text="@string/sel3"
                android:textColor="@color/green"
                android:textSize="14.0sp" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@drawable/selector_btn_text"
            android:gravity="center_horizontal"
            android:orientation="horizontal" >

            <TextView
                android:id="@+id/prov2_sel"
                android:layout_width="match_parent"
                android:layout_height="40dip"
                android:drawableRight="@drawable/selector_arrow_dropdown"
                android:gravity="center"
                android:text="@string/sel4"
                android:textColor="@color/green"
                android:textSize="14.0sp" />
        </LinearLayout>
    </LinearLayout>

    <Button
        android:id="@+id/query_btn"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="5dp"
        android:background="@drawable/selector_btn"
        android:gravity="center"
        android:padding="10dp"
        android:text="@string/button_query"
        android:textColor="@color/white"
        android:textSize="16sp" />

    <TextView
        android:id="@+id/text_tip"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@color/white"
        android:gravity="center"
        android:text="@string/tip1"
        android:textColor="@color/gray"
        android:textSize="16sp" />

    <LinearLayout
        android:id="@+id/layout_result"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        android:visibility="gone" >

        <TextView
            android:id="@+id/text_result"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:ellipsize="marquee"
            android:focusable="true"
            android:focusableInTouchMode="true"
            android:gravity="left"
            android:lines="1"
            android:padding="10dp"
            android:singleLine="true"
            android:textSize="16sp" />

        <View
            android:layout_width="match_parent"
            android:layout_height="0.5px"
            android:background="@color/lightgray" />

        <ListView
            android:id="@+id/list_result"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@color/white"
            android:cacheColorHint="#00000000"
            android:divider="@color/gray"
            android:dividerHeight="0.5px"
            android:orientation="vertical"
            android:scrollbars="none" />
    </LinearLayout>

</LinearLayout>

2 弹窗列表控件(pop_list.xml和popl_list.item.xml)

每个条件选择框，采用PopupWindow弹出，列表布局如下所示：

<?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="match_parent"
    android:orientation="vertical"
    android:baselineAligned="false" >

    <ListView
        android:id="@+id/pop_list"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginLeft="10dp"
        android:layout_marginRight="10dp"
        android:background="@color/white"
        android:cacheColorHint="#00000000"
        android:divider="@color/gray"
        android:dividerHeight="0.5px"
        android:orientation="vertical"
        android:scrollbars="none" />
</LinearLayout>

每个Item的布局如下所示：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:paddingLeft="20dp"
    android:paddingRight="20dp" >

    <TextView
        android:id="@+id/pop_list_item_name"
        android:layout_width="wrap_content"
        android:layout_height="45.0dip"
        android:layout_gravity="center_vertical"
        android:gravity="center_vertical"
        android:singleLine="true"
        android:textColor="@color/black"
        android:textSize="14sp" />

</LinearLayout>

3 结果集列表Item控件(result_item.xml)

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal" >

    <TextView
        android:id="@+id/result_item_year"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_margin="5dp"
        android:gravity="center_vertical"
        android:textColor="@color/author_text"
        android:textSize="18sp" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_margin="5dp"
        android:orientation="vertical" >

        <LinearLayout
            android:layout_width="match_parent"
            android:orientation="horizontal"
            android:layout_height="0dp"
            android:layout_weight="1" >

            <TextView
                android:id="@+id/result_item_max"
                style="@style/result_text_highlight"
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1" />
            <TextView
                android:id="@+id/result_item_avg"
                style="@style/result_text_highlight"
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1" />
            <TextView
                android:id="@+id/result_item_real"
                style="@style/result_text_highlight"
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1" />
        </LinearLayout>
        <LinearLayout
            android:layout_width="match_parent"
            android:orientation="horizontal"
            android:layout_height="0dp"
            android:layout_weight="1" >

            <TextView
                style="@style/result_text"
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:text="@string/result_max"
                android:layout_weight="1" />
            <TextView
                style="@style/result_text"
                android:text="@string/result_avg"
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1" />
            <TextView
                android:text="@string/result_real"
                style="@style/result_text"
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1" />
        </LinearLayout>
        <LinearLayout
            android:layout_width="match_parent"
            android:orientation="horizontal"
            android:layout_height="0dp"
            android:layout_weight="1" >
            <TextView
                android:id="@+id/result_item_persons"
                style="@style/result_text_highlight"
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1" />
            <TextView
                android:id="@+id/result_item_pici"
                style="@style/result_text_highlight"
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1" />
            <TextView
                android:id="@+id/result_item_xiancha"
                style="@style/result_text_highlight"
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1" />
        </LinearLayout>
        <LinearLayout
            android:layout_width="match_parent"
            android:orientation="horizontal"
            android:layout_height="0dp"
            android:layout_weight="1" >

            <TextView
                style="@style/result_text"
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:text="@string/result_persons"
                android:layout_weight="1" />
            <TextView
                style="@style/result_text"
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:text="@string/result_pici"
                android:layout_weight="1" />
            <TextView
                style="@style/result_text"
                android:text="@string/result_xiancha"
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1" />
        </LinearLayout>
    </LinearLayout>

</LinearLayout>

郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。

Android开发实例-高校录取分数线应用(二)