初探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中添加网络请求权限

    <uses-permission android:name="android.permission.INTERNET" />
image.png

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

<?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"
    android:orientation="vertical"
    android:background="#ffffff"
    tools:context=".MainActivity">
    <android.support.v4.view.ViewPager
        android:id="@+id/viewpager"
        android:layout_gravity="top"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"/>
    <com.flyco.tablayout.CommonTabLayout
        android:gravity="bottom"
        app:tl_textUnselectColor="#cbcbcb"
        app:tl_iconGravity="TOP"
        android:background="#ffffff"
        app:tl_textSelectColor="#e66123"
        android:id="@+id/commonTabLayout"
        android:layout_width="match_parent"
        android:layout_gravity="bottom"
        app:tl_indicator_height="0dp"
        android:layout_height="50dp"
        android:layout_alignParentBottom="true"
        />

</RelativeLayout>

第四步在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<Fragment> 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<CustomTabEntity> 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写的,首先

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">
    <com.youth.banner.Banner
        android:id="@+id/banner"
        android:layout_width="match_parent"
        android:layout_height="240dp" />
</LinearLayout>

然后在TwoActivity中


public class TwoActivity extends Fragment {

    @BindView(R.id.banner)
    Banner banner;
    private List<String> 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<String>();
        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

文件中写

<?xml version="1.0" encoding="utf-8"?>
<network-security-config>
    <base-config cleartextTrafficPermitted="true" />
</network-security-config>
<!--手动允许开启http请求-->

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

 android:networkSecurityConfig="@xml/network_security_config"
image.png

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

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

©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

推荐阅读更多精彩内容

  • Android - 收藏集
    用两张图告诉你，为什么你的 App 会卡顿? - Android - 掘金 Cover 有什么料？ 从这篇文章中你...
    hw1212阅读 14,466评论 2赞 59
  • awesome-android
    afinalAfinal是一个android的ioc，orm框架 https://github.com/yangf...
    wgl0419阅读 11,466评论 1赞 9
  • awesome-android
    afinalAfinal是一个android的ioc，orm框架 https://github.com/yangf...
    passiontim阅读 15,651评论 2赞 45
  • 名字论
    名字，大家都有名字，虽然名字只是一个代号而已，但是一个好的名字会让人感觉倍有面子，一个差的名字不仅会让自己自卑...
    我是奢侈品阅读 3,641评论 0赞 2
  • iOS开发如何找到最上层控制器，也就是当前控制器
    有时候会有这样的需求：封装一个类，在这个类里统一处理某个事件，但是需要在最上层控制器里做操作，比如跳转操作，通过下...
    夜凉听风雨阅读 5,884评论 1赞 2