底部导航片段内的多个 Tab 片段
Multiple Tab fragments inside bottom navigation fragment
在带有三个选项卡(主页、仪表板、通知)的底部导航中。每个底部导航选项卡都是一个片段。第一个选项卡即。主页片段包含另一个具有四个选项卡(选项卡 1、选项卡 2、选项卡 3、选项卡 4)的顶部导航选项卡。
问题
当从 主页 选项卡直接导航到 通知 选项卡并返回到 主页 tab, Tab1/which ever tab previously selected tab (top navigation tabs) 选项卡的内容未加载。
当从 Tab 1(Home fragment 标签)一直滑动到 Notification 标签并滑动时返回,在到达 Tab 4 时未加载选项卡的内容 并且第一次从 Tab 4 滑动到 Tab 3 滑动不会到达 Tab 3. 选项卡指示器只是移动了一点,第二次滑动时它会转到 选项卡 3 符合预期。
该应用程序包含大量代码,因此我将 link 完整代码添加到 Github。
为了快速参考,这里是我的代码
MainActivity.java
public class MainActivity extends AppCompatActivity {
private ViewPager viewPager;
NavigationView navigationView;
private BottomNavigationView.OnNavigationItemSelectedListener mOnNavigationItemSelectedListener
= new BottomNavigationView.OnNavigationItemSelectedListener() {
@Override
public boolean onNavigationItemSelected(@NonNull MenuItem item) {
switch (item.getItemId()) {
case R.id.navigation_home:
viewPager.setCurrentItem(0);
return true;
case R.id.navigation_dashboard:
viewPager.setCurrentItem(1);
return true;
case R.id.navigation_notifications:
viewPager.setCurrentItem(2);
return true;
}
return false;
}
};
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// Hide the activity toolbar
getSupportActionBar().hide();
//Initializing viewPager
viewPager = (ViewPager) findViewById(R.id.viewpager);
setupViewPager(viewPager);
final BottomNavigationView navigation = (BottomNavigationView) findViewById(R.id.navigation);
navigation.setOnNavigationItemSelectedListener(mOnNavigationItemSelectedListener);
viewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
}
@Override
public void onPageSelected(int position) {
switch (position){
case 0:
navigation.setSelectedItemId(R.id.navigation_home);
break;
case 1:
navigation.setSelectedItemId(R.id.navigation_dashboard);
break;
case 2:
navigation.setSelectedItemId(R.id.navigation_notifications);
break;
}
}
@Override
public void onPageScrollStateChanged(int state) {
}
});
}
private void setupViewPager(ViewPager viewPager) {
BottomNavPagerAdapter adapter = new BottomNavPagerAdapter(getSupportFragmentManager());
adapter.addFragment(new FirstFragment());
adapter.addFragment(new SecondFragment());
adapter.addFragment(new ThirdFragment());
viewPager.setAdapter(adapter);
}
}
FirstFragment.java(主页)
public class FirstFragment extends Fragment {
private TabLayout tabLayout;
private ViewPager firstViewPager;
public FirstFragment() {
// Required empty public constructor
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
// Inflate the layout for this fragment
View rootView = inflater.inflate(R.layout.fragment_first, container, false);
firstViewPager = (ViewPager) rootView.findViewById(R.id.viewpager_content);
tabLayout = (TabLayout) rootView.findViewById(R.id.tabs);
tabLayout.setupWithViewPager(firstViewPager);
setupViewPager(firstViewPager);
return rootView;
}
private void setupViewPager(ViewPager viewPager) {
TabViewPagerAdapter adapter = new TabViewPagerAdapter(getActivity().getSupportFragmentManager());
adapter.addFragment(new Tab1Fragment(), "Tab 1");
adapter.addFragment(new Tab1Fragment(), "Tab 2");
adapter.addFragment(new Tab1Fragment(), "Tab 3");
adapter.addFragment(new Tab1Fragment(), "Tab 4");
viewPager.setAdapter(adapter);
}
}
问题
- 代码有什么问题?
- 如何解决这个问题? (布局是必需的)或者有没有更好的方法从屏幕截图中得出布局?
实际上,这是一个常见的错误 - 您在片段中使用了 Activity
的 FragmentManager
,但由于该片段包含另一个 child您必须使用片段本身的 FragmentManager
片段。所以修复很简单 - 你只需要在你的片段中将 getActivity().getSupportFragmentManager()
更改为 getChildFragmentManager()
,所以代码将是:
private void setupViewPager(ViewPager viewPager) {
TabViewPagerAdapter adapter = new TabViewPagerAdapter(getChildFragmentManager());
...
...
viewPager.setAdapter(adapter);
}
这应该会按预期工作。
尝试使用 getSupportFragmentManager()
的 getChildFragmentManager()
个实例。
在带有三个选项卡(主页、仪表板、通知)的底部导航中。每个底部导航选项卡都是一个片段。第一个选项卡即。主页片段包含另一个具有四个选项卡(选项卡 1、选项卡 2、选项卡 3、选项卡 4)的顶部导航选项卡。
问题
当从 主页 选项卡直接导航到 通知 选项卡并返回到 主页 tab, Tab1/which ever tab previously selected tab (top navigation tabs) 选项卡的内容未加载。
当从 Tab 1(Home fragment 标签)一直滑动到 Notification 标签并滑动时返回,在到达 Tab 4 时未加载选项卡的内容 并且第一次从 Tab 4 滑动到 Tab 3 滑动不会到达 Tab 3. 选项卡指示器只是移动了一点,第二次滑动时它会转到 选项卡 3 符合预期。
该应用程序包含大量代码,因此我将 link 完整代码添加到 Github。
为了快速参考,这里是我的代码
MainActivity.java
public class MainActivity extends AppCompatActivity {
private ViewPager viewPager;
NavigationView navigationView;
private BottomNavigationView.OnNavigationItemSelectedListener mOnNavigationItemSelectedListener
= new BottomNavigationView.OnNavigationItemSelectedListener() {
@Override
public boolean onNavigationItemSelected(@NonNull MenuItem item) {
switch (item.getItemId()) {
case R.id.navigation_home:
viewPager.setCurrentItem(0);
return true;
case R.id.navigation_dashboard:
viewPager.setCurrentItem(1);
return true;
case R.id.navigation_notifications:
viewPager.setCurrentItem(2);
return true;
}
return false;
}
};
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// Hide the activity toolbar
getSupportActionBar().hide();
//Initializing viewPager
viewPager = (ViewPager) findViewById(R.id.viewpager);
setupViewPager(viewPager);
final BottomNavigationView navigation = (BottomNavigationView) findViewById(R.id.navigation);
navigation.setOnNavigationItemSelectedListener(mOnNavigationItemSelectedListener);
viewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
}
@Override
public void onPageSelected(int position) {
switch (position){
case 0:
navigation.setSelectedItemId(R.id.navigation_home);
break;
case 1:
navigation.setSelectedItemId(R.id.navigation_dashboard);
break;
case 2:
navigation.setSelectedItemId(R.id.navigation_notifications);
break;
}
}
@Override
public void onPageScrollStateChanged(int state) {
}
});
}
private void setupViewPager(ViewPager viewPager) {
BottomNavPagerAdapter adapter = new BottomNavPagerAdapter(getSupportFragmentManager());
adapter.addFragment(new FirstFragment());
adapter.addFragment(new SecondFragment());
adapter.addFragment(new ThirdFragment());
viewPager.setAdapter(adapter);
}
}
FirstFragment.java(主页)
public class FirstFragment extends Fragment {
private TabLayout tabLayout;
private ViewPager firstViewPager;
public FirstFragment() {
// Required empty public constructor
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
// Inflate the layout for this fragment
View rootView = inflater.inflate(R.layout.fragment_first, container, false);
firstViewPager = (ViewPager) rootView.findViewById(R.id.viewpager_content);
tabLayout = (TabLayout) rootView.findViewById(R.id.tabs);
tabLayout.setupWithViewPager(firstViewPager);
setupViewPager(firstViewPager);
return rootView;
}
private void setupViewPager(ViewPager viewPager) {
TabViewPagerAdapter adapter = new TabViewPagerAdapter(getActivity().getSupportFragmentManager());
adapter.addFragment(new Tab1Fragment(), "Tab 1");
adapter.addFragment(new Tab1Fragment(), "Tab 2");
adapter.addFragment(new Tab1Fragment(), "Tab 3");
adapter.addFragment(new Tab1Fragment(), "Tab 4");
viewPager.setAdapter(adapter);
}
}
问题
- 代码有什么问题?
- 如何解决这个问题? (布局是必需的)或者有没有更好的方法从屏幕截图中得出布局?
实际上,这是一个常见的错误 - 您在片段中使用了 Activity
的 FragmentManager
,但由于该片段包含另一个 child您必须使用片段本身的 FragmentManager
片段。所以修复很简单 - 你只需要在你的片段中将 getActivity().getSupportFragmentManager()
更改为 getChildFragmentManager()
,所以代码将是:
private void setupViewPager(ViewPager viewPager) {
TabViewPagerAdapter adapter = new TabViewPagerAdapter(getChildFragmentManager());
...
...
viewPager.setAdapter(adapter);
}
这应该会按预期工作。
尝试使用 getSupportFragmentManager()
的 getChildFragmentManager()
个实例。