實踐--課程表（仿超級課程表展示課表）

總覽

• 在上一篇博客實踐–課程表（ViewPager實現）中已經實現了課表內容的獲取和展示，可是因為ViewPager的顯示的效果的局限性，對於課表的一覽性較差。而且沒有單雙周的區分，不能實時顯示，故將其改成超級課程表樣式來顯示。

效果圖

布局的實現

• 布局示意圖例如以下：
  

<?xml version="1.0" encoding="utf-8"?
> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent" android:background="@color/colorTableBg"> <LinearLayout  android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@color/colorWeekTitle" android:orientation="vertical"> <Button  android:id="@+id/title_button" android:layout_width="120dp" android:layout_height="wrap_content" android:background="@color/colorWeekTitle" android:layout_gravity="center_horizontal" android:textColor="@color/colorPrimary" android:textSize="20sp" android:drawableRight="@mipmap/title_week_blue" android:text="第1周"/> </LinearLayout> <LinearLayout  android:orientation="horizontal" android:layout_width="match_parent" android:layout_height="40dp"> <TextView  android:layout_height="match_parent" android:layout_width="30dp" android:background="@drawable/shape_table_bar" /> <TextView  android:layout_height="match_parent" android:layout_width="0dip" android:layout_weight="1" android:text="周一" android:background="@drawable/shape_table_bar" android:gravity="center" android:id="@+id/textView_Monday" /> <TextView  android:layout_height="match_parent" android:layout_width="0dip" android:layout_weight="1" android:text="周二" android:background="@drawable/shape_table_bar" android:gravity="center" android:id="@+id/textView_Tuesday" /> <TextView  android:layout_width="0dip" android:layout_weight="1" android:layout_height="match_parent" android:text="周三" android:background="@drawable/shape_table_bar" android:gravity="center" android:id="@+id/textView_Wednesday" /> <TextView  android:layout_width="0dip" android:layout_weight="1" android:layout_height="match_parent" android:text="周四" android:background="@drawable/shape_table_bar" android:gravity="center" android:id="@+id/textView_Thursday" /> <TextView  android:layout_width="0dip" android:layout_weight="1" android:layout_height="match_parent" android:text="周五" android:background="@drawable/shape_table_bar" android:gravity="center" android:id="@+id/textView_Friday" /> <TextView  android:layout_width="0dip" android:layout_weight="1" android:layout_height="match_parent" android:text="周六" android:background="@drawable/shape_table_bar" android:gravity="center" android:id="@+id/textView_Saturday" /> <TextView  android:layout_width="0dip" android:layout_weight="1" android:layout_height="match_parent" android:text="周日" android:background="@drawable/shape_table_bar" android:gravity="center" android:id="@+id/textView_Sunday" /> </LinearLayout> <ScrollView  android:layout_width="match_parent" android:layout_height="match_parent"> <LinearLayout  android:orientation="horizontal" android:layout_width="match_parent" android:layout_height="match_parent" android:background="@mipmap/table_bg"> <LinearLayout  android:orientation="vertical" android:layout_width="30dp" android:layout_height="match_parent"> <TextView  android:layout_width="match_parent" android:layout_height="@dimen/table_rowwide" android:text="1" android:background="@drawable/shape_table_bar" android:gravity="center" android:id="@+id/textView_getWidth" /> <TextView  android:layout_width="match_parent" android:layout_height="@dimen/table_rowwide" android:text="2" android:background="@drawable/shape_table_bar" android:gravity="center"/> <TextView  android:layout_width="match_parent" android:layout_height="@dimen/table_rowwide" android:text="3" android:background="@drawable/shape_table_bar" android:gravity="center" /> <TextView  android:layout_width="match_parent" android:layout_height="@dimen/table_rowwide" android:text="4" android:background="@drawable/shape_table_bar" android:gravity="center" /> <TextView  android:layout_width="match_parent" android:layout_height="@dimen/table_rowwide" android:text="5" android:background="@drawable/shape_table_bar" android:gravity="center" /> <TextView  android:layout_width="match_parent" android:layout_height="@dimen/table_rowwide" android:text="6" android:background="@drawable/shape_table_bar" android:gravity="center" /> <TextView  android:layout_width="match_parent" android:layout_height="@dimen/table_rowwide" android:text="7" android:background="@drawable/shape_table_bar" android:gravity="center" /> <TextView  android:layout_width="match_parent" android:layout_height="@dimen/table_rowwide" android:text="8" android:background="@drawable/shape_table_bar" android:gravity="center" /> <TextView  android:layout_width="match_parent" android:layout_height="@dimen/table_rowwide" android:text="9" android:background="@drawable/shape_table_bar" android:gravity="center" /> <TextView  android:layout_width="match_parent" android:layout_height="@dimen/table_rowwide" android:text="10" android:background="@drawable/shape_table_bar" android:gravity="center" /> <TextView  android:layout_width="match_parent" android:layout_height="@dimen/table_rowwide" android:text="11" android:background="@drawable/shape_table_bar" android:gravity="center" /> <TextView  android:layout_width="match_parent" android:layout_height="@dimen/table_rowwide" android:text="12" android:background="@drawable/shape_table_bar" android:gravity="center" /> <TextView  android:layout_width="match_parent" android:layout_height="@dimen/table_rowwide" android:text="13" android:background="@drawable/shape_table_bar" android:gravity="center" /> <TextView  android:layout_width="match_parent" android:layout_height="@dimen/table_rowwide" android:text="14" android:background="@drawable/shape_table_bar" android:gravity="center" /> </LinearLayout> <LinearLayout  android:id="@+id/linearLayout1" android:orientation="vertical" android:layout_width="0dip" android:layout_weight="1" android:layout_height="match_parent"></LinearLayout> <LinearLayout  android:id="@+id/linearLayout2" android:orientation="vertical" android:layout_width="0dip" android:layout_weight="1" android:layout_height="match_parent"></LinearLayout> <LinearLayout  android:id="@+id/linearLayout3" android:orientation="vertical" android:layout_width="0dip" android:layout_weight="1" android:layout_height="match_parent"></LinearLayout> <LinearLayout  android:id="@+id/linearLayout4" android:orientation="vertical" android:layout_width="0dip" android:layout_weight="1" android:layout_height="match_parent"></LinearLayout> <LinearLayout  android:id="@+id/linearLayout5" android:orientation="vertical" android:layout_width="0dip" android:layout_weight="1" android:layout_height="match_parent"></LinearLayout> <LinearLayout  android:id="@+id/linearLayout6" android:orientation="vertical" android:layout_width="0dip" android:layout_weight="1" android:layout_height="match_parent"></LinearLayout> <LinearLayout  android:id="@+id/linearLayout7" android:orientation="vertical" android:layout_width="0dip" android:layout_weight="1" android:layout_height="match_parent"></LinearLayout> </LinearLayout> </ScrollView> </LinearLayout>

