现在的位置: 首页 > 综合 > 正文

为ListView增加Header

2014年03月18日 ⁄ 综合 ⁄ 共 1242字 ⁄ 字号 评论关闭

要实现类似IMBd类似的布局。

m1
m2

可以看出它的列表上方的图片展示区和下面列表条目是一体的,在上下滚动的时候。而图片展示区不是列表条目。

当然可以分别实现,图片展示区用Gallery,下面用ListView,但是如果横屏,则ListView部分的高度将很短,不方便上下滚动选择。也可以强制竖屏,不过这样用户体验会变差。

其实ListView提供了Header,IMBd实现的图片展示区就是自定义的ListView Header。

写个简单的例子说明这个事情。先写个最简单的。

m3

这里的header就是一个TextView生成的ListView Header部分。在布局的Listview部分:

<ListView android:id="@+id/list" android:layout_width="fill_parent"
android:layout_height="fill_parent" />

在代码中在ListView中加入Header:

listView = (ListView) this.findViewById(R.id.list);
TextView textView = new TextView(this);
textView.setText("header");
listView.addHeaderView(textView);

源代码见:

http://easymorse.googlecode.com/svn/tags/video.demo-0.1.0/

Header部分是可以添加多个的,比如:

image

对Header再做进一步定制。见效果:

image

这里的Header部分使用了自定义视图。

首先要增加一个小房子的图:

image

然后,创建一个针对Header的layout:

image

该文件内容:

<?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" >
<ImageView android:src="@drawable/ic_menu_home"
android:layout_width="wrap_content" android:layout_height="wrap_content" />
</LinearLayout>

然后在代码中通过inflate的方式把layout加入到header。

listView.addHeaderView(LayoutInflater.from(this).inflate(
R.layout.table_title, null));

源代码见:

http://easymorse.googlecode.com/svn/tags/video.demo-0.1.1/

抱歉!评论已关闭.