且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

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

更新时间:2022-09-09 17:00:45

[索引页]
[源码下载]


系出名门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, truetrue); 

                        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, truefalse); 
                         
                } 
        } 
         
         
        // 重写 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,如需转载请自行联系原作者