Effect picture:
The viewpager with this effect is still used a lot in the project. Not much to say, go directly to the code.
xml layout file:
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout 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" tools:context="com.sinosoft.mysupperapp.activity.BannerActivity"> <FrameLayout android:id="@+id/fl_pager" android:layout_width="match_parent" android:layout_height="160dp" android:clipChildren="false" android:background="#aadc71ff" > <android.support.v4.view.ViewPager android:id="@+id/viewpager" android:layout_width="match_parent" android:layout_marginLeft="60dp" android:layout_marginRight="60dp" android:clipChildren="false" android:layout_height="120dp" android:layout_gravity="center" > </android.support.v4.view.ViewPager> </FrameLayout> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_alignBottom="@id/fl_pager" android:background="#44000000" android:padding="5dp" android:orientation="vertical"> <TextViewandroid:id="@+id/tv_title" android:padding="3dp" android:layout_width="match_parent" android:layout_height="match_parent" android:text="精武门" android:textColor="#fff" android:gravity="center"/> <LinearLayout android:id="@+id/ll_point" android:layout_width="wrap_content" android:layout_height="wrap_content" android:orientation="horizontal" android:layout_gravity="center_horizontal"> </LinearLayout> </LinearLayout> </RelativeLayout>
MainActivity:
package com.sinosoft.mysupperapp.activity; import android.app.Activity; import android.os.Bundle; import android.os.Handler; import android.os.Message; import android.support.v4.view.PagerAdapter; import android.support.v4.view.ViewPager; import android.view.View; import android.view.ViewGroup; import android.widget.ImageView; import android.widget.LinearLayout; import android.widget.TextView; import com.sinosoft.mysupperapp.R; import butterknife.Bind; import butterknife.ButterKnife; public class BannerActivity extends Activity { private int[] images = {R.mipmap.title_01,R.mipmap.title_02,R.mipmap.title_03,R.mipmap.title_04}; private String[] title = {"精武门","黄飞鸿","霍元甲","陈真"}; private int pre_position = 0; @Bind(R.id.viewpager) ViewPager viewPager; @Bind(R.id.tv_title) TextView tv_title; @Bind(R.id.ll_point) LinearLayout ll_point; Handler handler; boolean isrunning = true; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_banner); ButterKnife.bind(this); for(int i=0;i<images.length;i++){ ImageView point = new ImageView(this); point.setBackgroundResource(R.drawable.point_selector); LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(20,20); if(i==0){ point.setEnabled(true); }else{ point.setEnabled(false); params.leftMargin = 8; } point.setLayoutParams(params); ll_point.addView(point); } //设置Page间间距 viewPager.setPageMargin(20); //设置缓存的页面数量 viewPager.setOffscreenPageLimit(3); viewPager.setAdapter(new MyViewPager(images)); tv_title.setText(title[0]); handler = new Handler(){ @Override public void handleMessage(Message msg) { if(msg.what==0){ //让ViewPager滑到下一页 viewPager.setCurrentItem(viewPager.getCurrentItem()+1); //延时,循环调用handler if(isrunning){ handler.sendEmptyMessageDelayed(0, 3000); } }; } }; new Thread(){ public void run() { Message message = Message.obtain(); message.what=0; handler.sendMessage(message); }; }.start(); viewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() { @Override public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) { } @Override public void onPageSelected(int position) { tv_title.setText(title[position%images.length]); //把上一个点设置为灰色 ll_point.getChildAt(pre_position).setEnabled(false); //把当前点设置为红色 ll_point.getChildAt(position%images.length).setEnabled(true); pre_position = position%images.length; } @Override public void onPageScrollStateChanged(int state) { } }); } class MyViewPager extends PagerAdapter{ int[] data; public MyViewPager(int[] data){ this.data = data; } @Override public int getCount() { return Integer.MAX_VALUE; } @Override public boolean isViewFromObject(View view, Object object) { return view==object; } @Override public Object instantiateItem(ViewGroup container, int position) { ImageView imageView = new ImageView(BannerActivity.this); imageView.setScaleType(ImageView.ScaleType.FIT_XY);//ͼƬ-ʬ int img = data[position % data.length]; imageView.setImageResource(img); container.addView(imageView,0); return imageView; } @Override public void destroyItem(ViewGroup container, int position, Object object) { container.removeView((View)object); } } @Override protected void onDestroy() { super.onDestroy(); isrunning = false; } }
drawable文件:
point_selector:
<?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:state_enabled="false" android:drawable="@drawable/point_normal" /> <item android:state_enabled="true" android:drawable="@drawable/point_press"></item>
</selector>
point_normal:
<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval"> <size android:width="8dp" android:height="8dp"/> <solid android:color="#44000000"/> </shape>
point_press:
<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval"> <size android:width="8dp" android:height="8dp"/> <solid android:color="#ff0000"/>
</shape>
好了,大功告成。最后部分代码来自洪洋大神的微博:https://blog.csdn.net/lmj623565791/article/details/51339751
希望能帮助到大家。