Problème avec Transaction de Fragment (fragment par défaut affiche deux fois)

Question

Je travaille avec Fragment Transaction en utilisant bas Bar.In mon fragment par défaut d'application affichant deux fois et son ne se cache pas lorsque le deuxième fragment est sélectionné ..

public class MainActivity extends AppCompatActivity { 
private Fragment fragment; 
private FragmentManager fragmentManager; 
@Override 
protected void onCreate(Bundle savedInstanceState) { 
    super.onCreate(savedInstanceState); 
    setContentView(R.layout.activity_main); 

    fragmentManager = getSupportFragmentManager(); 
    fragment = new FragmentOne(); 
    final FragmentTransaction transaction = fragmentManager.beginTransaction(); 
    transaction.add(R.id.output, fragment).commit(); 


    BottomBar bottomBar = (BottomBar) findViewById(R.id.bottomBar); 
    bottomBar.setOnTabSelectListener(new OnTabSelectListener() { 
     @Override 
     public void onTabSelected(@IdRes int tabId) { 
      switch (tabId){ 
       case R.id.tab_favorites: 
        Toast.makeText(MainActivity.this, "FAV", Toast.LENGTH_SHORT).show(); 
        fragment = new FragmentOne(); 
        break; 
       case R.id.tab_friends: 
        Toast.makeText(MainActivity.this, "FRIEND", Toast.LENGTH_SHORT).show(); 
        fragment = new FragmentTwo(); 
        break; 
       case R.id.tab_nearby: 
        Toast.makeText(MainActivity.this, "NEAR", Toast.LENGTH_SHORT).show(); 
        fragment = new FragmentOne(); 
        break; 
       case R.id.tab_test: 
        Toast.makeText(MainActivity.this, "TEST", Toast.LENGTH_SHORT).show(); 
        fragment = new FragmentTwo(); 
        break; 
      } 
      final FragmentTransaction transaction = fragmentManager.beginTransaction(); 
      transaction.replace(R.id.output, fragment).commit(); 
     } 
    }); 

    bottomBar.setOnTabReselectListener(new OnTabReselectListener() { 
     @Override 
     public void onTabReSelected(@IdRes int tabId) { 
     } 
    }); 
} 

S'il vous plaît aidez-moi à résoudre ce problème Voici ma mise en page xml

<?xml version="1.0" encoding="utf-8"?> 
    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
     xmlns:tools="http://schemas.android.com/tools" 
     xmlns:app="http://schemas.android.com/apk/res-auto" 
     android:id="@+id/activity_main" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     tools:context="com.syntax.bottomtabs.MainActivity"> 
<fragment 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:layout_marginTop="10dp" 
     android:layout_marginBottom="10dp" 
     android:layout_marginLeft="10dp" 
     android:layout_marginRight="10dp" 
     android:name="com.syntax.bottomtabs.FragmentOne" 
     android:id="@+id/output"/> 

    <com.roughike.bottombar.BottomBar 
     android:id="@+id/bottomBar" 
     android:layout_width="match_parent" 
     android:layout_height="70dp" 
     android:layout_alignParentBottom="true" 
     app:bb_tabXmlResource="@xml/bottombar_tabs_three" /> 
</RelativeLayout> 

Answer 1

, remplacez les l xml ike ci-dessous en remplaçant le fragment wiht disposition relative .....

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:tools="http://schemas.android.com/tools" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    android:id="@+id/activity_main" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    tools:context="com.syntax.bottomtabs.MainActivity"> 
<RelativeLayout 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:layout_marginTop="10dp" 
    android:layout_marginBottom="10dp" 
    android:layout_marginLeft="10dp" 
    android:layout_marginRight="10dp" 
    android:id="@+id/output"> 
</RelativeLayout> 

<com.roughike.bottombar.BottomBar 
    android:id="@+id/bottomBar" 
    android:layout_width="match_parent" 
    android:layout_height="70dp" 
    android:layout_alignParentBottom="true" 
    app:bb_tabXmlResource="@xml/bottombar_tabs_three" /> 
</RelativeLayout> 

espère que ça vous aidera .....

Answer 2

Ne pas ajouter fragment. Ajoutez un conteneur puis remplacez-le par un fragment. Ici, le framelayout fonctionnera comme conteneur.

Votre code XML doit être:

<?xml version="1.0" encoding="utf-8"?> 
    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
     xmlns:tools="http://schemas.android.com/tools" 
     xmlns:app="http://schemas.android.com/apk/res-auto" 
     android:id="@+id/activity_main" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     tools:context="com.syntax.bottomtabs.MainActivity"> 

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

    <com.roughike.bottombar.BottomBar 
     android:id="@+id/bottomBar" 
     android:layout_width="match_parent" 
     android:layout_height="70dp" 
     android:layout_alignParentBottom="true" 
     app:bb_tabXmlResource="@xml/bottombar_tabs_three" /> 
</RelativeLayout> 

En activité onCreate():

FragmentManager fm = getFragmentManager(); 
     fm.beginTransaction().replace(R.id.content_frame, new FragmentOne()).commit(); 

Et le reste du code:

bottomBar.setOnTabSelectListener(new OnTabSelectListener() { 
     final FragmentManager fm = getFragmentManager(); 
     @Override 
     public void onTabSelected(@IdRes int tabId) { 
      switch (tabId){ 
       case R.id.tab_favorites: 
        Toast.makeText(MainActivity.this, "FAV", Toast.LENGTH_SHORT).show(); 
        fm.beginTransaction().replace(R.id.content_frame, new FragmentOne()).commit(); 
        break; 
       case R.id.tab_friends: 
        Toast.makeText(MainActivity.this, "FRIEND", Toast.LENGTH_SHORT).show(); 
        fm.beginTransaction().replace(R.id.content_frame, new FragmentTwo()).commit(); 
        break; 
       case R.id.tab_nearby: 
        Toast.makeText(MainActivity.this, "NEAR", Toast.LENGTH_SHORT).show(); 
        fm.beginTransaction().replace(R.id.content_frame, new FragmentOne()).commit(); 
        break; 
       case R.id.tab_test: 
        Toast.makeText(MainActivity.this, "TEST", Toast.LENGTH_SHORT).show(); 
        fm.beginTransaction().replace(R.id.content_frame, new FragmentTwo()).commit(); 
        break; 
      } 
     } 
    });