标签:android 图片 gallery horizontalscrollview 监听器
本来,画廊式的图片浏览器,使用Android中的Gallery就能轻松完成,但是Google说Gallery每次切换图片时都要新建视图,造成太多的资源浪费,已经在安卓api 19之后被彻底废弃,Google推荐使用ViewPager或者HorizontalScrollView来实现Gallery的效果。网上对此的资料太杂,有部分资料写得太高深,完全看不懂。我搞了一个下午,才使用HorizontalScrollView完成画廊式的图片浏览器,如下图:
1、首先是对于res\values\strings.xml的修改,仅仅是修改了app的名字,没有什么特别的。补充的imageView_description在《【Android】图片资源的访问与网格式图片浏览器》(点击打开链接)中说过了,仅仅是为了解决Eclipse对ImageView中缺乏android:contentDescription的警告。之后把若干张图片拷贝到工程目录下的任意drawable-xxx文件夹,并且以小写字母、数字、下划线来命名。这里是把四张图片拷贝到drawable-hdpi中,连同自带的app图标,共五张图片。
<?xml version="1.0" encoding="utf-8"?> <resources> <string name="app_name">画廊式图片浏览器</string> <string name="action_settings">Settings</string> <string name="imageView_description">大图</string> </resources>2、之后修改MainActivity的布局文件,res\layout\activity_main.xml,布局思想如下:
其中除了绿色标注的部分用Java代码生成,其余部分都在activity_main.xml中生成,摆放一个图片视图ImageView与横向滚动视图HorizontalScrollView。
HorizontalScrollView的android:scrollbars="horizontal"代表水平滚动的时候显示滚动条,如果不像显示,请把其值设置为none。
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_gravity="center_horizontal" android:orientation="vertical" > <ImageView android:id="@+id/imageView1" android:layout_width="match_parent" android:layout_height="200dp" android:paddingTop="10dp" android:contentDescription="@string/imageView_description" /> <HorizontalScrollView android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_gravity="center_vertical" android:scrollbars="horizontal" > <LinearLayout android:id="@+id/linearLayout1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_vertical" android:orientation="horizontal" > </LinearLayout> </HorizontalScrollView> </LinearLayout>可以看到HorizontalScrollView是这样用的,其下只是有且仅有一个android:orientation="horizontal"的、水平的LinearLayout,你要摆什么东西进横向滚动栏,通通都摆到这个LinearLayout里面。因此,即使我们要用Java代码操作HorizontalScrollView,也把id赋予给其里面的水平的LinearLayout,设置为。
3、之后是MainActivity.java,这段代码的主要目的是要在上述提到的linearLayout1中,生成一个垂直的自上而下的线性布局视图,里面放置一个ImageView与一个TextView。由于是垂直的自上而下的线性布局,这里无法设置里面的组件的垂直位置,也就是无法设置里面的图片视图放置在中央,标签文件放置在最底部。因此设定所有图片无论其原来的大小,都设置为80dp的高度,上下左右各留10的间距,之后再放置一个水平居中的字体。垂直的线性布局无法设置其组件的垂直位置,但水平位置还是可以的。反过来,水平的线性布局是无法设置其水平位置,只能设置其垂直位置。用Java代码生成布局与组件可以参考《【Android】利用Java代码布局,按钮添加点击事件》(点击打开链接)。
package com.galleryviewer; import android.os.Bundle; import android.view.Gravity; import android.view.View; import android.view.View.OnClickListener; import android.view.ViewGroup; import android.widget.ImageView; import android.widget.LinearLayout; import android.widget.LinearLayout.LayoutParams; import android.widget.TextView; import android.app.Activity; public class MainActivity extends Activity { private LinearLayout linearLayout1; private ImageView imageView1; private int[] imageId = new int[] { R.drawable.img1, R.drawable.img2, R.drawable.img3, R.drawable.img4, R.drawable.ic_launcher };// 把要显示的图片放到一个图片id数组里面便于操作 @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); // 获取组件 linearLayout1 = (LinearLayout) findViewById(R.id.linearLayout1); imageView1 = (ImageView) findViewById(R.id.imageView1); for (int i = 0; i < imageId.length; i++) { // 新建一个线性布局 LinearLayout linearLayout = new LinearLayout(this); // 设置新生成线性布局的参数,宽度为100,高度为匹配父组件,也就是水平滚动视图的高度 LayoutParams layoutParams = new LayoutParams(100, ViewGroup.LayoutParams.MATCH_PARENT); layoutParams.gravity = Gravity.CENTER_HORIZONTAL;// 设置线性布局内的组件水平居中 linearLayout.setOrientation(LinearLayout.VERTICAL);// 设置新生成的线性布局android:orientation="vertical" linearLayout.setLayoutParams(layoutParams);// 应用到新生成的线性布局 // 新建一个图片视图 ImageView imageView = new ImageView(this); imageView.setId(i + 20000);// 这里由于id不能为字符的缘故,所有对图片的id分别设为20000,20001,20002,...便于下面的图片点击监听器所控制 imageView.setImageResource(imageId[i]);// 将数组中的第i张图片放到图片视图 imageView.setAdjustViewBounds(true);// 自动缩放为宽高比 imageView.setMaxHeight(80);// 图片的高度为80dp imageView.setPadding(10, 10, 10, 10); imageView.setOnClickListener(new OnClickListener() { @Override public void onClick(View view) { imageView1.setImageResource(imageId[view.getId() - 20000]); // 把点击的图片id取出之后,减20000就是要显示的图片在图片数组的位置了。 } }); // 将图片视图加载到新生成的线性布局之中 linearLayout.addView(imageView); // 新生成一个标签文本 TextView textView = new TextView(this); textView.setText("图片" + i); textView.setTextSize(18); // 标签文本在水平位置居中 textView.setGravity(Gravity.CENTER); // 添加到新生成的线性布局之后 linearLayout.addView(textView); linearLayout1.addView(linearLayout); } } }这里同时也展示了,如何点击事件监听器OnClickListener的参数传递,OnClickListener是一个接口,其实现方法仅一个,这个实现方法中有一个参数View,这个View相当于网页Javascript编程中,给一个节点添加上点击事件之后onclick="xxx(this)"中的this,把被点击者的整个东西都传递到OnClickListener的监听器了,通过view.getId()可以取出被点击者的Id。这里不宜通过设置一个全局变量,传递到匿名内部类中,这种传参方式是错误的,无效的。
【Android】画廊式的图片浏览器,使用HorizontalScrollView取代Gallery,OnClickListener的参数传递
标签:android 图片 gallery horizontalscrollview 监听器
原文地址:http://blog.csdn.net/yongh701/article/details/46673465