Android TabLayout加背景
简介
TabLayout是Android提供的一种用于实现Tab切换的控件,常用于底部导航栏或顶部导航栏。TabLayout可以与ViewPager结合使用,实现页面的切换和显示。本文将介绍如何给TabLayout添加背景,以优化用户界面的显示效果。
实现步骤
步骤一:准备资源文件
首先,需要准备一张背景图片作为TabLayout的背景。可以选择一张合适的图片,推荐使用高清晰度的图片以保证显示效果。
步骤二:创建TabLayout
在布局文件中创建一个TabLayout控件,并设置其宽度和高度。在代码中引用该控件,并通过findViewById()
方法获取其实例。
<android.support.design.widget.TabLayout
android:id="@+id/tab_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/tab_background"
/>
步骤三:设置背景
在代码中,通过调用setBackgroundResource()
方法给TabLayout设置背景图片。
TabLayout tabLayout = findViewById(R.id.tab_layout);
tabLayout.setBackgroundResource(R.drawable.tab_background);
步骤四:使用TabLayout
在使用TabLayout之前,需要先创建Tab对象,并添加到TabLayout中。可以使用newTab()
方法创建Tab对象,然后调用setText()
方法设置标题,最后调用addTab()
方法将Tab添加到TabLayout中。
TabLayout.Tab tab1 = tabLayout.newTab().setText("Tab 1");
TabLayout.Tab tab2 = tabLayout.newTab().setText("Tab 2");
TabLayout.Tab tab3 = tabLayout.newTab().setText("Tab 3");
tabLayout.addTab(tab1);
tabLayout.addTab(tab2);
tabLayout.addTab(tab3);
步骤五:与ViewPager结合使用
如果需要与ViewPager结合使用,可以调用setupWithViewPager()
方法将TabLayout与ViewPager关联起来。ViewPager是一个用于实现页面切换的控件,可以在其中添加多个Fragment。
ViewPager viewPager = findViewById(R.id.view_pager);
viewPager.setAdapter(new MyPagerAdapter(getSupportFragmentManager()));
tabLayout.setupWithViewPager(viewPager);
完整代码示例
以下是一个完整的代码示例,展示了如何给TabLayout添加背景。
// MainActivity.java
import android.support.design.widget.TabLayout;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
TabLayout tabLayout = findViewById(R.id.tab_layout);
tabLayout.setBackgroundResource(R.drawable.tab_background);
TabLayout.Tab tab1 = tabLayout.newTab().setText("Tab 1");
TabLayout.Tab tab2 = tabLayout.newTab().setText("Tab 2");
TabLayout.Tab tab3 = tabLayout.newTab().setText("Tab 3");
tabLayout.addTab(tab1);
tabLayout.addTab(tab2);
tabLayout.addTab(tab3);
ViewPager viewPager = findViewById(R.id.view_pager);
viewPager.setAdapter(new MyPagerAdapter(getSupportFragmentManager()));
tabLayout.setupWithViewPager(viewPager);
}
}
// MyPagerAdapter.java
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
public class MyPagerAdapter extends FragmentPagerAdapter {
public MyPagerAdapter(FragmentManager fm) {
super(fm);
}
@Override
public Fragment getItem(int position) {
switch (position) {
case 0:
return new Fragment1();
case 1:
return new Fragment2();
case 2:
return new Fragment3();
default:
return null;
}
}
@Override
public int getCount() {
return 3;
}
}
// Fragment1.java
import android.support.v4.app.Fragment;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
public class Fragment1 extends Fragment {
public Fragment1() {
// Required empty public constructor
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
// Inflate the layout for this fragment
return inflater.inflate(R.layout.fragment_1, container, false);
}
}
// fragment_1.xml
<FrameLayout xmlns:android="
xmlns:tools="
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#FFFFFF">