分类图片列表简单实现
使用了开源代码:
?
直接看布局:
activity_main.xml
<?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:background="#ffffff" android:orientation="vertical" > <!-- 这个例子为了讲怎么使用StickyScrollView实现不完全一致样式的界面，这里一开始是一张张的图片，中间再插入一个专辑类的界面，最后又是一张张图片 --> <com.emilsjolander.components.StickyScrollViewItems.StickyScrollView android:layout_width="match_parent" android:layout_height="wrap_content" > <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="vertical" > <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_margin="5dp" android:orientation="horizontal" > <include layout="@layout/image_item" /> <include layout="@layout/image_item" /> </LinearLayout> <!-- 插入专辑的设计界面 --> <!-- sticky-nonconstant-hastransparancy适合设置在layout里，如果直接设置在如下面的textview时，最后浮那一层宽没有充满全屏，而且靠左边，而不是距中显示，故外套一层可以简单解决这问题 --> <LinearLayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_gravity="center_horizontal" android:layout_marginBottom="5dp" android:layout_marginTop="5dp" android:tag="sticky-nonconstant-hastransparancy" > <TextView android:layout_width="fill_parent" android:layout_height="20dp" android:layout_marginLeft="10dp" android:layout_marginRight="10dp" android:background="@drawable/textcover" android:gravity="center_horizontal" android:text="一场别开生面的会议" android:textColor="#000000" android:textSize="13sp" android:textStyle="normal" /> </LinearLayout> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_margin="5dp" android:orientation="horizontal" > <include layout="@layout/image_item" /> <include layout="@layout/image_item" /> </LinearLayout> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_margin="5dp" android:orientation="horizontal" > <include layout="@layout/image_item" /> <include layout="@layout/image_item" /> </LinearLayout> <!-- 结束层 --> <FrameLayout android:layout_width="fill_parent" android:layout_height="20dp" android:layout_marginLeft="10dp" android:layout_marginRight="10dp" > <View android:layout_width="fill_parent" android:layout_height="1dip" android:layout_gravity="center" android:background="#F4F4F4" /> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" android:background="#FFFFFF" android:text=" 结束 " android:textColor="#000000" android:textStyle="normal" /> </FrameLayout> <!-- 多加这个设置为透明的层，为了到结束标记处时，将图片主题的层顶掉 --> <LinearLayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_gravity="center_horizontal" android:tag="sticky-nonconstant-hastransparancy" > <TextView android:layout_width="fill_parent" android:layout_height="1dp" android:background="@drawable/textcover2" /> </LinearLayout> <!-- 结束专辑的设计界面 --> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_margin="5dp" android:orientation="horizontal" > <include layout="@layout/image_item" /> <include layout="@layout/image_item" /> </LinearLayout> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_margin="5dp" android:orientation="horizontal" > <include layout="@layout/image_item" /> <include layout="@layout/image_item" /> </LinearLayout> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_margin="5dp" android:orientation="horizontal" > <include layout="@layout/image_item" /> <include layout="@layout/image_item" /> </LinearLayout> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_margin="5dp" android:orientation="horizontal" > <include layout="@layout/image_item" /> <include layout="@layout/image_item" /> </LinearLayout> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_margin="5dp" android:orientation="horizontal" > <include layout="@layout/image_item" /> <include layout="@layout/image_item" /> </LinearLayout> </LinearLayout> </com.emilsjolander.components.StickyScrollViewItems.StickyScrollView></LinearLayout>
?
带文字的单个图片的布局代码
image_item.xml
<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_margin="5dp" android:layout_weight="1" android:background="#e8e8e8" android:orientation="vertical" android:padding="5dp" > <ImageView android:id="@+id/class_image_iv" android:layout_width="wrap_content" android:layout_height="wrap_content" android:scaleType="fitXY" android:src="@drawable/bb" /> <RelativeLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_alignBottom="@id/class_image_iv" android:background="@drawable/imagecover" android:orientation="horizontal" > <TextView android:id="@+id/album_time" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentLeft="true" android:paddingLeft="5dp" android:text="2014-01-18" android:textColor="#FFFFFF" android:textStyle="normal" /> <TextView android:id="@+id/album_author" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentRight="true" android:paddingRight="5dp" android:text="刘艳芳" android:textColor="#FFFFFF" android:textStyle="normal" /> </RelativeLayout></RelativeLayout>
?
?
效果图:
?
?
例子见附件
?
