系出名门Android(2) - 布局(Layout)和菜单(Menu)

[索引页]
[源码下载]

系出名门Android(2) - 布局(Layout)和菜单(Menu)

作者： webabcd


介绍
在 Android 中各种布局的应用，以及菜单效果的实现 

• 各种布局方式的应用，FrameLayout, LinearLayout, TableLayout, AbsoluteLayout, RelativeLayout  
• 为指定元素配置上下文菜单，为应用程序配置选项菜单，以及多级菜单的实现 

1、各种布局方式的演示
res/layout/main.xml

<? xml  version ="1.0"  encoding ="utf-8" ?> 
<!--     
layout_width - 宽。fill_parent: 宽度跟着父元素走；wrap_content: 宽度跟着本身的内容走；直接指定一个 px 值来设置宽 
layout_height - 高。fill_parent: 高度跟着父元素走；wrap_content: 高度跟着本身的内容走；直接指定一个 px 值来设置高 
--> 

<!--  
LinearLayout - 线形布局。 
        orientation - 容器内元素的排列方式。vertical: 子元素们垂直排列；horizontal: 子元素们水平排列 
        gravity - 内容的排列形式。常用的有 top, bottom, left, right, center 等，详见文档 
--> 
< LinearLayout  xmlns:android ="http://schemas.android.com/apk/res/android" 
         android:orientation ="vertical"  android:gravity ="right" 
         android:layout_width ="fill_parent"  android:layout_height ="fill_parent" > 

        <!--  
        FrameLayout - 层叠式布局。以左上角为起点，将    FrameLayout 内的元素一层覆盖一层地显示 
        --> 
         < FrameLayout  android:layout_height ="wrap_content" 
                 android:layout_width ="fill_parent" > 
                 < TextView  android:layout_width ="wrap_content" 
                         android:layout_height ="wrap_content"  android:text ="FrameLayout" > 
                 </ TextView > 
                 < TextView  android:layout_width ="wrap_content" 
                         android:layout_height ="wrap_content"  android:text ="Frame Layout" > 
                 </ TextView > 
         </ FrameLayout > 

         < TextView  android:layout_width ="wrap_content" 
                 android:layout_height ="wrap_content"  android:text ="@string/hello"  /> 

        <!--  
        TableLayout - 表格式布局。 
                TableRow - 表格内的行，行内每一个元素算作一列 
                collapseColumns - 设置 TableLayout 内的 TableRow 中需要隐藏的列的列索引，多个用“,”隔开 
                stretchColumns - 设置 TableLayout 内的 TableRow 中需要拉伸（该列会拉伸到所有可用空间）的列的列索引，多个用“,”隔开 
                shrinkColumns - 设置 TableLayout 内的 TableRow 中需要收缩（为了使其他列不会被挤到屏幕外，此列会自动收缩）的列的列索引，多个用“,”隔开 
        --> 
         < TableLayout  android:id ="@+id/TableLayout01" 
                 android:layout_width ="fill_parent"  android:layout_height ="wrap_content" 
                 android:collapseColumns ="1" > 
                 < TableRow  android:id ="@+id/TableRow01"  android:layout_width ="fill_parent" 
                         android:layout_height ="wrap_content" > 
                         < TextView  android:layout_width ="wrap_content" 
                                 android:layout_weight ="1"  android:layout_height ="wrap_content" 
                                 android:text ="行1列1"  /> 
                         < TextView  android:layout_width ="wrap_content" 
                                 android:layout_weight ="1"  android:layout_height ="wrap_content" 
                                 android:text ="行1列2"  /> 
                         < TextView  android:layout_width ="wrap_content" 
                                 android:layout_weight ="1"  android:layout_height ="wrap_content" 
                                 android:text ="行1列3"  /> 
                 </ TableRow > 
                 < TableRow  android:id ="@+id/TableRow01"  android:layout_width ="wrap_content" 
                         android:layout_height ="wrap_content" > 
                         < TextView  android:layout_width ="wrap_content" 
                                 android:layout_height ="wrap_content"  android:text ="行2列1"  /> 
                 </ TableRow > 
         </ TableLayout > 

        <!--  
        AbsoluteLayout - 绝对定位布局。 
                layout_x - x 坐标。以左上角为顶点 
                layout_y - y 坐标。以左上角为顶点 
        --> 
         < AbsoluteLayout  android:layout_height ="wrap_content" 
                 android:layout_width ="fill_parent" > 
                 < TextView  android:layout_width ="wrap_content" 
                         android:layout_height ="wrap_content"  android:text ="AbsoluteLayout" 
                         android:layout_x ="100px"    
                         android:layout_y ="100px"  /> 
         </ AbsoluteLayout > 

        <!--  
        RelativeLayout - 相对定位布局。 
                layout_centerInParent - 将当前元素放置到其容器内的水平方向和垂直方向的中央位置（类似的属性有 ：layout_centerHorizontal, layout_alignParentLeft 等） 
                layout_marginLeft - 设置当前元素相对于其容器的左侧边缘的距离 
                layout_below - 放置当前元素到指定的元素的下面 
                layout_alignRight - 当前元素与指定的元素右对齐 
        --> 
         < RelativeLayout  android:id ="@+id/RelativeLayout01" 
                 android:layout_width ="fill_parent"  android:layout_height ="fill_parent" > 
                 < TextView  android:layout_width ="wrap_content"  android:id ="@+id/abc" 
                         android:layout_height ="wrap_content"  android:text ="centerInParent=true" 
                         android:layout_centerInParent ="true"  /> 
                 < TextView  android:layout_width ="wrap_content" 
                         android:layout_height ="wrap_content"  android:text ="marginLeft=20px" 
                         android:layout_marginLeft ="20px"  /> 
                 < TextView  android:layout_width ="wrap_content" 
                         android:layout_height ="wrap_content"  android:text ="xxx" 
                         android:layout_below ="@id/abc"  android:layout_alignRight ="@id/abc"  /> 
         </ RelativeLayout > 

