title: Fragments overlapping despite using replace, remove methods to change fragments
body: <p>I am having two countdowntimers in the activity. One counts the amount of time spent in a fragment having an preexercise, exercise and postexercise (ignore feedbackfragment). The other counts the total time for all the exercises.  Once an exercise is done, it gets replaced by the next fragment. Here is the code: (IGNORE changeexercise method --> based on some conditions it adds the requisite fragment among preexercisefragment and exercisefragment)</p>
  
  <pre><code>public void replaceFragment(int fragment_num, ArrayList&lt;String&gt; used_exercise_data, long millisUnfinished) {
      Fragment frag = getFragmentManager().findFragmentByTag(String.valueOf(fragment_num));
      if(fragment_num==1){
          getFragmentManager().beginTransaction().replace(R.id.workout_layout, exerciseFragment, "2").commit();
      } else if(fragment_num==2) {
          if(used_exercise_data.get(2).equals("bbb")){
              getFragmentManager().beginTransaction().remove(frag).commit();
              ex_num = ex_num + 1;
              ChangeExercise(ex_num, millisUnfinished);
          } else if (used_exercise_data.get(2).substring(used_exercise_data.get(2).length()-1).equals("a")){
              getFragmentManager().beginTransaction().replace(R.id.workout_layout, postExerciseFragment, "3").commit();
          } else {
              getFragmentManager().beginTransaction().replace(R.id.workout_layout, feedbackFragment, "4").commit();
          }
      } else if (fragment_num==3) {
          getFragmentManager().beginTransaction().replace(R.id.workout_layout, feedbackFragment, "4").commit();
      } else if (fragment_num==4) {
          getFragmentManager().beginTransaction().remove(frag).commit();
          ex_num = ex_num + 1;
          ChangeExercise(ex_num, millisUnfinished);
      }
  }
  </code></pre>
  
  <p>Now here is a sample screenshot of what happens when the fragment is replaced. This is the result even if a fragment is removed and a new fragment is added.</p>
  
  <p><a href="http://jiyofit.in/appwork/Capture.JPG" rel="nofollow noreferrer">Screenshot of the overlapped fragments http://jiyofit.in/appwork/Capture.JPG</a></p>
  
  <p>This started happening when I added the Fragment name TotalTimerFragment having a countdowntimer. It sums up the time for all the exercises and then counts down. Here is the code. The total_timer_textview is in the layout fragment_totaltimer. The activity calls the method TotalTimerStartStop through an interface after getting the total time.</p>
  
  <pre><code>public class TotalTimerFragment extends Fragment{
  TotalTimeCounter timeCounter;
  TextView totalWorkoutTimer;
  static long total_millis;
  
  @Nullable
  @Override
  public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
      return inflater.inflate(R.layout.fragment_totaltimer, container, false);
  }
  
  @Override
  public void onViewCreated(View view, Bundle savedInstanceState) {
      super.onViewCreated(view, savedInstanceState);
  }
  
  public class TotalTimeCounter extends CountDownTimer {
      TextView totalWorkoutTimer;
      View view;
  
      public TotalTimeCounter(long millisInFuture, long countDownInterval) {
          super(millisInFuture, countDownInterval);
          view = getView();
      }
  
      @Override
      public void onTick(long millisUntilFinished) {
          total_millis = millisUntilFinished;
          String total_hms = String.format("%02d:%02d:%02d", TimeUnit.MILLISECONDS.toHours(total_millis),
                          TimeUnit.MILLISECONDS.toMinutes(total_millis) - TimeUnit.HOURS.toMinutes(TimeUnit.
                          MILLISECONDS.toHours(total_millis)), TimeUnit.MILLISECONDS.toSeconds(total_millis) -
                          TimeUnit.MINUTES.toSeconds(TimeUnit.MILLISECONDS.toMinutes(total_millis)));
          totalWorkoutTimer = (TextView) view.findViewById(R.id.total_timer_textview);
          totalWorkoutTimer.setText(total_hms);
      }
  
      @Override
      public void onFinish() {
  
      }
  }
  
  public void TotalTimerStartStop (long totalTimeVal){
      timeCounter = new TotalTimeCounter(totalTimeVal, 1000);
      timeCounter.start();
  }
  }
  </code></pre>
  
  <p>It looks like the previous fragment is remaining attached. But I do not understand why. Thanks.</p>
  
  <p>xml of the activity</p>
  
  <pre><code> &lt;RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
     xmlns:tools="http://schemas.android.com/tools"
     android:orientation="horizontal"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
    android:id="@+id/workout_layout"
    tools:context="in.jiyofit.the_app.WorkoutActivity"
    android:weightSum="1"&gt;
  
     &lt;fragment
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:name="in.jiyofit.the_app.TotalTimerFragment"
      android:id="@+id/timer_fragment"
      android:layout_alignParentBottom="true"
      android:layout_alignParentLeft="true"
      android:layout_alignParentStart="true" /&gt;
    &lt;/RelativeLayout&gt;
  </code></pre>
  
  <p>xml for one of the fragments (others are similar)</p>
  
  <pre><code> &lt;LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
   android:orientation="horizontal"
   android:layout_width="match_parent"
   android:layout_height="match_parent"
   android:id="@+id/postexercise_fragment"&gt;
  
   &lt;RelativeLayout
      android:layout_width="match_parent"
      android:layout_height="match_parent"&gt;
  
      &lt;pl.droidsonroids.gif.GifImageView
          android:layout_width="match_parent"
          android:layout_height="match_parent"
          android:id="@+id/postexercise_gifView"
          android:layout_alignParentTop="true"
          android:layout_alignParentRight="true"
          android:layout_alignParentEnd="true" /&gt;
  
      &lt;TextView
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:text="Large Text"
          android:id="@+id/postexercise_timer"
          android:layout_alignParentTop="true"
          android:layout_alignParentRight="true"
          android:layout_alignParentEnd="true"
          android:padding="10dp"
          android:textSize="30sp"/&gt;
  
     &lt;/RelativeLayout&gt;
  
     &lt;/LinearLayout&gt;
  </code></pre>
  
  <p>layout of TotalTimerFragment</p>
  
  <pre><code>  &lt;LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent"&gt;
  
    &lt;TextView
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:textAppearance="?android:attr/textAppearanceLarge"
      android:id="@+id/total_timer_textview"
      android:layout_gravity="center_horizontal"
      android:layout_margin="10dp"/&gt;
    &lt;/LinearLayout&gt;
  </code></pre>