Android原生扰人烦的布局

      在开发Android应用时，UI布局是一件令人烦恼的事情。下面主要讲解一下Android中的界面布局。

一、线性布局（LinearLayout）

      线性布局分为：

      （1）垂直线性布局；

      （2）水平线性布局；

      针对这两种区别，只是一个属性的区别

      <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
      android:orientation="vertical"
      android:layout_width="fill_parent"
      android:layout_height="fill_parent">
      </LinearLayout>
  
 

      水平线性布局的话，android:orientation="horizontal" 即可。

二、 相对布局（RelativeLayout）

       一般线性布局满足不了们实际项目中的需要，就是一般做Web界面的UI设计一样，也是存在相对元素的一些CSS样式的布局。RelativeLayout参数有：Width，Height，Below，AlignTop，ToLeft，Padding，和MerginLeft。

      关键源码：

      <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
      android:layout_width="fill_parent"
      android:layout_height="fill_parent">
      <TextView
      android:id="@+id/label"
      android:layout_width="fill_parent"
      android:layout_height="wrap_content"
      android:text="请输入:"/>
      <EditText
      android:id="@+id/entry"
      android:layout_width="fill_parent"
      android:layout_height="wrap_content"
      android:background="@android:drawable/editbox_background"
      android:layout_below="@id/label"/>
      <Button
      android:id="@+id/ok"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_below="@id/entry"
      android:layout_alignParentRight="true"
      android:layout_marginLeft="10dip"
      android:text="确定" />
      <Button
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_toLeftOf="@id/ok"
      android:layout_alignTop="@id/ok"
      android:text="取消" />
      </RelativeLayout>
  
 

      其中，android:layout_below=”@id/label”设置了EditText处于TextView下方；在Button中android:layout_below=”@id/entry”设置该Button位于EditText下。

      实例效果：

三、表单布局（TableLayout）

      TableLayout由许多TableRow组成，每个TableRow都会定义一个Row。TableLayout容器不会显示Row,Column或Cell的边框线，每个Row拥有0个或多个Cell，每个Cell拥有一个View对象。表格由行和列组成许多单元个，允许单元格为空。但是单元格不能跨列，这与Html不同。

      <View
      android:layout_height="2dip"
      android:background="#FF909090" />
      <TableRow>
      <TextView
      android:text="*"
      android:padding="3dip" />
      <TextView
      android:text="导入..."
      android:padding="3dip" />
      </TableRow>
      <TableRow>
      <TextView
      android:text="*"
      android:padding="3dip" />
      <TextView
      android:text="导出..."
      android:padding="3dip" />
      <TextView
      android:text="Ctrl-E"
      android:gravity="right"
      android:padding="3dip" />
      </TableRow>
  
 

      实例效果：

      android:gravity="center" 书面解释是权重比。其时就是让它居中显示。

      android:stretchColumns="1,2,3,4" 它的意思就是自动拉伸1,2,3,4列。

注

      若需实现组件居中显示，布局应如下：

       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:layout_gravity="center_vertical|center_horizontal"
  
 

      TableRow平分列

      每一列的宽度设置为android:layout_width="0.0dip"，在设置每一列的android:layout_weight=“1”

      因为ayout_weight是将剩余空间按权重分配，而不是将全部空间按权重分配。

      代码如下：

      <TableRow
      android:paddingTop="15px">
      <Button
      android:id="@+id/Register"
      android:text="@string/register"
      android:layout_width="0.0dip"
      android:layout_weight="1"
      android:onClick="register"/>
      <Button
      android:id="@+id/cancel"
      android:layout_width="0.0dip"
      android:layout_weight="1"
      android:text="@string/button_cancel" />
      </TableRow>
  
 

      视图如下：

四、切换卡（TabWidget）

      切换卡经常用在一下选项上，类似于电话簿界面，通过多个标签切换显示不同内容。而其中，TabHost是一个用来存放Tab标签的容器，通过getTabHost方法来获取TabHost的对象，通过addTab方法向容器里添加Tab。Tab在切换时都会产生一个事件，可以通过TabActivity的事件监听setOnTabChangedListener.

【扩展点】TabHost

