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) {}
});

Android開發日記(二) 教室數據展示與篩選

一、數據展示

二、數據篩選

三、效果

全國省市縣數據爬蟲

我如何用AndroidStudio導入一個eclipse開發的上古世紀app

Android開發日記(一) 基礎界面設計

pip更換國內源(pip安裝第三方庫超時失敗的解決辦法)

Android開發日記(二) 教室數據展示與篩選

Mac下配置sublime實現LaTeX

https://yachay.unat.edu.pe/blog/index.php?comment_area=format_blog&comment_component=blog&comment_co

linux以太網驅動總結

Android開發日記(二) 教室數據展示與篩選

一、 數據展示

二、數據篩選

三、 效果

一、數據展示

三、效果