頂部選擇當前周數的功能。應用了popWindow控件

• popWindow布局代碼

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

    <ListView  android:layout_width="match_parent" android:layout_height="wrap_content" android:divider="@null" android:id="@+id/listView_weeks" />
</LinearLayout>

• popWindow中條目的布局代碼
• 注意此處沒有使用布局控件

<?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:gravity="center" android:background="#ffffff" android:maxLines="1" android:layout_gravity="center_horizontal" android:paddingBottom="2dp" android:paddingLeft="25dp" android:paddingRight="25dp" android:paddingTop="2dp" android:text="helloword" android:textColor="#000000" android:textSize="19sp" >
</TextView>

• 邏輯代碼實現

                if (!popupWindow.isShowing()) {
                    String[] weeks = new String[18];
                    for (int i = 1; i <= 18; i++) {
                        weeks[i - 1] = "第" + i + "周";
                    }
                    View view = LayoutInflater.from(MainActivity.this).inflate(R.layout.layout_weeklist, null);
                    ListView weekList = (ListView) view.findViewById(R.id.listView_weeks);
                    ArrayAdapter<String> adapter = new ArrayAdapter<String>(getApplicationContext(), R.layout.layout_list_item, weeks);
                    weekList.setAdapter(adapter);
                    popupWindow.setContentView(view);
                    int xOffSet = -(popupWindow.getWidth() - v.getWidth()) / 2;
                    popupWindow.showAsDropDown(v, xOffSet, 0);
                    weekList.setOnItemClickListener(new AdapterView.OnItemClickListener() {
                        @Override
                        public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
                            TextView textView= (TextView) view;
                            button_title.setText(textView.getText());
                            popupWindow.dismiss();
                            writeTimeTable(courseList);
                        }
                    });
                }else if (popupWindow.isShowing()){
                    popupWindow.dismiss();
                }

