Android简易实战教程--第四十四话《ScrollView和HorizontalScrollView简单使用》
一、ScrollView
由于手机屏幕的高度有限,当普通布局放不下现实和的内容时,ScrollView视图(滚动视图)就会派上用场,因为数据可以往下滚动显示。
二、HorizontalScrollView
看名称就清楚,当想在水平方向想放置更多的空间,屏幕宽度放不下的时候,它就派上用场了。因为用法非常简单,跟ScrollView一样只不过是个父容器,所以我结合上面的案例,把HorizontalScrollView放到了ScrollView里面。这样通过一个案例,同时学习了两个组件的使用,机智如我~
为了程序的可读性,直接上完整代码了:
总布局:<?xml version="1.0" encoding="utf-8"?> <ScrollView xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/myscroll" android:layout_width="fill_parent" android:layout_height="fill_parent" > <LinearLayout android:id="@+id/mylinear" android:layout_width="fill_parent" android:layout_height="wrap_content" android:orientation="vertical" > <ImageView android:layout_width="match_parent" android:layout_height="150dp" android:scaleType="centerCrop" android:src="@drawable/recommend_61" /> <HorizontalScrollView android:background="#99cccccc" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_vertical" android:scrollbars="none" > <LinearLayout android:id="@+id/id_gallery" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_vertical" android:orientation="horizontal" > </LinearLayout> </HorizontalScrollView> </LinearLayout> <!-- android:scrollbars="none" --> </ScrollView>
因为我要在HorizontalScrollView的基础上,继续嵌套控件,因此定义了一个item的布局:activity_index_gallery_item.xml
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="wrap_content" android:layout_height="200dp" android:orientation="vertical" > <ImageView android:id="@+id/id_index_gallery_item_image" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="5dp" android:scaleType="centerCrop" android:src="@drawable/home01" /> <TextView android:id="@+id/id_index_gallery_item_text" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="5dp" android:text="哈哈" android:layout_gravity="center_horizontal" android:textColor="#ff0000" android:textSize="12dp" /> </LinearLayout>最后活动中的代码。稍作修改:
package com.example.test; import android.app.Activity; import android.os.Bundle; import android.view.View; import android.view.View.OnClickListener; import android.view.ViewGroup; import android.widget.Button; import android.widget.ImageView; import android.widget.LinearLayout; import android.widget.TextView; import android.widget.Toast; public class MainActivity extends Activity { String str[] = { "1", "2", "3", "4", "5", "6", "7", "8", }; private int[] images = {R.drawable.home01,R.drawable.home02,R.drawable.home03,R.drawable.home04}; public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); super.setContentView(R.layout.activity_main); //初始设置按钮 initBtn(); //初始设置HorizontalScrollView initHorizontalScrollView(); } private void initBtn() { //拿到线性布局容器 LinearLayout linear = (LinearLayout) super.findViewById(R.id.mylinear);// 取得组件 //设置按钮的大小参数 LinearLayout.LayoutParams params = new LinearLayout.LayoutParams( ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT);// 定义按钮的布局参数 ,宽度充满父容器,高度包裹内容 for (int i = 0; i < str.length; i++) { //动态添加按钮 Button btn = new Button(this);// 创建按钮组件 btn.setText(this.str[i]);// 设置文本 //给每个按钮都设置id编号(可通过btn.getId()获取对应的id编号) btn.setId(i); //参数设置给按钮 btn.setLayoutParams(params); linear.addView(btn);// 线性布局增加孩子组件 btn.setOnClickListener(new OnClickListenerImpl()); } } private void initHorizontalScrollView() { //HorizontalScrollView的孩子容器 LinearLayout mGallery = (LinearLayout) findViewById(R.id.id_gallery); //给孩子容器添加控件 for (int i = 0; i < images.length; i++) { //控件以布局的形式引入 View view = View.inflate(this, R.layout.activity_index_gallery_item, null); //设置图片资源数据 ImageView img = (ImageView) view .findViewById(R.id.id_index_gallery_item_image);// 找到显示图片的控件 img.setImageResource(images[i]); img.setId(i); TextView txt = (TextView) view .findViewById(R.id.id_index_gallery_item_text); txt.setText("我是图片"+i); mGallery.addView(view); } } private class OnClickListenerImpl implements OnClickListener { public void onClick(View v) { switch (v.getId()) { case 0: Toast.makeText(MainActivity.this, "您选择了按钮1!", Toast.LENGTH_SHORT) .show(); break; case 1: Toast.makeText(MainActivity.this, "您选择了按钮2!", Toast.LENGTH_SHORT) .show(); break; case 2: Toast.makeText(MainActivity.this, "您选择了按钮3!", Toast.LENGTH_SHORT) .show(); break; case 3: Toast.makeText(MainActivity.this, "您选择了按钮4!", Toast.LENGTH_SHORT) .show(); break; case 4: Toast.makeText(MainActivity.this, "您选择了按钮5!", Toast.LENGTH_SHORT) .show(); break; case 5: Toast.makeText(MainActivity.this, "您选择了按钮6!", Toast.LENGTH_SHORT) .show(); break; case 6: Toast.makeText(MainActivity.this, "您选择了按钮7!", Toast.LENGTH_SHORT) .show(); break; case 7: Toast.makeText(MainActivity.this, "您选择了按钮8!", Toast.LENGTH_SHORT) .show(); break; default: break; } } } }
运行效果如下:
您如果是正处于学习阶段,真诚的邀请您加入刚建立的群交流Android技术,一起学习:
Android开发交流群:497646615
也可以关注Android程序员开发指南 公众号您看一看文章也就5-10分钟,笔者要花1个多小时才能完成,一起讨论问题哈。公众号二维码: