初探android 集成轮播图、FlycoTabLayout_Lib以及安卓9.0的网络问题

最近正在学习android,学到轮播图和TabBar这块,就试着集成下android中youth.banner以及FlycoTabLayout_Lib现写篇文章记录一下,也希望能指引跟我一样新学android的可以有一个捷径

首先在APP下的build.gradle目录中下载所需要的库

dependencies {
    implementation fileTree(dir: 'libs', include: ['*.jar'])
    implementation 'com.android.support:appcompat-v7:28.0.0'
    implementation 'com.android.support.constraint:constraint-layout:1.1.3'
    testImplementation 'junit:junit:4.12'
    androidTestImplementation 'com.android.support.test:runner:1.0.2'
    androidTestImplementation 'com.android.support.test.espresso:espresso-core:3.0.2'
    implementation 'com.flyco.tablayout:FlycoTabLayout_Lib:2.1.2@aar'
    implementation 'com.jakewharton:butterknife:8.8.1'
    annotationProcessor 'com.jakewharton:butterknife-compiler:8.8.1'
    implementation 'com.youth.banner:banner:1.4.10'  //最新版本
    implementation 'com.github.bumptech.glide:glide:3.7.0'  //加载网络图片
}

第二步,在AndroidManifest.xml中添加网络请求权限

image.png

第三步,在activity_main.xml中写tab的控件和容器

第四步在MainActivity的Java文件中

public class MainActivity extends AppCompatActivity {

    @BindView(R.id.viewpager)
    ViewPager viewpager;
    @BindView(R.id.commonTabLayout)
    CommonTabLayout commonTabLayout;


    private String[] title = {"游戏", "音乐", "电影", "棋牌", "休闲", "棋牌", "休闲"};
//R.drawable.home是放在drawable下的图片
    private int[] iconUnSelect = {R.drawable.home, R.drawable.ear, R.drawable.home, R.drawable.home, R.drawable.home, R.drawable.home, R.drawable.home};

    private int[] iconSelect = {R.drawable.home_pressed, R.drawable.ear_pressed, R.drawable.home_pressed, R.drawable.home_pressed, R.drawable.home_pressed, R.drawable.home_pressed, R.drawable.home_pressed,};

    private ArrayList fragments = new ArrayList<>();

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        ButterKnife.bind(this);
        
        fragments.add(new TwoActivity());
        fragments.add(new OneActivity());

        fragments.add(new MyFragment());
        viewpager.setAdapter(new MyFragmentPageAdapter(getSupportFragmentManager(), fragments));
        
        ArrayList customTabEntityArrayList = new ArrayList<>();

        for (int i = 0; i < 3; i++) {
            final int temp = i;
            customTabEntityArrayList.add(new CustomTabEntity() {
                @Override
                public String getTabTitle() {
                    return title[temp];
                }

                @Override
                public int getTabSelectedIcon() {
                    return iconSelect[temp];
                }

                @Override
                public int getTabUnselectedIcon() {
                    return iconUnSelect[temp];
                }
            });

        }

        commonTabLayout.setTabData(customTabEntityArrayList);
        commonTabLayout.setOnTabSelectListener(new OnTabSelectListener() {
            @Override
            public void onTabSelect(int position) {
                viewpager.setCurrentItem(position);
            }

            @Override
            public void onTabReselect(int position) {

            }
        });

        //tabbar上的红点
      //  commonTabLayout.showMsg(0, 99);

    }
}

这里面需要注意的重要几点!!!

① 在FlycoTabLayout_Lib下,引用XML中的控件不在是

btnShow = (Button) this.findViewById(R.id.btn_show);
而是
@BindView(R.id.btn_show)
Button btn_show;

② fragments.add(new MyFragment());这段代码,是将VC添加到容器中,这里的MyFragment必须继承Fragment 其Java代码为

    @Nullable
    @Override
    public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        View view=inflater.inflate(R.layout.myfragment_layout,container,false);
        ButterKnife.bind(this, view);
        return view;
    }

③无论是MainActivity还是继承Fragment的Activity, ButterKnife.bind(this, view);这段代码一定要写,否者@BindView(R.id.btn_show) Button btn_show;的引用这为null,导致程序报错,这块是个坑

接下来是要创建轮播图啦,我是在activity_Two写的,首先

然后在TwoActivity中

public class TwoActivity extends Fragment {

    @BindView(R.id.banner)
    Banner banner;
    private List listBanner;

    @Nullable
    @Override
    public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        View view=inflater.inflate(R.layout.activity_two,container,false);
        ButterKnife.bind(this, view);

        listBanner=new ArrayList();
        listBanner.add("http://img1.3lian.com/2015/w7/85/d/101.jpg");
        listBanner.add("http://ww4.sinaimg.cn/large/006uZZy8jw1faic21363tj30ci08ct96.jpg");
        listBanner.add("http://ww4.sinaimg.cn/large/006uZZy8jw1faic259ohaj30ci08c74r.jpg");
        listBanner.add("http://ww4.sinaimg.cn/large/006uZZy8jw1faic2b16zuj30ci08cwf4.jpg");
        listBanner.add("http://ww4.sinaimg.cn/large/006uZZy8jw1faic2e7vsaj30ci08cglz.jpg");

        banner.setImages(listBanner).setImageLoader(new GlideImageLoader()).start();

        return view;
    }
    
}

集成轮播图还是特别简单的,不过这里还要最后一个知识点,也是坑了我半天的问题,那就是在Android8.1下就没问题,但是在Android9.0下,图片显示不出来,只显示出了page点,打印台打印

No Network Security Config specified, using platform default

这个问题是Android9.0以后的请求谷歌要就必须是HTTPS,解决办法就是

在 res 下新增一个 xml 目录，然后创建一个名为：network_security_config.xml 文件

image.png

文件中写

在AndroidManifest.xml文件下的application标签增加属性

 android:networkSecurityConfig="@xml/network_security_config"

image.png

完美搞定,由于我是iOS开发学的Android,所以有些词是iOS的名词用在Android中,不正确的地方欢迎指正,接受批评,欢迎大家评论发表意见,觉得写的不错点个赞就好

生命不息,代码不止!码农一枚,请多点赞