動態的加入課程並顯示

• 加入課程的時候。先分辨是周幾的課程，然后每推斷一個課程是周幾的哪一節課之后，就加入在當天的位置上，至於課程的對齊方式，就是應用了margin這個屬性。每加入一節課，就記錄下當前課程位於當天的第幾節，在加入課程的時候。據能夠知道要距離上一節課的距離了，比方我已經加入了周一的第一節課了，如今我周一第三節課才再有課，那我就須要margin出一節課的位置來就能夠了。
• 然后是單雙周，周數的推斷載入課表，僅僅須要對課表的時間進行推斷，符合時間段就加入帶顯示頁面中，不符合的話。就不加入就能夠了
• 代碼例如以下：

        for (int i=0;i<linearLayouts.length;i++){
            linearLayouts[i].removeAllViews();
        }

        //當前的周數
        int nowWeekNum=Integer.parseInt(button_title.getText().toString().substring(1,button_title.getText().toString().indexOf("周")));
        int[] counts = new int[7];
        for (int i = 0; i < courseList.size(); i++) {
            final CourseBean courseBean = courseList.get(i);
            int startNum=Integer.parseInt(courseBean.getCourse_week().toString().substring(courseBean.getCourse_week().lastIndexOf("第")+1,courseBean.getCourse_week().lastIndexOf("第")+2));
            String utilNum=courseBean.getCourse_week().substring(courseBean.getCourse_week().indexOf("-"),courseBean.getCourse_week().indexOf("-")+4);
            int endNum=Integer.parseInt(utilNum.substring(1,utilNum.indexOf("周")));
            System.out.println("開始周數"+startNum+"結束周數"+endNum);

            for (int j = 0; j < 7; j++) {
                if (courseBean.getCourse_week().contains(week[j])) {
                    for (int k = 0; k < day_time.length; k++) {
                        if (courseBean.getCourse_week().contains(day_time[k])) {
                            TextView textView = new TextView(getApplicationContext());
                            textView.setTextColor(Color.BLACK);
                            textView.setGravity(Gravity.CENTER);
                            if (nowWeekNum <= endNum && nowWeekNum >= startNum) {
                                if ((courseBean.getCourse_week().contains("雙周") && nowWeekNum % 2 == 0) || (courseBean.getCourse_week().contains("單周") && nowWeekNum % 2 != 0) || (!courseBean.getCourse_week().contains("單周") && !courseBean.getCourse_week().contains("雙周"))) {
                                    linearLayouts[j].addView(textView);
                                    textView.setText(courseBean.toString());
                                    LinearLayout.LayoutParams para = new LinearLayout.LayoutParams(
                                            LinearLayout.LayoutParams.MATCH_PARENT, table_Width);
                                    para.setMargins(0, (k - counts[j]) * table_Width, 0, 0); //left,top,right, bottom
                                    textView.setLayoutParams(para);
                                    textView.setBackgroundResource(R.drawable.shape_lesson);
                                    counts[j] = k + 1;
                                }
                            }
                        }
                    }
                }
            }
        }

課程明細彈出框的實現

• 這個彈出框就是一個自己定義的Dialog，
• 布局代碼例如以下：