</ LinearLayout >

 

res/values/strings.xml

<? xml  version ="1.0"  encoding ="utf-8" ?> 
< resources > 
         < string  name ="hello" >Hello Layout </ string > 
         < string  name ="app_name" >webabcd_layout </ string > 
</ resources >

 

Main.java

package com.webabcd.layout; 

import android.app.Activity; 
import android.os.Bundle; 

public  class Main  extends Activity { 
         /** Called when the activity is first created. */ 
        @Override 
         public  void onCreate(Bundle savedInstanceState) { 
                 super.onCreate(savedInstanceState); 
                setContentView(R.layout.main); 
        } 
}

 

 

2、上下文菜单，选项菜单，子菜单
res/layout/main.xml

<? xml  version ="1.0"  encoding ="utf-8" ?> 
< LinearLayout  xmlns:android ="http://schemas.android.com/apk/res/android" 
         android:orientation ="vertical"  android:layout_width ="fill_parent" 
         android:layout_height ="fill_parent" > 
         
         < TextView  android:id ="@+id/txt1"  android:layout_width ="fill_parent" 
                 android:layout_height ="wrap_content"  android:text ="@string/hello_contextMenu"  /> 
                 
         < TextView  android:id ="@+id/txt2"  android:layout_width ="fill_parent" 
                 android:layout_height ="wrap_content"  android:text ="@string/hello_subMenu"  /> 
                 
</ LinearLayout >

 

res/values/strings.xml

<? xml  version ="1.0"  encoding ="utf-8" ?> 
< resources > 
         < string  name ="hello_contextMenu" >Hello Context Menu </ string > 
         < string  name ="hello_subMenu" >Hello Context Sub Menu </ string > 
         < string  name ="app_name" >webabcd_menu </ string > 
</ resources >

 

Main.java

package com.webabcd.menu; 

import android.app.Activity; 
import android.os.Bundle; 
import android.view.ContextMenu; 
import android.view.Menu; 
import android.view.MenuItem; 
import android.view.SubMenu; 
import android.view.View; 
import android.view.ContextMenu.ContextMenuInfo; 
import android.widget.TextView; 
import android.widget.Toast; 

// 演示两种菜单的实现方式：上下文菜单（通过在某元素上长按，来呼出菜单）和选项菜单（通过按手机上的菜单按钮，来呼出菜单） 
public  class Main  extends Activity { 
         /** Called when the activity is first created. */ 
        @Override 
         public  void onCreate(Bundle savedInstanceState) { 
                 super.onCreate(savedInstanceState); 
                setContentView(R.layout.main); 

                 // 为 R.id.txt1 注册一个上下文菜单（在此 TextView 上长按，则会呼出上下文菜单） 
                 // 具体呼出的菜单内容需要重写 onCreateContextMenu 来创建 
                TextView txt1 = (TextView)  this.findViewById(R.id.txt1); 
                 this.registerForContextMenu(txt1); 

                 // 为 R.id.txt2 注册一个上下文菜单 
                TextView txt2 = (TextView)  this.findViewById(R.id.txt2); 
                 this.registerForContextMenu(txt2); 
        } 

