底部导航片段内有多个Tab片段 [英] Multiple Tab fragments inside bottom navigation fragment
问题描述
在底部导航中,具有三个选项卡(主页",仪表板",通知").每个底部导航选项卡都是一个片段.第一个标签,即.主页片段包含另一个顶部导航选项卡,该选项卡具有四个选项卡(选项卡1,选项卡2,选项卡3,选项卡4).
In bottom navigation with three tabs (Home, Dashboard, Notifications). Each bottom navigation tab is a fragment. The first tab ie. Home fragment contains another top navigation tabs having four tabs (Tab 1, Tab 2, Tab 3, Tab 4).
问题
-
直接从主页标签导航到通知标签,然后返回主页标签,即Tab1/,之前选择过的标签标签(顶部导航标签)中的标签内容未加载.
When navigate from Home tab to Notifications tab directly and come back to Home tab, Tab1/which ever tab previously selected tab (top navigation tabs) the content of the tab is not loaded.
从 Tab 1 (首页片段"标签)滑动选项卡一直到 Notification (通知)选项卡并向后滑动,直到到达 Tab 4 选项卡的内容未加载,并且第一次从 Tab 4 滑动到 Tab 3 时,滑动不会进入 Tab 3 .选项卡指示器仅移动了一点,在第二次滑动时便按预期进入 Tab 3 .
When swipe the tabs from Tab 1 (Home fragment tab) all the way to Notification tab and swipe back, on reaching the Tab 4 the content of the tab is not loaded and on first swipe from Tab 4 to Tab 3 the swipe does not take to Tab 3. The tab indicator just move a little and on second swipe it goes to Tab 3 as expected.
该应用程序包含很多代码,因此我将整个代码链接到 Github .
The app contains a lot of code so I'll just link the full code to 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(主页)
FirstFragment.java (Home)
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()
,因此代码将为:
Actually, it is a common mistake - you're using FragmentManager
of your Activity
inside the fragment, but since this fragment contains another child fragments you have to use FragmentManager
of the fragment itself. So the fix is simple - you just have to change getActivity().getSupportFragmentManager()
to getChildFragmentManager()
inside your fragments, so the code will be:
private void setupViewPager(ViewPager viewPager) {
TabViewPagerAdapter adapter = new TabViewPagerAdapter(getChildFragmentManager());
...
...
viewPager.setAdapter(adapter);
}
这应该可以正常工作.
这篇关于底部导航片段内有多个Tab片段的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!