<?xml version="1.0" encoding="utf-8"?
> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="wrap_content" android:layout_height="wrap_content"> <LinearLayout  android:orientation="horizontal" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginTop="10dp" android:layout_marginLeft="30dp"> <ImageView  android:layout_width="30dp" android:layout_height="30dp" android:src="@mipmap/lesson_name"/> <TextView  android:layout_width="match_parent" android:layout_height="match_parent" android:gravity="center_vertical" android:paddingLeft="20dp" android:textSize="15sp" android:textColor="#000000" android:id="@+id/lesson_name" /> </LinearLayout> <LinearLayout  android:orientation="horizontal" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginLeft="30dp" android:layout_marginTop="8dp"> <ImageView  android:layout_width="30dp" android:layout_height="30dp" android:src="@mipmap/lesson_teacher"/> <TextView  android:layout_width="match_parent" android:layout_height="match_parent" android:gravity="center_vertical" android:paddingLeft="20dp" android:textSize="15sp" android:textColor="#000000" android:id="@+id/lesson_teacher" /> </LinearLayout> <LinearLayout  android:orientation="horizontal" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginLeft="30dp" android:layout_marginTop="8dp"> <ImageView  android:layout_width="30dp" android:layout_height="30dp" android:src="@mipmap/lesson_major"/> <TextView  android:layout_width="match_parent" android:layout_height="match_parent" android:gravity="center_vertical" android:paddingLeft="20dp" android:textSize="15sp" android:textColor="#000000" android:id="@+id/lesson_major" /> </LinearLayout> <LinearLayout  android:orientation="horizontal" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginLeft="30dp" android:layout_marginTop="8dp"> <ImageView  android:layout_width="30dp" android:layout_height="30dp" android:src="@mipmap/lesson_address"/> <TextView  android:layout_width="match_parent" android:layout_height="match_parent" android:gravity="center_vertical" android:paddingLeft="20dp" android:textSize="15sp" android:textColor="#000000" android:id="@+id/lesson_address" /> </LinearLayout> <LinearLayout  android:orientation="horizontal" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginLeft="30dp" android:layout_marginTop="8dp"> <ImageView  android:layout_width="30dp" android:layout_height="30dp" android:src="@mipmap/lesson_time"/> <TextView  android:layout_width="match_parent" android:layout_height="match_parent" android:gravity="center_vertical" android:paddingLeft="20dp" android:textSize="15sp" android:textColor="#000000" android:id="@+id/lesson_time" /> </LinearLayout> </LinearLayout>

• 邏輯代碼例如以下

                        textView.setOnClickListener(new View.OnClickListener() {
                                @Override
                                public void onClick(View v) {
                                    Dialog dialog = new Dialog(MainActivity.this);
                                    dialog.setTitle("課程細節：");
                                    View view = LayoutInflater.from(getApplicationContext()).inflate(R.layout.layout_lesson_detial, null);
                                    TextView lesson_name = (TextView) view.findViewById(R.id.lesson_name);
                                    TextView lesson_teacher = (TextView) view.findViewById(R.id.lesson_teacher);
                                    TextView lesson_major = (TextView) view.findViewById(R.id.lesson_major);
                                    TextView lesson_address = (TextView) view.findViewById(R.id.lesson_address);
                                    TextView lesson_time = (TextView) view.findViewById(R.id.lesson_time);
                                    lesson_name.setText(courseBean.getCourse_name());
                                    lesson_address.setText(courseBean.getCourse_address());
                                    lesson_major.setText("專業");
                                    lesson_teacher.setText(courseBean.getCourse_teacher());
                                    lesson_time.setText(courseBean.getCourse_week());
                                    dialog.setContentView(view);
                                    dialog.show();
                                }
                            });

源代碼

• 因為本人水平有限，代碼中存在的諸多漏洞還請見諒。假設對上面的描寫敘述感到疑惑。歡迎下載源代碼仿超級課程表程序源代碼。