title: Stop view pager from starting the next pager before it's seen
body: <p>Now I have a view pager with multiple fragments.</p>
  
  <p>Actually I replace views in one fragment, but I have a problem with this.</p>
  
  <p>I show a gif images in each single view. So when I'm in page 1 the gif in image 2 starts it's animation.</p>
  
  <p>I need to keep the gif not animated till it's visible on the screen.</p>
  
  <p>I'm using setUserVisibleHint but it doesn't add any improvement or solution.</p>
  
  <p>So any suggestion to solve this problem?</p>
  
  <p>Thanks in advance.</p>
  
  <p>Here is my fragment code</p>
  
  <pre><code>public class WalkThroughFragment extends Fragment implements View.OnClickListener {
  
  public CacheClass cacheClass;
  public View view;
  private int pageNumber = 1;
  private TextView doneWalkThrough;
  private LinearLayout linearLayout;
  private GifImageView gifImageView, gifImageView2, gifImageView3, gifImageView4, gifImageView5;
  
  @Nullable
  @Override
  public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
      view = inflater.inflate(R.layout.item_walkthrough, container, false);
      return view;
  }
  
  @Override
  public void onViewCreated(View view, @Nullable Bundle savedInstanceState) {
      this.view = view;
      Bundle bundle = this.getArguments();
      if (bundle != null) {
          if (bundle.getInt("pageNumber") != 0) {
              pageNumber = bundle.getInt("pageNumber");
          }
      }
      cacheClass = new CacheClass(getActivity());
  
      gifImageView = (GifImageView) view.findViewById(R.id.imageViewGif);
      gifImageView.setFreezesAnimation(true);
      gifImageView.setVisibility(View.GONE);
  
      gifImageView2 = (GifImageView) view.findViewById(R.id.imageViewGif);
      gifImageView2.setFreezesAnimation(true);
      gifImageView2.setVisibility(View.GONE);
  
      gifImageView3 = (GifImageView) view.findViewById(R.id.imageViewGif);
      gifImageView3.setFreezesAnimation(true);
      gifImageView3.setVisibility(View.GONE);
  
      gifImageView4 = (GifImageView) view.findViewById(R.id.imageViewGif);
      gifImageView4.setFreezesAnimation(true);
      gifImageView4.setVisibility(View.GONE);
  
      gifImageView5 = (GifImageView) view.findViewById(R.id.imageViewGif);
      gifImageView5.setFreezesAnimation(true);
      gifImageView5.setVisibility(View.GONE);
  
      linearLayout = (LinearLayout) view.findViewById(R.id.walkThroughLayOut);
      doneWalkThrough = (TextView) view.findViewById(R.id.doneWalkThrough);
      doneWalkThrough.setOnClickListener(this);
  
      if (this.getUserVisibleHint()) {
          setUserVisibleHint(true);
      } else {
          linearLayout.setBackgroundColor(Color.BLUE);
      }
  }
  
  @Override
  public void onDestroy() {
      super.onDestroy();
      gifImageView.destroyDrawingCache();
  }
  
  @Override
  public void setUserVisibleHint(boolean isVisibleToUser) {
      if (isVisibleToUser) {
  
          if (getView() != null) {
              switch (pageNumber) {
                  case 1:
                      gifImageView.setLayerType(View.LAYER_TYPE_SOFTWARE, null);
                      gifImageView.setBackgroundResource(R.drawable.first_gif);
                      gifImageView.setVisibility(View.VISIBLE);
                      linearLayout.setBackgroundColor(Color.GREEN);
                      break;
  
                  case 2:
                      gifImageView2.setLayerType(View.LAYER_TYPE_SOFTWARE, null);
                      gifImageView2.setBackgroundResource(R.drawable.second_gif);
                      gifImageView2.setVisibility(View.VISIBLE);
                      linearLayout.setBackgroundColor(Color.BLUE);
                      break;
  
                  case 3:
                      gifImageView3.setLayerType(View.LAYER_TYPE_SOFTWARE, null);
                      gifImageView3.setBackgroundResource(R.drawable.third_gif);
                      gifImageView3.setVisibility(View.VISIBLE);
                      linearLayout.setBackgroundColor(getResources().getColor(R.color.light_blue));
                      break;
  
                  case 4:
                      gifImageView4.setLayerType(View.LAYER_TYPE_SOFTWARE, null);
                      gifImageView4.setBackgroundResource(R.drawable.forth_gif);
                      gifImageView4.setVisibility(View.VISIBLE);
                      linearLayout.setBackgroundColor(Color.YELLOW);
                      break;
  
                  case 5:
                      gifImageView5 = (GifImageView) view.findViewById(R.id.imageViewGif);
                      gifImageView5.setLayerType(View.LAYER_TYPE_SOFTWARE, null);
                      gifImageView5.setVisibility(View.VISIBLE);
                      gifImageView5.setBackgroundResource(R.drawable.fifth_gif);
                      try {
                          GifDrawable gifFromResource = new GifDrawable(getResources(), R.drawable.fifth_gif);
                          int duration = gifFromResource.getDuration();
                          new Handler().postDelayed(new Runnable() {
                              @Override
                              public void run() {
                                  doneWalkThrough.setVisibility(View.VISIBLE);
                              }
  
                          }, duration);
                          gifFromResource.stop();
                      } catch (IOException e) {
                          e.printStackTrace();
                      }
                      break;
              }
          }
      }
  
  }
  
  @Override
  public void onClick(View v) {
      ((WalkThroughActivity) getActivity()).switchIntent();
  }
  </code></pre>
  
  <p>}</p>