您的位置:首页 > 理论基础 > 计算机网络

HorizontalScrollView动态添加子view,并且设置每个子view的点击事件

2016-04-15 18:52 615 查看
        因为工作需要,设置一个滚动的条目,类似于腾讯新闻中,多个图片横向滚动;程序员就是这样,有需要我们就得通过代码来呈现。

       横向滚动,这个就是需要HorizontalScrollView这个控件。相信这也是大家的选择,我开始想到的也是这个,所以就开始了代码之旅。以前也没使用过,所以想先做个demo。下面就是demo的历程。

      想到了demo,所以在创建xml布局时,直接使用的根标签就是HorizontalScrollView,如下:

main_activity.xml

<pre name="code" class="html"><span style="font-size:12px;"><?xml version="1.0" encoding="utf-8"?>
<HorizontalScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/horizaotalscrollview" >

<LinearLayout
android:id="@+id/linearlayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal" >
</LinearLayout>

</HorizontalScrollView></span>



            好了,父布局做好了,接下来就是子view布局了,什么样子呢?下面就是了(当然了,这是我的demo中的,个人根据自己需要,可以修改):

item.xml

<span style="font-size:12px;"><?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:gravity="center_horizontal">

<ImageView
android:id="@+id/img"
android:layout_width="80dp"
android:layout_height="80dp"
android:src="@drawable/a"
android:layout_gravity="center"
android:scaleType="centerCrop"
android:layout_marginTop="20px"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"/>
<TextView
android:id="@+id/textview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="meinv"
android:layout_marginTop="20px"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
/>

</LinearLayout></span>
              现在父布局,子view都有了,那么接下来就是代码了。代码量很少,全部算起来不足80行(里面有些注释)。下面是主要代码部分(后面会有demo链接):

<span style="font-size:12px;">/**
* 初始化item
*/
private void initView() {
for (int i = 0; i < IMG_URLS.length; i++) {// 1、使用本地图片时,使用IMGS数组;2、使用网络图片时,使用IMG_URLS数组
View view = LayoutInflater.from(this).inflate(R.layout.item, null);
ImageView iv = (ImageView) view.findViewById(R.id.img);
// 设置本地图片
// iv.setImageResource(IMGS[i]);
//设置网络图片
Glide.with(this).load(IMG_URLS[i]).into(iv);
TextView tv = (TextView) view.findViewById(R.id.textview);
tv.setText("美女 第" + i + "位");
// 为item设置id
view.setId(i);
// 为item绑定数据
view.setTag("美女 第" + i + "位");
// 为item设置点击事件
view.setOnClickListener(this);
// 把item添加到父view中
mLinearLayout.addView(view);
}
}</span>


上面的是初始化子view的部分,并且设置了view的点击事件。其中的获取网络图片的部分,使用了Glide,这是个网络请求图片的框架,还是不错的,方便使用,喜欢的可以自己查查看,我把jar包链接放上,在最后。子view处理点击事件的部分在下面:

<span style="font-size:14px;">  <span style="font-size:12px;"> @Override
public void onClick(View v) {
// 获取item的id
int id = v.getId();
// 获取item绑定的数据
String content = (String) v.getTag();
for (int i = 0; i < IMGS.length; i++) {
if (i == id) {
Toast.makeText(this, content, Toast.LENGTH_LONG).show();
}
}
</span></span><span style="font-size:12px;">}</span>


以上就是基本的代码和解说了,希望多关注。

点击下载DEMO

点击下载Glide的jar包
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息