一个炒鸡好用的 indicator 开源指示器

淩亂°似流年 2022-07-20 12:29 184阅读 0赞

--------------------

github 地址: [https://github.com/ongakuer/CircleIndicator][https_github.com_ongakuer_CircleIndicator]

*  xml 布局文件

<?xml version="1.0" encoding="utf-8"?>
    <LinearLayout 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" android:gravity="center" android:orientation="vertical">
    
        <FrameLayout android:layout_width="match_parent" android:layout_height="match_parent">
    
            <android.support.v4.view.ViewPager android:id="@+id/vp_image" android:layout_width="match_parent" android:layout_height="match_parent">
    
            </android.support.v4.view.ViewPager>
    
            <me.relex.circleindicator.CircleIndicator android:id="@+id/indicator" android:layout_width="match_parent" android:layout_height="40dp" app:ci_drawable="@drawable/dot_selector" app:ci_drawable_unselected="@drawable/dot_unselector">
    
            </me.relex.circleindicator.CircleIndicator>
        </FrameLayout>
    
    </LinearLayout>

*  drawable 下面画出自己的指示器样式 dot\_selector.xml

<?xml version="1.0" encoding="utf-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval" >
        <solid android:color="@color/colorAccent"/>
    
        <stroke android:width="1dp" android:color="@color/colorAccent" />
        <size android:width="20dp" android:height="20dp" />
    
    
    </shape>

*  dot\_unselector

<?xml version="1.0" encoding="utf-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval" >
        <solid android:color="#005509"/>
    
        <stroke android:width="1dp" android:color="#005509" />
        <size android:width="20dp" android:height="20dp" />
    
    </shape>

*  java代码

package com.example.indecater;
    
    import android.support.v4.view.PagerAdapter;
    import android.support.v4.view.ViewPager;
    import android.support.v7.app.AppCompatActivity;
    import android.os.Bundle;
    import android.view.View;
    import android.view.ViewGroup;
    import android.widget.ImageView;
    
    import java.util.ArrayList;
    
    import me.relex.circleindicator.CircleIndicator;
    
    public class MainActivity extends AppCompatActivity { 
    
        int [] images = {R.mipmap.bg_welcome_huawei1,R.mipmap.bg_welcome_huawei2,
                        R.mipmap.bg_welcome_huawei3,R.mipmap.bg_welcome_huawei4
                        };
        private ArrayList<ImageView> arrayList;
    
    
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_main);
            ViewPager pager = (ViewPager) findViewById(R.id.vp_image);
            CircleIndicator indicator = (CircleIndicator) findViewById(R.id.indicator);
    
    
            arrayList = new ArrayList<>();
            for(int i = 0;i<images.length;i++){
                ImageView imageView = new ImageView(this);
                imageView.setBackgroundResource(images[i]);
                arrayList.add(imageView);
    
            }
    
            pager.setAdapter(new MyAdapter());
            indicator.setViewPager(pager);
    
    
        }
        class MyAdapter extends PagerAdapter{
    
            @Override
            public int getCount() {
                return images.length;
            }
    
            @Override
            public boolean isViewFromObject(View view, Object object) {
                return view == object;
            }
    
            @Override
            public Object instantiateItem(ViewGroup container, int position) {
                container.addView(arrayList.get(position));
    
    
                return arrayList.get(position);
            }
    
            @Override
            public void destroyItem(ViewGroup container, int position, Object object) {
                container.removeView((View)object);
            }
        }
    }

*  效果图

![Image 1][]  
![这里写图片描述][20160725111353874]

看最上面哦,下面是截图自带的,哈哈哈哈

[https_github.com_ongakuer_CircleIndicator]: https://github.com/ongakuer/CircleIndicator
[Image 1]: 
[20160725111353874]: /images/20220719/36c879f8122a4c008f7558ab22581312.png