An abnormal horizontal ListView-like pile layout.

android-pile-layout

项目地址：xmuSistone/android-pile-layout

简介：An abnormal horizontal ListView-like pile layout.

captured images

The following pictures were captured earlier. Since the source code and the outputted-apk have changed some params, you will have a different UI when you directly run the code or install the apk file. Hope there has no confusions later.

design

Recently I have seen this kind of UI design, and at the first sight I was trying to implement it by using RecyclerView's LayoutManager. Unfortunately, I am unable to contrust a clear Math model while sliding the PileView. After several tries, I gave up LayoutManager, and find another way for this implementation. If you make LayoutManager works well for this UI design, please tell me later.

how to use

declare PileLayout in your xml file

<com.stone.pile.libs.PileLayoutandroid:id="@+id/pileLayout"android:layout_width="match_parent"android:layout_height="wrap_content"android:paddingBottom="5dp"android:paddingTop="5dp"pile:displayCount="1.5"pile:interval="10dp"pile:scaleStep="0.22"pile:widthHeightRate="1.22" />

Meanwhile, pileLayout is able to be customized by these 4 params:

name	format	description
interval	dimension	items-margin each other
sizeRatio	float	each item's height/witdth
scaleStep	float	size scale step when needed
displayCount	float	number of items that may display

in Java files:

pileLayout = (PileLayout) findViewById(R.id.pileLayout);
pileLayout.setAdapter(new PileLayout.Adapter() {@Overridepublic int getLayoutId() {// item's layout resource idreturn R.layout.item_layout;}@Overridepublic void bindView(View view, int position) {ViewHolder viewHolder = (ViewHolder) view.getTag();if (viewHolder == null) {viewHolder = new ViewHolder();viewHolder.imageView = (ImageView) view.findViewById(R.id.imageView);view.setTag(viewHolder);}// recycled view bind new position}@Overridepublic int getItemCount() {// item countreturn dataList.size();}@Overridepublic void displaying(int position) {// right displaying the left biggest itemView's position }@Overridepublic void onItemClick(View view, int position) {// on item click}
});