Android开发日记(二) 教室数据展示与筛选

一、数据展示

由于目前的设计只是简单的展示教室名以及当前人数情况，单条数据中也没有要额外设置点击的控件，所以用简单的listview即可实现

创建Room类, 包含一条教室数据的所有信息

public class Room {
    
    
    private String Cbuilding;    // 教学楼名
    private String Cno;    // 教室号
    private String Cnum;    // 教室当前人数
    private String Csit;    // 教室总座位数
    private String Cfloor;    // 教室所在楼层
    private String Course1;    // 教室上午前两节课
    private String Course2;    // 教室上午后两节课
    private String Course3;    // 教室下午前两节课
    private String Course4;    // 教室下午后两节课
    private String Course5;    // 教室晚上前两节课

    Room(String Cbuilding, String Cno, String Cnum, String Csit, String Cfloor, String Course1, String Course2, String Course3, String Course4, String Course5){
    
    
        this.Cbuilding = Cbuilding;
        this.Cno = Cno;
        this.Cnum = Cnum;
        this.Csit = Csit;
        this.Cfloor = Cfloor;
        this.Course1 = Course1;
        this.Course2 = Course2;
        this.Course3 = Course3;
        this.Course4 = Course4;
        this.Course5 = Course5;
    }

    String getRoomName(){
    
    
        return Cbuilding + "-" + Cno;    // 教学楼名-教室号
    }

    String getPeopleNum(){
    
    
        return Cnum + "/" + Csit;    // 当前人数/总座位数
    }

}

指定单条数据的布局样式

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="50dp"
    >

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:layout_marginStart="20dp"
        android:layout_centerVertical="true"
        android:gravity="center"
        android:paddingTop="10dp"
        android:paddingBottom="10dp"
        >

        <TextView
            android:id="@+id/room_name"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textColor="#000000"
            android:textSize="16sp"
            />

    </LinearLayout>

    <TextView
        android:id="@+id/people_num"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentEnd="true"
        android:layout_marginEnd="10dp"
        android:layout_centerVertical="true"
        android:gravity="center"
        android:textSize="14sp"
        android:textColor="#000000"
        tools:ignore="RelativeOverlap" />

</RelativeLayout>

创建自定义适配器来关联ListView和数据

public class RoomAdapter extends ArrayAdapter<Room> {
    
    
    private int resourceId;

    RoomAdapter(Context context, int textViewresourceId, List<Room> objects){
    
    
        super(context, textViewresourceId, objects);
        resourceId = textViewresourceId;
    }
	// 使用ViewHolder对控件实例进行缓存, 提高运行效率
    class ViewHolder{
    
    
        TextView roomName;
        TextView peopleNum;
    }

    @NonNull
    @Override
    public View getView(int position, View convertView, @NonNull ViewGroup parent) {
    
    
        Room room = getItem(position);
        View view;
        ViewHolder viewHolder;

		// convertView缓存之前加载的布局, 便于重用, 提高效率
        if (convertView == null){
    
    
            view = LayoutInflater.from(getContext()).inflate(resourceId, parent, false);
            viewHolder = new ViewHolder();
            viewHolder.roomName = view.findViewById(R.id.room_name);
            viewHolder.peopleNum = view.findViewById(R.id.people_num);
            view.setTag(viewHolder);
        }else {
    
    
            view = convertView;
            viewHolder = (ViewHolder) view.getTag();

        }
        viewHolder.roomName.setText(room.getRoomName());
        viewHolder.peopleNum.setText(room.getPeopleNum());
        return view;
    }
}

在Activity中加载数据, 先自定义一些数据, 这应该是一个Room列表, 然后加载即可

private List<Room> roomList;
private RoomAdapter roomAdapter;

roomList = new ArrayList<>();
roomAdapter = new RoomAdapter(this, R.layout.item_room, roomList);
roomListView.setAdapter(roomAdapter);

下拉刷新非常符合用户的操作习惯, 实现起来也比较简单, 首先在需要下拉刷新的控件(ListView)外嵌套一层 SwipeRefreshLayout ,然后在Activity中设置下拉监听即可

<android.support.v4.widget.SwipeRefreshLayout
    android:id="@+id/swipe_refresh"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    >
	<ListView
	    android:id="@+id/room_list"
	    android:layout_width="match_parent"
	    android:layout_height="match_parent"
	    />
</android.support.v4.widget.SwipeRefreshLayout>

private SwipeRefreshLayout swipeRefresh;
swipeRefresh = findViewById(R.id.swipe_refresh);
swipeRefresh.setColorSchemeResources(R.color.colorAccent);
// 教室列表下拉刷新
swipeRefresh.setOnRefreshListener(new SwipeRefreshLayout.OnRefreshListener() {
    
    
    @Override
    public void onRefresh() {
    
    
        updateRoomData();
        swipeRefresh.setRefreshing(false);
    }
});

二、数据筛选

Android的Spinner控件可以很轻松地实现下拉菜单效果，它包含两个组件，一个是自身的Spinner，另一个是v7包提供的AppCompatSpinner，使用AppCompatSpinner可以获得比较好的兼容性

Spinner的数据源（下拉菜单的内容）可以在布局的时候引入在xml文件中定义的数据，这种方式比较死板并且数据源只能是string，所以一般在代码中设置数据源与显示效果

