布局与控件（六）－TableLayout和VideoView

第7节 TableLayout

TableLayout顾名思义，就是像表格一样的布局。它是LinearLayout的子类，所以拥有TableLayout的所有属性。

7.1 `TableLayout`的行数

TableLayout需要与它的搭档TableRow配合使用，TableRow也是LinearLayout的子类，表示表格的每一行，例如一个表格有3行，它的布局文件就应该像这样，

<TableLayout
    android:layout_height="match_parent"
    android:layout_width="match_parent">

    <TableRow/> <!--第一行-->
    <TableRow/> <!--第二行-->
    <TableRow/> <!--第三行-->

</TableLayout>

TableRow可以不用指定它的android:layout_height和android:layout_width属性（对于其它类型的布局来说，这两个属性是必须要设置的，不然编译器会提示错误），默认情况下，android:layout_height为wrap_content,android:layout_width为match_parent。

7.2 `TableLayout`的列数

每一个TableRow中包含的子控件（或者子布局）的个数，就是表格的列数。如果各个TableRow中包含的子控件个数不相同，那么就以最多的个数为准，作为整个表格的列数。

例如下面的布局，

<TableLayout
   android:layout_height="match_parent"
   android:layout_width="match_parent">

   <TableRow >
       <Button android:text="C"/>
       <Button android:text="DEL"/>
       <Button android:text="."/>
       <Button android:text="+"/>
   </TableRow>

   <TableRow >
       <Button android:text="7"/>
       <Button android:text="-"/>
   </TableRow>

   <TableRow >
       <Button android:text="4"/>
       <Button android:text="5"/>
       <Button android:text="6"/>
   </TableRow>

   <TableRow >
       <Button android:text="1"/>
       <Button android:text="2"/>
       <Button android:text="3"/>
       <Button android:text="/"/>
   </TableRow>

   <TableRow >
       <Button android:text="0" />
   </TableRow>

</TableLayout>

效果如下，可以看到这是一个5*4的表格，有的行有2格、有的有3格、有的有4格，于是采用格数最多的作为表格的列数。这里因为屏幕空间比较大，并没有占据完整个屏幕。

7.3 `TableLayout`界面调整

7.3.1 表格的平分

很多时候，我们希望表格的每一行能够平均分配可用的空间，那么可以为每个TableRow设置android:layout_weight=1，

<TableLayout
   android:layout_height="match_parent"
   android:layout_width="match_parent">

   <TableRow android:layout_weight="1">
       <Button android:text="C"/>
       <Button android:text="DEL"/>
       <Button android:text="."/>
       <Button android:text="+"/>
   </TableRow>
   <TableRow android:layout_weight="1">
       <Button android:text="7"/>
       <Button android:text="-"/>
   </TableRow>

   <TableRow android:layout_weight="1">
       <Button android:text="4"/>
       <Button android:text="5"/>
       <Button android:text="6"/>
   </TableRow>

   <TableRow android:layout_weight="1">
       <Button android:text="1"/>
       <Button android:text="2"/>
       <Button android:text="3"/>
       <Button android:text="/"/>
   </TableRow>

   <TableRow android:layout_weight="1">
       <Button android:text="0" />
   </TableRow>
</TableLayout>

表格的每一列能够平均分配可用的空间，那么可以为每个TableLayout添加android:stretchColumns="*"，这样，剩余的空间就被拉伸平分了，

<TableLayout
    android:layout_height="match_parent"
    android:layout_width="match_parent"
    android:stretchColumns="*">
    ......
</TableLayout>

android:stretchColumns用来指定需要拉伸的单元格，*表示所有单元格。

也可以指定部分单元格拉伸，例如指定第2列赫第4列，

<TableLayout
   android:layout_height="match_parent"
   android:layout_width="match_parent"
   android:stretchColumns="1，3">

注意，可拉伸的单元格序号是从0开始；多个单元格，可以用逗号分隔开。

7.3.2 表格列的收缩

有的时候，如果一个单元格的内容过长，会影响到同一行其它列的显示效果，例如，

<TableLayout
   android:layout_height="match_parent"
   android:layout_width="match_parent">

   <TableRow android:layout_weight=1>
       <Button android:text="Cfdfdfdfdffdfdffdfdffdfdfdfdfdfdfddf"/>
       <Button android:text="DEL"/>
       <Button android:text="."/>
       <Button android:text="+"/>
   </TableRow>
   ......
</TableLayout>

如果对TableLayout使用了android:shrinkColumns，并指定可以收缩的列为0，那么这一列的内容就可以朝着下方伸展，

<TableLayout
    android:layout_height="match_parent"
    android:layout_width="match_parent"
    android:shrinkColumns="0">
    ......
</TableLayout>

注意，可收缩的单元格序号是从0开始；多个单元格，可以用逗号分隔开。

7.3.3 表格列的隐藏

要隐藏某一列也很容易，使用android:collapseColumns，将要隐藏的列的序号填入即可，例如，

<TableLayout
    android:layout_height="match_parent"
    android:layout_width="match_parent"
    android:collapseColumns="0">
   ......
</TableLayout>

可以看到，第一列已经被隐藏起来不见了。

注意，可收缩的单元格序号是从0开始；多个单元格，可以用逗号分隔开。

7.3.4 单元格的跨列

有时，希望一个按钮能够跨多列，可以使用android:layout_span属性，例如这里让按键0，跨两列

<TableLayout
    android:layout_height="match_parent"
    android:layout_width="match_parent">
    ......
    <TableRow  android:layout_weight="1">
        <Button android:text="0"
            android:layout_span="2"/>
    </TableRow>
    ......
</TableLayout>

需要注意的是，TableLayout中的单元格并不能跨行合并显示。

第8节 VideoView

播放视频可以使用Android SDK提供的现成的控件VideoView。它是对media player和surface的封装，对于初次进行视频播放开发的开发者来说，使用VideoView是最简单和方便的，不用关注太多细节上的实现方式。

8.1 VideoView的使用

VideoView的使用，非常简单，

在布局文件中放置一个VideoView控件，

<VideoView
    android:id="@+id/video_view"
    android:layout_width="match_parent"
    android:layout_height="match_parent"/>

在Activity当中，获取布局文件中的VideoView，然后设置要播放的视频地址，
```
mVideoView = (VideoView) findViewById(R.id.video_view);

//使用视频的字符串路径
mVideoView.setVideoPath(strPath);
//使用视频的uri路径
mVideoView.setVideoURI(uriPath);
```
1. 使用字符串路径，视频的地址类似于：/storage/emulated/0/Video/【大自然】mothernature（蒋雯丽配音）.mp4；
2. 使用uri路径；

使用VideoView提供的接口，控制视频播放的流程，

//从头开始播放视频
mVideoView.start();
//暂停播放视频
mVideoView.pause();
//继续播放视频
mVideoView.resume()
//跳转到xxx毫秒处开始播放
mVideoView.seekTo(xxx);

8.2 控制面板

还可以为VideoView添加控制面板-MediaController，这个面板集成了播放进度拖动、暂停、继续播放等功能，还可以自动隐藏或显示。

使用Android SDK自带的MediaController，

MediaController controller= new MediaController(context);
mVideoView.setMediaController(controller);

如果VideoView有父布局，那么为它添加的MediaController就会附着在父布局的底部的。

因此为了界面美观，经常在布局文件中，将VideoView单独放到一个FrameLayout当中，并让它居中显示，

<FrameLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <VideoView
        android:layout_gravity="center"
        android:id="@+id/video_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>

</FrameLayout>

时间： 2024-10-15 08:28:38