ChanelView
廢話不多說,請看效果圖疯潭。
Chanel App效果圖 | 我實現(xiàn)的效果 |
---|---|
ChanelGIF.gif
|
MyChanel.gif
|
喜歡就去github star下,非常感謝o(∩_∩)o~~~
實現(xiàn)原理介紹
采用的是 豎行的ViewPage 來實現(xiàn)的两蟀,相信大家都知道怎么弄概说,然后就是在ViewPage的transformPage方法里面,里面要怎么樣的效果都可以自行修改碧注。
mVerticalViewPager.setPageTransformer(false, new ViewPager.PageTransformer() {
@Override
public void transformPage(View view, float position) {
int pageHeight = view.getHeight();
ImageView iv_picture=view.findViewById(R.id.iv_picture);
if (position < 1) {
view.setTranslationY(mOffset * position);
//移動文字
if (position >= 0) {
TextView tv_title2=(TextView) view.findViewById(R.id.tv_title2);
TextView tv_sign=(TextView)view. findViewById(R.id.tv_sign);
RelativeLayout layout_live_content=(RelativeLayout) view.findViewById(R.id.layout_live_content);
tv_title2.setAlpha((1-position));
iv_picture.setScaleX((float) ((1-position)*0.2+1));
iv_picture.setScaleY((float) ((1-position)*0.2+1));
float live_content_offset;
//如果在最后一個,則移動到底部50dp
if(tv_sign.getText().toString().trim().equals((list.size() -1))){
live_content_offset = pageHeight - MainActivity.this.getResources().getDimension(R.dimen.DIMEN_120DP);
} else {
live_content_offset = pageHeight - MainActivity.this.getResources().getDimension(R.dimen.DIMEN_300DP);
}
layout_live_content.setTranslationY(live_content_offset * (1 - position));
}
} else { // (1,+Infinity]
view.setTranslationY(-pageHeight * (position - 1) + (mOffset + (position - 1) * (-mOffset / 2)));
}
}
});