筛选功能可以放在客户端也可以放在服务器端进行, 但是为了及时的更新教室情况, 质控小老弟将筛选功能放到了服务器端, 所以客户端只需要在每次筛选之后向服务器发送请求获取最新数据然后更新ui就行了

在布局文件中引入AppCompatSpinner

<android.support.v7.widget.AppCompatSpinner
		android:id="@+id/spinner1"
		android:theme="@style/Base.Widget.AppCompat.DropDownItem.Spinner"
		android:layout_width="0dp"
		android:layout_height="30dp"
		android:layout_weight="1"
		android:overlapAnchor="false"
		android:dropDownWidth="1000dp"
		>
</android.support.v7.widget.AppCompatSpinner>

spinner下拉的时候我觉得宽度占满屏幕空间比较好, 但是设置android:dropDownWidth="match_parent"不知道为什么没有作用, 索性设置为1000dp了, 效果还不错

自定义已选择和下拉菜单中的文字样式

layout/item_select.xml

<?xml version="1.0" encoding="utf-8"?>
<TextView
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginStart="40dp"
    android:textSize="14sp"
    />

layout/item_drop.xml

<?xml version="1.0" encoding="utf-8"?>
<TextView
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:padding="10dp"
    android:gravity="center"
    android:textSize="16sp"
    android:textColor="#000000"
    />

代码中设置数据源以及添加监听（这里菜单项为简单的string）

这里有一个问题就是spinner在初始化的时候会默认选择第一项, 而且同时会触发选择事件监听, 再加上自己加的初始化完成后的请求事件, 初始化的时候会请求服务器4次! 所以必须想办法消除spinner初始化时的默认选择或者默认选择的时候不触发监听事件, 查找了一些解决办法都失效, 最后决定使用三个标志位来分别判断每个spinner的首次选择, 消除初始化请求

// 用于消除spinner初始化时默认的选择事件
private static boolean spinnerSelectedFirst1=true;
private static boolean spinnerSelectedFirst2=true;
private static boolean spinnerSelectedFirst3=true;
// 用于记录spinner当前的选择
private static String spinnerSelect1;
private static String spinnerSelect2;
private static String spinnerSelect3;

final String[] itmes1 = {
    
    "教学楼", "北1", "北2", "北3", "北4", "北5", "南1", "南2", "南3", "南4", "南5"};
final String[] itmes2 = {
    
    "全部楼层", "1-2层", "3-4层", "4层以上"};
final String[] itmes3 = {
    
    "全部人数", "<30%", "30%-50%", ">50%"};

ArrayAdapter<String> spinnerAdapter1 = new ArrayAdapter<>(this, R.layout.spinner_select, itmes1);
spinnerAdapter1.setDropDownViewResource(R.layout.spinner_drop);
spinnerView1.setAdapter(spinnerAdapter1);

ArrayAdapter<String> spinnerAdapter2 = new ArrayAdapter<>(this, R.layout.spinner_select, itmes2);
spinnerAdapter2.setDropDownViewResource(R.layout.spinner_drop);
spinnerView2.setAdapter(spinnerAdapter2);
        
ArrayAdapter<String> spinnerAdapter3 = new ArrayAdapter<>(this, R.layout.spinner_select, itmes3);
spinnerAdapter3.setDropDownViewResource(R.layout.spinner_drop);
spinnerView3.setAdapter(spinnerAdapter3);

spinnerSelect1 = itmes1[0];
spinnerSelect2 = itmes2[0];
spinnerSelect3 = itmes3[0];
updateRoomData();

// 每个spinner的点击事件
spinnerView1.setOnItemSelectedListener(new AdapterView.OnItemSelectedListener() {
    
    
	   @Override
	   public void onItemSelected(AdapterView<?> parent, View view, int position, long id) {
    
    
	       if (spinnerSelectedFirst1) spinnerSelectedFirst1 = false;
	       else {
    
    
	           spinnerSelect1 = itmes1[position];
	           updateRoomData();
	       }
	   }
	   @Override
	   public void onNothingSelected(AdapterView<?> parent) {
    
    }
});
spinnerView2.setOnItemSelectedListener(new AdapterView.OnItemSelectedListener() {
    
    
	   @Override
	   public void onItemSelected(AdapterView<?> parent, View view, int position, long id) {
    
    
	       if (spinnerSelectedFirst2) spinnerSelectedFirst2 = false;
	       else {
    
    
	           spinnerSelect2 = itmes2[position];
	           updateRoomData();
	       }
	   }
	   @Override
	   public void onNothingSelected(AdapterView<?> parent) {
    
    }
});
spinnerView3.setOnItemSelectedListener(new AdapterView.OnItemSelectedListener() {
    
    
	   @Override
	   public void onItemSelected(AdapterView<?> parent, View view, int position, long id) {
    
    
	       if (spinnerSelectedFirst3) spinnerSelectedFirst3 = false;
	       else {
    
    
	           spinnerSelect3 = itmes3[position];
	           updateRoomData();
	       }
	   }
	   @Override
	   public void onNothingSelected(AdapterView<?> parent) {
    
    }
});

三、效果

在这里插入图片描述