分类图片列表简单实现
使用了开源代码:
直接看布局:
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>
效果图:
例子见附件
相关推荐
huha 2020-10-16
xfcyhades 2020-11-20
sgafdsg 2020-11-04
Michael 2020-11-03
fengyeezju 2020-10-14
ziyexiaoxiao 2020-10-14
业余架构师 2020-10-09
OuNuo0 2020-09-29
moses 2020-09-22
Angelia 2020-09-11
qinxu 2020-09-10
刘炳昭 2020-09-10
Nostalgiachild 2020-09-07
Nostalgiachild 2020-08-17
leavesC 2020-08-14
一青年 2020-08-13
AndroidAiStudy 2020-08-07
ydc0 2020-07-30
绿豆饼 2020-07-28