0

enter image description here如何在BottomNavigationMenu项目内编码ViewPager,就像我们在Google+,Reddit,Quora应用程序中一样?

我试图用片段作为BottomNavigationMenu的项目和那些片段里,我使用ViewPager实现这样的布局。

但我得到这样的布局错误。 enter image description here

enter image description here

这是代码

getSupportFragmentManager().beginTransaction().add(R.id.fragment_frame, searchPropertyFragment).commit(); 
    bottomNavigationView.setOnNavigationItemSelectedListener(new BottomNavigationView.OnNavigationItemSelectedListener() { 
     @Override 
     public boolean onNavigationItemSelected(@NonNull MenuItem item) { 
      int id = item.getItemId(); 
      switch (id){ 
       case R.id.bottom_menu_properties: 
        getSupportFragmentManager().beginTransaction().replace(R.id.fragment_frame, new SearchPropertyFragment).commit(); 
        break; 
       case R.id.bottom_menu_chat: 
        getSupportFragmentManager().beginTransaction().replace(R.id.fragment_frame, new ChatFragment).commit(); 
        break; 
       case R.id.bottom_menu_profile: 
        getSupportFragmentManager().beginTransaction().replace(R.id.fragment_frame, new ProfileFragment).commit(); 
        break; 
       case R.id.bottom_menu_notifications: 
        getSupportFragmentManager().beginTransaction().replace(R.id.fragment_frame, new NotificationFragment).commit(); 
        break; 
      } 
      return true; 
     } 
    }); 

这里面SearchPropertyFragment

titlesList.clear(); 
fragmentsList.clear(); 
titlesList.add("Featured"); 
titlesList.add("Yours"); 
titlesList.add("Following"); 
fragmentsList.add(new FeaturedFragment()); 
fragmentsList.add(new YoursFragment()); 
fragmentsList.add(new FollowingFragment()); 
pagerAdapter = new PagerAdapter(getActivity().getSupportFragmentManager(), 
titlesList, fragmentsList); 
viewpager.setAdapter(pagerAdapter); 
tabs.setupWithViewPager(viewpager); 

的viewPager代码什么是正确的方法来得到此布局。

+0

的片段,我不明白为什么要在底部导航使用viewpager酒吧。任何具体原因? – CoderP

+0

我想要实现与Google+应用类似的布局。只需要正确的方法来做到这一点。 –

+0

您是否探索过BottomNavigationView组件。我认为这应该够了。 – CoderP

回答

1

使用的FrameLayoutBottomNavigationView内部DrawerLayout其中的FrameLayout为含有ViewPager片段中的容器。

这是布局的DrawerLayout

<?xml version="1.0" encoding="utf-8"?> 
<android.support.v4.widget.DrawerLayout 
    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:id="@+id/main_content" 
    android:layout_height="match_parent" 
    android:layout_width="match_parent" 
    android:fitsSystemWindows="true"> 

    <android.support.design.widget.CoordinatorLayout 
     android:layout_width="match_parent" 
     android:layout_height="match_parent"> 

     <FrameLayout 
      android:id="@+id/fragment_frame" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent"> 

      <!--This is where the fragment will be placed--> 

     </FrameLayout> 

     <android.support.design.widget.BottomNavigationView 
      android:id="@+id/bottom_navigation" 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:layout_gravity="bottom" 
      android:background="@color/navigationItemBackground" 
      app:itemIconTint="@color/navigationItemIcon" 
      app:itemTextColor="@color/navigationItemtext" 
      app:menu="@menu/potential_tenant_menu" 
      android:layout_alignParentStart="true" /> 

    </android.support.design.widget.CoordinatorLayout> 

</android.support.v4.widget.DrawerLayout> 

这是将被放置在FrameLayout里

<?xml version="1.0" encoding="utf-8"?> 
<android.support.design.widget.CoordinatorLayout 
    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:id="@+id/main_content" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent"> 

    <android.support.design.widget.AppBarLayout 
     android:id="@+id/appbar" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"> 

     <android.support.v7.widget.Toolbar 
      android:id="@+id/toolbar" 
      android:layout_width="match_parent" 
      android:layout_height="?attr/actionBarSize" 
      android:background="?attr/colorPrimary" 
      app:popupTheme="@style/ThemeOverlay.AppCompat.Light" 
      app:layout_scrollFlags="scroll|enterAlways" 
      app:layout_collapseMode="pin"/> 

     <android.support.design.widget.TabLayout 
      android:id="@+id/tabs" 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content"/> 

    </android.support.design.widget.AppBarLayout> 

    <android.support.v4.view.ViewPager 
     android:id="@+id/viewpager" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     app:layout_behavior="@string/appbar_scrolling_view_behavior" /> 

</android.support.design.widget.CoordinatorLayout> 
+0

谢谢,正是我想要的 –

相关问题