Android 具有動畫的 Viewpager滑動CircleIndicator指示器
阿新 • • 發佈：2019-02-14
1.自定義屬性：attrs.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<declare-styleable name="CircleIndicator">
<attr name="ci_radius" format="dimension" />
<attr name="ci_margin" format="dimension" />
<attr name="ci_background" format="color|integer" 2.自定義控制元件
import java.util.ArrayList;
import java.util.List;
import 3.顯示圓的動畫效果
import android.graphics.Paint;
import android.graphics.drawable.ShapeDrawable;
import android.graphics.drawable.shapes.Shape;
public class ShapeHolder {
private float x = 0, y = 0;//圓的x、y座標
private ShapeDrawable shape;
private int color;
private float alpha = 1f;
private Paint paint;
public void setPaint(Paint value) {
paint = value;
}
public Paint getPaint() {
return paint;
}
public void setX(float value) {
x = value;
}
public float getX() {
return x;
}
public void setY(float value) {
y = value;
}
public float getY() {
return y;
}
public void setShape(ShapeDrawable value) {
shape = value;
}
public ShapeDrawable getShape() {
return shape;
}
public int getColor() {
return color;
}
public void setColor(int value) {
shape.getPaint().setColor(value);
color = value;
}
public void setAlpha(float alpha) {
this.alpha = alpha;
shape.setAlpha((int) ((alpha * 255f) + .5f));
}
public float getWidth() {
return shape.getShape().getWidth();
}
public void setWidth(float width) {
Shape s = shape.getShape();
s.resize(width, s.getHeight());
}
public float getHeight() {
return shape.getShape().getHeight();
}
public void setHeight(float height) {
Shape s = shape.getShape();
s.resize(s.getWidth(), height);
}
public void resizeShape(final float width,final float height){
shape.getShape().resize(width,height);
}
public ShapeHolder(ShapeDrawable s) {
shape = s;
}
}4.main.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:CircleIndicator="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<android.support.v4.view.ViewPager
android:id="@+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center" >
</android.support.v4.view.ViewPager>
<com.example.circleindicator_master.CircleIndicator
android:id="@+id/indicator"
android:layout_width="match_parent"
android:layout_height="40dp"
android:layout_alignParentBottom="true"
CircleIndicator:ci_background="@android:color/white"
CircleIndicator:ci_gravity="center"
CircleIndicator:ci_margin="5dp"
CircleIndicator:ci_mode="outside"
CircleIndicator:ci_radius="10dp"
CircleIndicator:ci_selected_background="0xffe6454a" />
</RelativeLayout>
5.Maintivity
import java.util.ArrayList;
import java.util.List;
import java.util.Random;
import android.app.Activity;
import android.os.Bundle;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.view.View;
import android.view.ViewGroup;
public class MainActivity extends Activity {
private List<View> viewList;
private ViewPager viewPager;
private CircleIndicator circleIndicator;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initData();
viewPager = (ViewPager) findViewById(R.id.viewpager);
viewPager.setAdapter(pagerAdapter);
circleIndicator = (CircleIndicator) findViewById(R.id.indicator);
circleIndicator.setViewPager(viewPager);
}
private void initData(){
viewList = new ArrayList<View>();
Random random = new Random();
for(int i=0;i<5;i++){
View view = new View(this);
view.setBackgroundColor(0xff000000| random.nextInt(0x00ffffff));
viewList.add(view);
}
}
PagerAdapter pagerAdapter = new PagerAdapter() {
@Override
public boolean isViewFromObject(View arg0, Object arg1) {
return arg0 == arg1;
}
@Override
public int getCount() {
return viewList.size();
}
@Override
public void destroyItem(ViewGroup container, int position,
Object object) {
container.removeView(viewList.get(position));
}
@Override
public int getItemPosition(Object object) {
return super.getItemPosition(object);
}
@Override
public CharSequence getPageTitle(int position) {
return "title";
}
@Override
public Object instantiateItem(ViewGroup container, int position) {
container.addView(viewList.get(position));
return viewList.get(position);
}
};
}
//說明：在使用PagerAdapter時候，跟List<Vew>集合完美結合封裝起來，這裡不做封裝了，很簡單的。效果圖：
