Android实战简易教程<四>（ScrollView和HorizontalScrollView动态添加控件并提供事件监听）

一、ScrollView

由于手机屏幕的高度有限，在面对组件要显示多组信息时，ScrollView视图（滚动视图）可以有效的安排这些组件，浏览时可以自动的进行滚屏的操作。

ScrollView视图的定义格式如下：

[html] view plaincopy

1. <?xml version="1.0" encoding="utf-8"?>  
2. <ScrollView   
3.     xmlns:android="http://schemas.android.com/apk/res/android"  
4.     android:layout_width="fill_parent"  
5.     android:layout_height="fill_parent"  
6.     android:id="@+id/myscroll">  
7. <LinearLayout  
8.     android:layout_width="fill_parent"  
9.     android:layout_height="wrap_content"  
10.     android:orientation="vertical"  
11.     android:id="@+id/mylinear" >  
12. </LinearLayout>  
13. </ScrollView>  

这里需要注意的是：滚动视图的使用形式和各个布局管理器的操作形式类似，唯一不同的是所有的布局管理器中均可以包含多个组件，而滚动视图中只能有一个组件。否则会报错，可以自行测试！

下面看一下MainActivity程序：

[java] view plaincopy

1. package org.lxh.demo;  
2.   
3. import android.app.Activity;  
4. import android.os.Bundle;  
5. import android.view.View;  
6. import android.view.ViewGroup;  
7. import android.view.View.OnClickListener;  
8. import android.widget.Button;  
9. import android.widget.LinearLayout;  
10. import android.widget.Toast;  
11.   
12. public class Hello extends Activity {  
13.     String str[] = { "1", "2", "3", "4", "5", "6", "7", "8", };  
14.   
15.     public void onCreate(Bundle savedInstanceState) {  
16.         super.onCreate(savedInstanceState); // 生命周期方法  
17.         super.setContentView(R.layout.main); // 设置要使用的布局管理器  
18.         LinearLayout linear = (LinearLayout) super.findViewById(R.id.mylinear);// 取得组件  
19.         LinearLayout.LayoutParams param = new LinearLayout.LayoutParams(  
20.                 ViewGroup.LayoutParams.FILL_PARENT,  
21.                 ViewGroup.LayoutParams.WRAP_CONTENT);// 定义按钮的布局参数  
22.         for (int i = 0; i < this.str.length; i++) {  
23.             Button btn = new Button(this);// 创建按钮组件  
24.             btn.setText(this.str[i]);// 设置文本  
25.             btn.setId(i);  
26.             linear.addView(btn, param);// 增加组件  
27.             btn.setOnClickListener(new OnClickListenerImpl());  
28.   
29.         }  
30.   
31.     }  
32.   
33.     private class OnClickListenerImpl implements OnClickListener {  
34.   
35.         public void onClick(View v) {  
36.             switch (v.getId()) {  
37.             case 0:  
38.                 Toast.makeText(Hello.this, "您选择了按钮1！", Toast.LENGTH_SHORT)  
39.                         .show();  
40.                 break;  
41.             case 1:  
42.                 Toast.makeText(Hello.this, "您选择了按钮2！", Toast.LENGTH_SHORT)  
43.                         .show();  
44.                 break;  
45.             case 2:  
46.                 Toast.makeText(Hello.this, "您选择了按钮3！", Toast.LENGTH_SHORT)  
47.                         .show();  
48.                 break;  
49.             case 3:  
50.                 Toast.makeText(Hello.this, "您选择了按钮4！", Toast.LENGTH_SHORT)  
51.                         .show();  
52.                 break;  
53.             case 4:  
54.                 Toast.makeText(Hello.this, "您选择了按钮5！", Toast.LENGTH_SHORT)  
55.                         .show();  
56.                 break;  
57.             case 5:  
58.                 Toast.makeText(Hello.this, "您选择了按钮6！", Toast.LENGTH_SHORT)  
59.                         .show();  
60.                 break;  
61.             case 6:  
62.                 Toast.makeText(Hello.this, "您选择了按钮7！", Toast.LENGTH_SHORT)  
63.                         .show();  
64.                 break;  
65.             case 7:  
66.                 Toast.makeText(Hello.this, "您选择了按钮8！", Toast.LENGTH_SHORT)  
67.                         .show();  
68.                 break;  
69.             case 8:  
70.                 Toast.makeText(Hello.this, "您选择了按钮8！", Toast.LENGTH_SHORT)  
71.                         .show();  
72.                 break;  
73.   
74.             default:  
75.                 break;  
76.             }  
77.   
78.         }  
79.   
80.     }  
81. }  

运行实例：

 

二、HorizontalScrollView

首先定义主布局文件main.xml

[html] view plaincopy

1. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
2.     xmlns:tools="http://schemas.android.com/tools"  
3.     android:layout_width="match_parent"  
4.     android:layout_height="match_parent" >  
5.   
6.     <HorizontalScrollView  
7.         android:layout_width="wrap_content"  
8.         android:layout_height="150dp"  
9.         android:layout_gravity="center_vertical"  
10.         android:background="#AA444444"  
11.         android:scrollbars="none" >  
12.   
13.         <LinearLayout  
14.             android:id="@+id/id_gallery"  
15.             android:layout_width="wrap_content"  
16.             android:layout_height="wrap_content"  
17.             android:layout_gravity="center_vertical"  
18.             android:orientation="horizontal"  
19.             android:scrollbars="horizontal" >  
20.         </LinearLayout>  
21.     </HorizontalScrollView>  
22.   
23. </LinearLayout>  

然后定义activity_index_gallery_item.xml

[html] view plaincopy

1. <?xml version="1.0" encoding="utf-8"?>  
2. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"  
3.     android:layout_width="120dp"  
4.     android:layout_height="130dp"  
5.     android:background="@android:color/white" >  
6.   
7.     <ImageView  
8.         android:id="@+id/id_index_gallery_item_image"  
9.         android:layout_width="80dp"  
10.         android:layout_height="80dp"  
11.         android:layout_alignParentTop="true"  
12.         android:layout_centerHorizontal="true"  
13.         android:layout_margin="5dp"  
14.         android:scaleType="centerCrop" />  
15.   
16.     <TextView  
17.         android:id="@+id/id_index_gallery_item_text"  
18.         android:layout_width="wrap_content"  
19.         android:layout_height="wrap_content"  
20.         android:layout_below="@id/id_index_gallery_item_image"  
21.         android:layout_centerHorizontal="true"  
22.         android:layout_marginBottom="5dp"  
23.         android:layout_marginTop="5dp"  
24.         android:textColor="#ff0000"  
25.         android:textSize="12dp" />  
26.   
27. </RelativeLayout>  

MainActivity程序如下：

[java] view plaincopy

1. package org.yayun.demo;  
2.   
3. import android.app.Activity;  
4. import android.os.Bundle;  
5. import android.view.LayoutInflater;  
6. import android.view.View;  
7. import android.view.Window;  
8. import android.view.View.OnClickListener;  
9. import android.widget.ImageView;  
10. import android.widget.LinearLayout;  
11. import android.widget.TextView;  
12. import android.widget.Toast;  
13.   
14. public class MainActivity extends Activity {  
15.   
16.     private LinearLayout mGallery;  
17.     private int[] mImgIds;  
18.     private LayoutInflater mInflater;  
19.   
20.     @Override  
21.     protected void onCreate(Bundle savedInstanceState) {  
22.         super.onCreate(savedInstanceState);  
23.         requestWindowFeature(Window.FEATURE_NO_TITLE);  
24.         setContentView(R.layout.main);  
25.         mInflater = LayoutInflater.from(this);  
26.         initData();  
27.         initView();  
28.   
29.     }  
30.   
31.     private void initData()// 初始化数据  
32.     {  
33.         mImgIds = new int[] { R.drawable.a, R.drawable.b, R.drawable.c,  
34.                 R.drawable.d, R.drawable.e, };  
35.     }  
36.   
37.     private void initView()// 填充数据  
38.     {  
39.   
40.         mGallery = (LinearLayout) findViewById(R.id.id_gallery);  
41.   
42.         for (int i = 0; i < mImgIds.length; i++) {  
43.   
44.             View view = mInflater.inflate(R.layout.activity_index_gallery_item,// 找到布局文件  
45.                     mGallery, false);  
46.             ImageView img = (ImageView) view  
47.                     .findViewById(R.id.id_index_gallery_item_image);// 找到图片控件  
48.             img.setImageResource(mImgIds[i]);  
49.             img.setId(i);  
50.             img.setOnClickListener(new OnClickListenerImpl());  
51.             TextView txt = (TextView) view  
52.                     .findViewById(R.id.id_index_gallery_item_text);  
53.             txt.setText("some info ");  
54.   
55.             mGallery.addView(view);  
56.   
57.         }  
58.     }  
59.     private class OnClickListenerImpl implements OnClickListener{  
60.   
61.         public void onClick(View v) {  
62.             switch (v.getId()) {  
63.             case 0:  
64.                 Toast.makeText(MainActivity.this, "图片a", Toast.LENGTH_SHORT).show();  
65.                 break;  
66.             case 1:  
67.                 Toast.makeText(MainActivity.this, "图片b", Toast.LENGTH_SHORT).show();  
68.                 break;  
69.             case 2:  
70.                 Toast.makeText(MainActivity.this, "图片c", Toast.LENGTH_SHORT).show();  
71.                 break;  
72.             case 3:  
73.                 Toast.makeText(MainActivity.this, "图片d", Toast.LENGTH_SHORT).show();  
74.                 break;  
75.             case 4:  
76.                 Toast.makeText(MainActivity.this, "图片e", Toast.LENGTH_SHORT).show();  
77.                 break;  
78.   
79.             default:  
80.                 break;  
81.             }  
82.               
83.         }  
84.           
85.     }  
86.   
87. }  

运行实例如下：