自定义控件之圆形viewpager导航circleindicator

本文主要是做一个和viewpager联动的圆形指示器,圆的半径颜色都可以在布局文件中指定。但是本文没做。

自定义控件之圆形viewpager导航circleindicator_第1张图片
Paste_Image.png
public class CircleIndicator2 extends View {
    //默认圆半径
    private int radius=15;
    //当前指示圆半径
    private float selectedRadius;
    private int width;
    private int count;
    private Paint paint;
    private Paint selectedPaint;
    private int height;
    private float current;
    public CircleIndicator2(Context context) {
        this(context,null);
    }
    public CircleIndicator2(Context context, AttributeSet attrs) {
        this(context, attrs,0);
    }
    public CircleIndicator2(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        //默认圆画笔
        paint = new Paint();
        paint.setAntiAlias(true);
        paint.setColor(Color.GRAY);
        //当前指示圆画笔
        selectedPaint = new Paint();
        selectedPaint.setAntiAlias(true);
        selectedPaint.setColor(Color.RED);
    }
    @Override 
   protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        height = getMeasuredHeight();
        width = getMeasuredWidth();
    }
    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        //这个距离如下图所示
        int distance=width/(count+1);
        //灰色圆
        for(int i=0;i

补充说明

自定义控件之圆形viewpager导航circleindicator_第2张图片
Paste_Image.png

布局文件



    
    

代码中使用

public class MainActivity extends AppCompatActivity {
    private ArrayList tabs;
    @Override    protected void onCreate(Bundle
 savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        ViewPager viewPager= (ViewPager)findViewById(R.id.viewpager);
        CircleIndicator2 circleIndicator= (CircleIndicator2)findViewById(R.id.circleview);
        SimpleFragment one=SimpleFragment.instance("one");
        SimpleFragment two=SimpleFragment.instance("two");
        SimpleFragment three=SimpleFragment.instance("three");
        SimpleFragment four=SimpleFragment.instance("four");
        SimpleFragment five=SimpleFragment.instance("five");
        SimpleFragment six=SimpleFragment.instance("six");
        tabs = new ArrayList<>();
        tabs.add(one);
        tabs.add(two);
        tabs.add(three);
        tabs.add(four);
        tabs.add(five);
        tabs.add(six);
        viewPager.setAdapter(new FragmentPagerAdapter(getSupportFragmentManager()) {
            @Override
            public Fragment getItem(int position) {
                return tabs.get(position);
            }
            @Override
            public int getCount() {
                return tabs.size();     
          } 
       });
        circleIndicator.setUpWithViewPager(viewPager);
    }
}

viewpager中用到的fragment

public class SimpleFragment extends Fragment {
    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        return inflater.inflate(R.layout.fragment_layout,container,false);
    }
    @Override
    public void onViewCreated(View view, @Nullable Bundle savedInstanceState) {
        super.onViewCreated(view, savedInstanceState);
        String content=getArguments().getString("content");
        TextView tv= (TextView) view.findViewById(R.id.tv);
        tv.setText(content);
    }
    public static SimpleFragment instance(String content){
        SimpleFragment simpleFragment=new SimpleFragment();
        Bundle bundle=new Bundle();
        bundle.putString("content",content);
        simpleFragment.setArguments(bundle);
        return simpleFragment;
    }
}

你可能感兴趣的:(自定义控件之圆形viewpager导航circleindicator)