         // 重写 onCreateContextMenu 用以创建上下文菜单 
         // 重写 onContextItemSelected 用以响应上下文菜单 
        @Override 
         public  void onCreateContextMenu(ContextMenu menu, View v, 
                        ContextMenuInfo menuInfo) { 
                 super.onCreateContextMenu(menu, v, menuInfo); 

                 // 创建 R.id.txt1 的上下文菜单 
                 if (v == (TextView)  this.findViewById(R.id.txt1)) { 
                         
                         // ContextMenu.setIcon() - 设置菜单的图标 
                         // ContextMenu.setHeaderTitle() - 设置菜单的标题 
                        menu.setHeaderIcon(R.drawable.icon01); 
                        menu.setHeaderTitle( "我是菜单"); 
                         
                         // 用 ContextMenu.add() 来增加菜单项，返回值为 MenuItem 
                         // 第一个参数：组ID 
                         // 第二个参数：菜单项ID 
                         // 第三个参数：顺序号 
                         // 第四个参数：菜单项上显示的内容 
                        menu.add(1, 0, 0,  "菜单1"); 
                         
                         // MenuItem - 新增菜单项后的返回类型，针对菜单项的其他设置在此对象上操作    
                        menu.add(1, 1, 1,  "菜单2").setCheckable( true); 
                         
                } 
                 // 创建 R.id.txt2 的上下文菜单（多级上下文菜单） 
                 else  if (v == (TextView)  this.findViewById(R.id.txt2)) { 
                         
                         // ContextMenu.addSubMenu("菜单名称") - 用来添加子菜单。子菜单其实就是一个特殊的菜单 
                        SubMenu sub = menu.addSubMenu( "父菜单1"); 
                        sub.setIcon(R.drawable.icon01); 
                        sub.add(0, 0, 0,  "菜单1"); 
                        sub.add(0, 1, 1,  "菜单2"); 
                        sub.setGroupCheckable(1,  true,  true); 

                        SubMenu sub2 = menu.addSubMenu( "父菜单2"); 
                        sub2.setIcon(R.drawable.icon01); 
                        sub2.add(1, 0, 0,  "菜单3"); 
                        sub2.add(1, 1, 1,  "菜单4"); 
                        sub2.setGroupCheckable(1,  true,  false); 
                         
                } 
        } 
         
         
         // 重写 onCreateOptionsMenu 用以创建选项菜单 
        @Override 
         public  boolean onCreateOptionsMenu(Menu menu) { 

                MenuItem menuItem = menu.add(0, 0, 0,  "菜单111111111111111111111"); 
                 
                 // MenuItem.setIcon() - 设置菜单项的图标 
                 // MenuItem.setTitleCondensed() - 菜单的简标题，如果指定了简标题的话，菜单项上的标题将会以此简标题为准 
                 // MenuItem.setAlphabeticShortcut() - 设置选中此菜单项的快捷键 
                 // 注：菜单项超过 6 个的话，第 6 个菜单将会变为    More 菜单，多余的菜单会在单击 More 菜单之后显示出来 
                menuItem.setIcon(R.drawable.icon01); 
                menuItem.setTitleCondensed( "菜单1"); 
                menuItem.setAlphabeticShortcut('a'); 

                menu.add(0, 1, 1,  "菜单2").setIcon(R.drawable.icon02); 
                menu.add(0, 2, 2,  "菜单3").setIcon(R.drawable.icon03); 
                menu.add(0, 3, 3,  "菜单4"); 
                menu.add(0, 4, 4,  "菜单5"); 
                menu.add(0, 5, 5,  "菜单6"); 
                menu.add(0, 6, 6,  "菜单7").setIcon(R.drawable.icon04); 
                menu.add(0, 7, 7,  "菜单8").setIcon(R.drawable.icon05); 

                 return  true; 
        } 

         // 重写 onOptionsItemSelected 用以响应选项菜单 
        @Override 
         public  boolean onOptionsItemSelected(MenuItem item) { 
                 super.onOptionsItemSelected(item); 
                 
                Toast.makeText(Main. this,  "被单击的菜单项为：" + String.valueOf(item.getItemId()), Toast.LENGTH_SHORT).show(); 

                 return  false; 
        } 
}

 

 

OK
[源码下载]

     本文转自webabcd 51CTO博客，原文链接： http://blog.51cto.com/webabcd/342009 ，如需转载请自行联系原作者