类概述

      提供选项卡（Tab页）的窗口视图容器。此对象包含两个子对象：一组是用户可以选择指定Tab页的标签；另一组是FrameLayout用来显示该Tab页的内容。个别元素通常控制使用这个容器对象，而不是设置在子元素本身的值。

（译者madgoat注：即使使用的是单个元素，也最好把它放到容器对象ViewGroup里）

内部类

      interface TabHost.OnTabChangeListener    

      接口定义了当选项卡更改时被调用的回调函数

      interface TabHost.TabContentFactory  

      当某一选项卡被选中时生成选项卡的内容

      class TabHost.TabSpec     

     单独的选项卡，每个选项卡都有一个选项卡指示符,内容和tag标签,以便于记录.。

关键源码

      <TabHost xmlns:android="http://schemas.android.com/apk/res/android"
      android:id="@android:id/tabhost"
      android:layout_width="fill_parent"
      android:layout_height="fill_parent">
      <LinearLayout
      android:orientation="vertical"
      android:layout_width="fill_parent"
      android:layout_height="fill_parent">
      <TabWidget
      android:id="@android:id/tabs"
      android:layout_width="fill_parent"
      android:layout_height="wrap_content" />
      <FrameLayout
      android:id="@android:id/tabcontent"
      android:layout_width="fill_parent"
      android:layout_height="fill_parent">
      <TextView
      android:id="@+id/textview1"
      android:layout_width="fill_parent"
      android:layout_height="fill_parent"
      android:text="this is a tab" />
      <TextView
      android:id="@+id/textview2"
      android:layout_width="fill_parent"
      android:layout_height="fill_parent"
      android:text="this is another tab" />
      <TextView
      android:id="@+id/textview3"
      android:layout_width="fill_parent"
      android:layout_height="fill_parent"
      android:text="this is a third tab" />
      </FrameLayout>
      </LinearLayout>
      </TabHost>
  
 

     处理类

      //声明TabHost对象
       TabHost mTabHost;
       public void onCreate(Bundle savedInstanceState)
       {
       super.onCreate(savedInstanceState);
       setContentView(R.layout.main);
       //取得TabHost对象
       mTabHost = getTabHost();
       /* 为TabHost添加标签 */
       //新建一个newTabSpec(newTabSpec)
       //设置其标签和图标(setIndicator)
       //设置内容(setContent)
       mTabHost.addTab(mTabHost.newTabSpec("tab_test1")
       .setIndicator("TAB 1",getResources().getDrawable(R.drawable.img1))
       .setContent(R.id.textview1));
       mTabHost.addTab(mTabHost.newTabSpec("tab_test2")
       .setIndicator("TAB 2",getResources().getDrawable(R.drawable.img2))
       .setContent(R.id.textview2));
       mTabHost.addTab(mTabHost.newTabSpec("tab_test3")
       .setIndicator("TAB 3",getResources().getDrawable(R.drawable.img3))
       .setContent(R.id.textview3));
       //设置TabHost的背景颜色
       mTabHost.setBackgroundColor(Color.argb(150, 22, 70, 150));
       //设置TabHost的背景图片资源
       //mTabHost.setBackgroundResource(R.drawable.bg0);
       //设置当前显示哪一个标签,默认下标从0开始
       mTabHost.setCurrentTab(0);
       //标签切换事件处理，setOnTabChangedListener
       mTabHost.setOnTabChangedListener(new OnTabChangeListener(){
       public void onTabChanged(String tabId) {
       Dialog dialog = new AlertDialog.Builder(Examples_04_29Activity.this)
       .setTitle("提示")
       .setMessage("当前选中："+tabId+"标签")
       .setPositiveButton("确定",
       new DialogInterface.OnClickListener() {
       public void onClick(DialogInterface dialog, int whichButton){
       dialog.cancel();
       }
       }).create();//创建按钮
       dialog.show();
       }
       });
       }
  
 

      实例效果：

参考文献

1.http://blog.csdn.net/fancylovejava/article/details/45787729/

美文美图

文章来源: shq5785.blog.csdn.net，作者：No Silver Bullet，版权归原作者所有，如需转载，请联系作者。

原文链接：shq5785.blog.csdn.net/article/details/51811816