课程表布局实现(支持动态添加课程)

【Android】UI

平时使用的”超级课程表”可以从根据学号直接从教务系统中导入对应的课程表，确实方便。作为开发人员，自然会想自己去实现。当然，抓数据这个我不在行，做Android的就实现它的布局了。
很明显，这课表就是原生的(不是什么hXXX5)。先上效果图

##大体思路
分析:1.一天有12节课,对于手机屏幕不大的手机如果全部显示则显得太挤。因此下面的课程是支持滑动的，但是表头不能 让它滑动,不然就看不到是星期几，用户体验不好,不够人性化。2.课的节数是不一定的，也就是说这个布局不是死的，课程需要动态添加。

具体:1. 首先是一个线性布局，包含两个部分1) 表头(周一～周日) 2) 课程部分
2.表头直接一个水平方向的线性布局，通过权值进行均分即可。
3.课程主体部分细分:
1)使用ScrollView实现对超出区域的部分进行滑动。
2)左侧的课的节数与表头部分类似,只是将水平方向改成垂直方向。
3)右边课程部分细分:

  • 一个水平方向的线性布局将七天包含进来
  • 每一天再用一个相对布局包含(设置权值进行水平均分)
  • 在代码中动态向相对布局中添加TextView(这也是为什么上面使用相对布局的原因)

XML中的布局基本就是这样，好多细节需要处理，具体看我GitHub上的完整代码。
接下来就是动态添加TextView的代码:
生成TextView

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
private TextView createTv(int start,int end,String text){
        TextView tv = new TextView(this);
        /*
         指定高度和宽度
         */
        LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(gridWidth,gridHeight*(end-start+1));
        /*
        指定位置
         */
        tv.setY(gridHeight*(start-1));
        tv.setLayoutParams(params);
        tv.setGravity(Gravity.CENTER);
        tv.setText(text);
        return tv;
    }

添加TextView:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
private void addView(int i,int start,int end,String text){
        TextView tv;
        switch (i){
            case 1:
                layout = (RelativeLayout) findViewById(R.id.Monday);
                break;
            case 2:
                layout = (RelativeLayout) findViewById(R.id.Tuesday);
                break;
            case 3:
                layout = (RelativeLayout) findViewById(R.id.Wednesday);
                break;
            case 4:
                layout = (RelativeLayout) findViewById(R.id.Thursday);
                break;
            case 5:
                layout = (RelativeLayout) findViewById(R.id.Friday);
                break;
            case 6:
                layout = (RelativeLayout) findViewById(R.id.Saturday);
                break;
            case 7:
                layout = (RelativeLayout) findViewById(R.id.Sunday);
                break;
        }
        tv= createTv(start,end,text);
        tv.setBackgroundColor(Color.argb(100,start*5,(start+end)*20,0));
        layout.addView(tv);
    }

完整代码:https://github.com/MummyDing/SchoolTimetable(不要吝啬你的Star哈)

【转载请注明出处】
Author: MummyDing
出处:http://blog.csdn.net/mummyding/article/details/48549573

Title:课程表布局实现(支持动态添加课程)

Author:MummyDing

Created:2015-09-18, 18:21:00

Updated:2016-09-05, 15:24:27

Full URL:https://mummyding.github.io/2015/09/18/【Android】课程表布局实现(支持动态添加课程)/

License: "CC BY-NC-SA 4.0" Keep Link & Author if Distribute.

Contents
|