代码拉取完成,页面将自动刷新
100个经典UI设计模板,干货满满。拿来即用
见效果图:
详情看博客:
【MyAndroid】viewpage+cardView卡片叠层效果展示(2)--100个经典UI设计模板(98/100)
参考代码示例如下:
ImageView iv1 = (ImageView) LayoutInflater.from(this).inflate(R.layout.banner_item,bannerViewPager,false);
ImageView iv2 = (ImageView) LayoutInflater.from(this).inflate(R.layout.banner_item,bannerViewPager,false);
ImageView iv3 = (ImageView) LayoutInflater.from(this).inflate(R.layout.banner_item,bannerViewPager,false);
ImageView iv4 = (ImageView) LayoutInflater.from(this).inflate(R.layout.banner_item,bannerViewPager,false);
ImageView iv5 = (ImageView) LayoutInflater.from(this).inflate(R.layout.banner_item,bannerViewPager,false);
final ImageView iv6 = (ImageView) LayoutInflater.from(this).inflate(R.layout.banner_item,bannerViewPager,false);
iv1.setImageResource(R.mipmap.ic_img01);
iv2.setImageResource(R.mipmap.ic_img02);
iv3.setImageResource(R.mipmap.ic_img03);
iv4.setImageResource(R.mipmap.ic_img04);
iv5.setImageResource(R.mipmap.ic_img05);
iv6.setImageResource(R.mipmap.ic_img06);
//一开始只添加5个Item
final List<ImageView> mViews = new ArrayList<>();
mViews.add(iv1);
mViews.add(iv2);
mViews.add(iv3);
mViews.add(iv4);
mViews.add(iv5);
bannerViewPager = findViewById(R.id.banner);
ViewPagerAdapter mAdapter = new ViewPagerAdapter(mViews, new OnPageClickListener() {
@Override
public void onPageClick(View view, int position) {
Log.d("cylog","position:"+position);
}
});
bannerViewPager.setAdapter(mAdapter);
int scrollState = ViewPager.SCROLL_STATE_IDLE;
private int lastValue = -1;
private boolean canMove = true;
ViewPager.OnPageChangeListener onPageChangeListener = new ViewPager.OnPageChangeListener() {
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
Log.i(TAG, "position=" + position + ",positionOffset=" + positionOffset + " ,positionOffsetPixels=" + positionOffsetPixels);
if (scrollState == ViewPager.SCROLL_STATE_DRAGGING) {
if (lastValue > positionOffsetPixels) {
Log.d(TAG, "向右滑动");
} else if (lastValue < positionOffsetPixels) {
Log.d(TAG, "向左滑动");
} else {
Log.e(TAG, "暂无法判断滑动方向");
}
if (0.0f == positionOffset && 0 == positionOffsetPixels) {
canMove = false;
} else {
canMove = true;
}
}
lastValue = positionOffsetPixels;
}
@Override
public void onPageSelected(int i) {
Log.d(TAG, "onPageSelected index=" + i);
setSelectedIndicator(i);
}
@Override
public void onPageScrollStateChanged(int i) {
Log.d(TAG, "onPageScrollStateChanged i=" + i);
if (ViewPager.SCROLL_STATE_DRAGGING == scrollState
&& i == ViewPager.SCROLL_STATE_IDLE
&& !canMove
) {
if ( 0==viewPager.getCurrentItem() ) {
Log.d(TAG, "已在第一页了" + viewPager.getCurrentItem());
}else{
Log.d(TAG, "已在最后一页了" + viewPager.getCurrentItem());
viewPager.setCurrentItem(0);
}
}
scrollState = i;
}
};
滑动到第一页或者最后一页 滑动参数
position=0,positionOffset=0.0 ,positionOffsetPixels=0
position=4,positionOffset=0.0 ,positionOffsetPixels=0
一共4页
过程中判断是从ViewPager.SCROLL_STATE_DRAGGING滑动到停止滑动ViewPager.SCROLL_STATE_IDLE,在状态还保存为ViewPager.SCROLL_STATE_DRAGGING依据canMove滑动标识为停止。 接着判断当前的页数在第一还是最后一页来判断。
Handler handler = new Handler();
//the interval between rollings
private int mAutoRollingTime = 5000;
private int mReleasingTime = 0;
/**
* This runnable decides the viewpager should roll to next page or wait.
*/
private Runnable mAutoRollingTask = new Runnable() {
@Override
public void run() {
if (isFinishing())
return;
int now = (int) System.currentTimeMillis();
int timediff = mAutoRollingTime;
if (mReleasingTime != 0) {
timediff = now - mReleasingTime;
}
if (scrollState == ViewPager.SCROLL_STATE_IDLE) {
//if user's finger just left the screen,we should wait for a while.
if (timediff >= mAutoRollingTime * 0.8) {
if (viewPager.getCurrentItem() == mViews.size() - 1) {
viewPager.setCurrentItem(0, true);
} else {
viewPager.setCurrentItem(viewPager.getCurrentItem() + 1, true);
}
}
}
}
};
@Override
public void onPageScrollStateChanged(int i) {
Log.d(TAG, "onPageScrollStateChanged i=" + i);
if (i!=ViewPager.SCROLL_STATE_IDLE) {
handler.removeCallbacks(mAutoRollingTask);
}else {
handler.postDelayed(mAutoRollingTask, mAutoRollingTime);
}
...
xml:
<com.example.indicatorlib.views.PageIndicatorView
android:id="@+id/pageIndicatorView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="48dp"
app:layout_constraintTop_toBottomOf="@id/banner"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
attrs:piv_padding="12dp"
attrs:piv_radius="8dp" />
java
PageIndicatorView pageIndicatorView = findViewById(R.id.pageIndicatorView);
pageIndicatorView.setViewPager(bannerViewPager.getViewPager());
pageIndicatorView.setAnimationType(AnimationType.WORM);//动画效果设置
位置StockActivity
核心代码如下
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
android:id="@+id/content_main"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
<android.support.constraint.Guideline
android:id="@+id/gl_start"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_begin="20dp" />
<!--返回-->
<ImageView
android:layout_marginTop="33dp"
android:id="@+id/iv_return"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="TODO"
android:src="@color/black_22"
app:layout_constraintStart_toStartOf="@id/gl_start"
app:layout_constraintTop_toTopOf="parent" />
<View
android:id="@+id/view_divider"
app:layout_constraintTop_toBottomOf="@id/iv_return"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
android:background="#F4F4F4"
android:layout_width="match_parent"
android:layout_height="5dp"
android:layout_marginTop="11dp"
></View>
<View
android:id="@+id/view_bg_list"
app:layout_constraintTop_toBottomOf="@id/view_divider"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
android:background="#FFF4F4F4"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginTop="12dp"
></View>
<android.support.v7.widget.RecyclerView
app:layout_constraintTop_toTopOf="@id/view_bg_list"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
android:id="@+id/recycler_view"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_alignParentStart="true"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
tools:background="@color/colorAccent">
</android.support.v7.widget.RecyclerView>
<top.lc951.myandroid.recelerview.StickyHeadContainer
app:layout_constraintTop_toTopOf="@id/view_bg_list"
app:layout_constraintStart_toStartOf="parent"
android:id="@+id/shc"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<include
layout="@layout/item_stock_sticky_head"/>
</top.lc951.myandroid.recelerview.StickyHeadContainer>
</android.support.constraint.ConstraintLayout>
java
StickyHeadContainer
。。。
public void scrollChild(int offset) {
if (mLastOffset != offset) {
mOffset = offset;
ViewCompat.offsetTopAndBottom(getChildAt(0), mOffset - mLastOffset);
}
mLastOffset = mOffset;
}
public int getChildHeight() {
return getChildAt(0).getHeight();
}
public void onDataChange(int stickyHeadPosition) {
if (mDataCallback != null && mLastStickyHeadPosition != stickyHeadPosition) {
mDataCallback.onDataChange(stickyHeadPosition);
}
if (null == mDataCallback) {
Log.w(TAG, "mDataCallback is null");
}
mLastStickyHeadPosition = stickyHeadPosition;
}
。。。
StockActivity#initView()
。。。
final StickyHeadContainer container = (StickyHeadContainer) findViewById(R.id.shc);
final TextView tvStockName = (TextView) container.findViewById(R.id.tv_stock_name);
final CheckBox checkBox = (CheckBox) container.findViewById(R.id.checkbox);
final TextView tvMore = (TextView) container.findViewById(R.id.tv_stock_more);
final ImageView more = (ImageView) container.findViewById(R.id.iv_more);
checkBox.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
@Override
public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
。。。
}
});
container.setDataCallback(new StickyHeadContainer.DataCallback() {
@Override
public void onDataChange(int pos) {
mStickyPosition = pos;
StockEntity.StockInfo item = mAdapter.getData().get(pos).getData();
tvStockName.setText(item.stickyHeadName);
checkBox.setChecked(item.check);
}
});
more.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
。。。
}
});
container.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
。。。
}
});
mRecyclerView = findViewById(R.id.recycler_view);
mRecyclerView.setLayoutManager(new LinearLayoutManager(StockActivity.this, LinearLayoutManager.VERTICAL, false));
StickyItemDecoration stickyItemDecoration = new StickyItemDecoration(container, RecyclerViewAdapter.TYPE_STICKY_HEAD);
stickyItemDecoration.setOnStickyChangeListener(new OnStickyChangeListener() {
@Override
public void onScrollable(int offset) {
container.scrollChild(offset);
container.setVisibility(View.VISIBLE);
}
@Override
public void onInVisible() {
container.reset();
container.setVisibility(View.INVISIBLE);
}
});
mRecyclerView.addItemDecoration(stickyItemDecoration);
mRecyclerView.addItemDecoration(new SpaceItemDecoration(mRecyclerView.getContext()));
mAdapter = new StockAdapter(null);
mAdapter.setItemClickListener(new OnItemClickListener<StockEntity.StockInfo>() {
@Override
public void onItemClick(View view, StockEntity.StockInfo data, int position) {
if(data.getItemType() == RecyclerViewAdapter.TYPE_DATA) {
Toast.makeText(StockActivity.this, "点击了TYPE_DATA Item", Toast.LENGTH_SHORT).show();
}else if(data.getItemType() == RecyclerViewAdapter.TYPE_STICKY_HEAD){
Toast.makeText(StockActivity.this, "点击了TYPE_STICKY_HEAD Item", Toast.LENGTH_SHORT).show();
}
}
});
。。。
一定要进行下面的初始化设置
container.setDataCallback(new StickyHeadContainer.DataCallback() {
@Override
public void onDataChange(int pos) {
mStickyPosition = pos;
StockEntity.StockInfo item = mAdapter.getData().get(pos).getData();
tvStockName.setText(item.stickyHeadName);
checkBox.setChecked(item.check);
}
});
public void onDataChange(int stickyHeadPosition) {
if (mDataCallback != null && mLastStickyHeadPosition != stickyHeadPosition) {
mDataCallback.onDataChange(stickyHeadPosition);
}
if (null == mDataCallback) {
Log.w(TAG, "mDataCallback is null");
}
mLastStickyHeadPosition = stickyHeadPosition;
}
效果如下图:
https://github.com/ycuwq/DatePicker
使用上比较简单
<com.ycuwq.datepicker.date.DatePicker
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintStart_toStartOf="parent"
android:id="@+id/dayPicker_dialog"
android:layout_width="match_parent"
android:layout_height="wrap_content">
</com.ycuwq.datepicker.date.DatePicker>
<com.ycuwq.datepicker.time.HourAndMinutePicker
android:id="@+id/hour_min_picker_dialog"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toBottomOf="@id/dayPicker_dialog"
android:layout_width="0dp"
android:layout_height="wrap_content"
/>
java
实现如下接口即可
YearPicker.OnYearSelectedListener
,MonthPicker.OnMonthSelectedListener
, DayPicker.OnDaySelectedListener
此处可能存在不合适展示的内容,页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容,可点击提交进行申诉,我们将尽快为您处理。