android基础控件(2)TabLayout+ViewPager实现选项卡

2.1 activity_main
<?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"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:orientation="vertical"
    android:background="#cfcfcf">
    <com.google.android.material.tabs.TabLayout
        android:layout_width="match_parent"
        android:layout_height="30dp"
        android:id="@+id/tab1"
        app:tabMode="scrollable"
        android:background="@color/colorPrimaryDark"/>
    <androidx.viewpager.widget.ViewPager
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/vp1"/>
</LinearLayout>
2.2 Main_Activity
public class MainActivity extends AppCompatActivity {
    private TabLayout tabLayout;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        viewPager=findViewById(R.id.vp1);
        tabLayout=findViewById(R.id.tab1);
        initViewpage();
    }
    private void initViewpage() {
        List<String> title=new ArrayList<>();
        title.add("精选");
        title.add("体育");
        title.add("巴萨");
        title.add("购物");
        title.add("明星");
        title.add("视频");
        title.add("健康");
        title.add("励志");
        title.add("图文");
        title.add("本地");
        title.add("动漫");
        title.add("搞笑");
        title.add("科技");
        for (int i=0;i<title.size();i++){
            tabLayout.addTab(tabLayout.newTab().setText(title.get(i)));
        }
        List<Fragment> fragments=new ArrayList<>();
        for (int i=0;i<title.size();i++){
            fragments.add(new ListFragment());
        }

        FragmentAdapter fragmentAdapter=new FragmentAdapter(getSupportFragmentManager(),fragments,title);
        viewPager.setAdapter(fragmentAdapter);
        tabLayout.setupWithViewPager(viewPager);
        tabLayout.setTabsFromPagerAdapter(fragmentAdapter);
    }
}
2.3 FragmentAdapter类
public class FragmentAdapter extends FragmentStatePagerAdapter {
    private  List<Fragment> mfragmentList;
    private List<String> mtitles;
    public  FragmentAdapter(FragmentManager fm, List<Fragment> fragmentList,List<String> titles){
        super(fm);
        this.mfragmentList=fragmentList;
        this.mtitles=titles;
    }
    @NonNull
    @Override
    public Fragment getItem(int position) {
        return mfragmentList.get(position);
    }
    @Override
    public int getCount() {
        return mfragmentList.size();
    }
    @Nullable
    @Override
    public CharSequence getPageTitle(int position) {
        return mtitles.get(position);
    }
}
2.4 ListFragment类
public class ListFragment extends Fragment {
//    private RecyclerView recyclerView;
    private ListView listView;
    private ArrayAdapter<String> arrayAdapter;
    private String[] data={"Apple","Banana","Orange","Watermelon","Pear","Grape","Pineapple","Strawberry","Cherry","Mango","Apple","Banana","Orange","Watermelon","Pear","Grape","Pineapple","Strawberry","Cherry","Mango"};
    @Nullable
    @Override
    public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
//
        View view=inflater.inflate(R.layout.list_fragment,container,false);
        listView=view.findViewById(R.id.list11);
        arrayAdapter=new ArrayAdapter<String>(getContext(),android.R.layout.simple_list_item_1,data);
        listView.setAdapter(arrayAdapter);
        return view;
    }
    @Override
    public void onActivityCreated(@Nullable Bundle savedInstanceState) {
        super.onActivityCreated(savedInstanceState);
    }
}
2.5 list_fragment布局
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent">
    <ListView
        android:id="@+id/list11"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>
</LinearLayout>

上面的实例采用最简单的方式生成多个相同的Fragment,在实际的开发过程中,每个选项卡的tab不可能是一样的,所以一般Fragement的Adapter不选用以上的FragmentStatePagerAdapter作为父类,而是采用FragmentPagerAdapter,这个将在后面的项目实例中详细讲解。另外TabLayout和ViewPager属于Material Design组件,需要添加相关依赖:配置design support library的API

使用androidX的配置:

dependencies {
    implementation fileTree(include: ['*.jar'], dir: 'libs')
    implementation "org.jetbrains.kotlin:kotlin-stdlib-jdk7:$kotlin_version"
    implementation 'androidx.appcompat:appcompat:1.0.0-alpha3'
    implementation 'androidx.constraintlayout:constraintlayout:1.1.1'
    testImplementation 'junit:junit:4.12'
    androidTestImplementation 'androidx.test:runner:1.1.0-alpha3'
    androidTestImplementation 'androidx.test.espresso:espresso-core:3.1.0-alpha3'
 
    implementation 'com.google.android.material:material:1.0.0-alpha3'
    implementation 'androidx.cardview:cardview:1.0.0-alpha3'
}

使用过去的android的配置:

dependencies {
    implementation fileTree(include: ['*.jar'], dir: 'libs')
    implementation "org.jetbrains.kotlin:kotlin-stdlib-jdk7:$kotlin_version"
    implementation 'com.android.support:appcompat-v7:28.0.0-alpha3'
    implementation 'com.android.support.constraint:constraint-layout:1.1.1'
 
    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.android.support:design:28.0.0-alpha3'
    implementation 'com.android.support:cardview-v7:28.0.0-alpha3'
}

猜你喜欢

转载自blog.csdn.net/qq_33766045/article/details/107591530