title: How to hide layout when click outside of it?
body: <p>In my app in need to hide layout when i click out side (MobileFragment) of that layout.  You can understand the whole problem from given below images.
  <br><br> This is my app sturcture:</p>
  
  <p><a href="https://i.stack.imgur.com/DzRVF.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/DzRVF.png" alt="project Structure"></a></p>
  
  <p>This is the problem:</p>
  
  <p><a href="https://i.stack.imgur.com/i96xc.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/i96xc.png" alt="Problem"></a></p>
  
  <p>Here is my code:</p>
  
  <p><BR><BR>
  MainActivity.java</p>
  
  <pre><code>package com.example.admin.smsrupee;
  
  import android.content.res.Resources;
  import android.graphics.drawable.Drawable;
  import android.os.Bundle;
  import android.support.design.widget.CoordinatorLayout;
  import android.support.design.widget.TabLayout;
  import android.support.v4.app.Fragment;
  import android.support.v4.app.FragmentManager;
  import android.support.v4.app.FragmentStatePagerAdapter;
  import android.support.v4.content.ContextCompat;
  import android.support.v4.view.ViewPager;
  import android.support.v7.app.AppCompatActivity;
  import android.support.v7.widget.Toolbar;
  import android.view.LayoutInflater;
  import android.view.View;
  import android.view.Menu;
  import android.view.MenuItem;
  import android.widget.ImageView;
  import android.widget.LinearLayout;
  import android.widget.TextView;
  import android.widget.Toast;
  import java.util.ArrayList;
  import java.util.List;
  
  
  public class MainActivity extends AppCompatActivity implements View.OnClickListener{
  
      private TabLayout tabLayout;
      private ViewPager viewPager;
      private ImageView menu_icon,profile_icon;
      private LinearLayout layout,profile_layout;
      ViewPagerFinder adapter;
      CoordinatorLayout coordinatorLayout;
  
  
      private int[] tabIcons = {
              R.drawable.mobile_icon,
              R.drawable.dth_icon,
              R.drawable.data_card_icon,
              R.drawable.landline_icon,
              R.drawable.electricity_icon,
              R.drawable.gas_icon
      };
      @Override
      protected void onCreate(Bundle savedInstanceState) {
          super.onCreate(savedInstanceState);
          overridePendingTransition(R.anim.fadein, R.anim.fadeout);
          setContentView(R.layout.activity_main);
          Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
          setSupportActionBar(toolbar);
  
          viewPager = (ViewPager)findViewById(R.id.viewpager);
          setupViewPager(viewPager);
          tabLayout = (TabLayout) findViewById(R.id.tabs);
          tabLayout.setupWithViewPager(viewPager);
  
          menu_icon = (ImageView)findViewById(R.id.menu_icon);
          profile_icon = (ImageView)findViewById(R.id.profile_icon);
          layout = (LinearLayout)findViewById(R.id.menu_list);
          profile_layout = (LinearLayout)findViewById(R.id.profile_menu_list);
          menu_icon.setOnClickListener(this);
          profile_icon.setOnClickListener(this);
          viewPager.setOnClickListener(this);
  
          coordinatorLayout.setOnClickListener(this);
  
      setupTabIcons();
  
          FragmentStatePagerAdapter a = (FragmentStatePagerAdapter)viewPager.getAdapter();
          Fragment ft = (Fragment)a.instantiateItem(viewPager, viewPager.getCurrentItem());
          System.out.println("Fragment---" + ft);
  
      }
  
  
      private void setupTabIcons() {
  
  
          Drawable mobile_img;
          Resources res1 = getResources();
          mobile_img = ContextCompat.getDrawable(MainActivity.this, R.drawable.mobile_icon);
          mobile_img.setBounds(0, 0, 20, 25);
  
          TextView tabOne = (TextView) LayoutInflater.from(this).inflate(R.layout.custom_tab, null);
          tabOne.setText("Mobile");
          tabOne.setCompoundDrawables(null,mobile_img, null, null);
          tabLayout.getTabAt(0).setCustomView(tabOne);
  
          Drawable dth_img ;
          Resources res2 = getResources();
          dth_img = ContextCompat.getDrawable(MainActivity.this, R.drawable.dth_icon);
          dth_img.setBounds(0, 0, 20, 25);
  
          TextView tabTwo = (TextView) LayoutInflater.from(this).inflate(R.layout.custom_tab, null);
          tabTwo.setText("DTH");
          tabTwo.setCompoundDrawables(null, dth_img, null, null);
          tabLayout.getTabAt(1).setCustomView(tabTwo);
  
          Drawable data_img ;
          Resources res3 = getResources();
          data_img = ContextCompat.getDrawable(MainActivity.this, R.drawable.data_card_icon);
          data_img.setBounds(0, 0, 20, 25);
  
          TextView tabThree = (TextView) LayoutInflater.from(this).inflate(R.layout.custom_tab, null);
          tabThree.setText("Data Card");
          tabThree.setCompoundDrawables(null, data_img, null, null);
          tabLayout.getTabAt(2).setCustomView(tabThree);
  
          Drawable landline_img ;
          Resources res4 = getResources();
          landline_img = ContextCompat.getDrawable(MainActivity.this, R.drawable.landline_icon);
          landline_img.setBounds(0, 0, 20, 25);
  
          TextView tabFour = (TextView) LayoutInflater.from(this).inflate(R.layout.custom_tab, null);
          tabFour.setText("LandLine");
          tabFour.setCompoundDrawables(null,landline_img, null, null);
          tabLayout.getTabAt(3).setCustomView(tabFour);
  
          Drawable electricity_img ;
          Resources res5 = getResources();
          electricity_img = ContextCompat.getDrawable(MainActivity.this, R.drawable.electricity_icon);
          electricity_img.setBounds(0, 0, 20, 25);
  
  
          TextView tabFive = (TextView) LayoutInflater.from(this).inflate(R.layout.custom_tab, null);
          tabFive.setText("Electricity");
          tabFive.setCompoundDrawables(null,electricity_img, null, null);
          tabLayout.getTabAt(4).setCustomView(tabFive);
  
          Drawable gas_img ;
          Resources res6 = getResources();
          gas_img = ContextCompat.getDrawable(MainActivity.this, R.drawable.gas_icon);
          gas_img.setBounds(0, 0, 20, 25);
  
  
          TextView tabSix = (TextView) LayoutInflater.from(this).inflate(R.layout.custom_tab, null);
          tabSix.setText("Gas");
          tabSix.setCompoundDrawables(null,gas_img , null, null);
          tabLayout.getTabAt(5).setCustomView(tabSix);
  
      }
  
  
      private void setupViewPager(ViewPager viewPager) {
          adapter = new ViewPagerFinder(getSupportFragmentManager());
          adapter.addFragment(new MobileFragment(), "Mobile");
          adapter.addFragment(new DTHFragment(), "DTH");
          adapter.addFragment(new DataCardFragment(), "Data Card");
          adapter.addFragment(new LandLineFragment(), "Landline");
          adapter.addFragment(new ElectricityFragment(), "Electricity");
          adapter.addFragment(new GasFragment(), "Gas");
          viewPager.setAdapter(adapter);
      }
  
  
      @Override
      public void onClick(View v) {
  
          switch (v.getId()){
              case R.id.menu_icon:
                  if(layout.getVisibility() == View.INVISIBLE){
                      layout.setVisibility(View.VISIBLE);
                  }else{
                      layout.setVisibility(View.INVISIBLE);
                  }
                  break;
  
              case R.id.profile_icon:
                  if(profile_layout.getVisibility() == View.INVISIBLE) {
                      profile_layout.setVisibility(View.VISIBLE);
                  } else {
                      profile_layout.setVisibility(View.INVISIBLE);
                  }
                  break;
              default:
  
                  break;
          }
      }
  
      class ViewPagerFinder extends FragmentStatePagerAdapter{
  
         private final List&lt;Fragment&gt; mFragmentList = new ArrayList&lt;&gt;();
         private final List&lt;String&gt; mFragmentTitleList = new ArrayList&lt;&gt;();
  
         public ViewPagerFinder(FragmentManager manager) {
             super(manager);
  
         }
         @Override
         public Fragment getItem(int position){
             return  mFragmentList.get(position);
         }
  
         @Override
         public int getCount() {
             return mFragmentList.size();
         }
  
          public void addFragment(Fragment fragment, String title) {
              mFragmentList.add(fragment);
             mFragmentTitleList.add(title);
         }
  
         @Override
         public CharSequence getPageTitle(int position) {
             return mFragmentTitleList.get(position);
         }
  
          public Fragment  returnFragment(int position){
              return mFragmentList.get(position);
  
          }
  
     }
  
  
  
      @Override
      public boolean onCreateOptionsMenu(Menu menu) {
  
          getMenuInflater().inflate(R.menu.menu_main, menu);
          return true;
      }
  
  
  
      @Override
      public boolean onOptionsItemSelected(MenuItem item) {
  
          int id = item.getItemId();
        /*  if (id == R.id.action_settings) {
              return true;
          }*/
  
          return super.onOptionsItemSelected(item);
      }
  
  
  }
  </code></pre>
  
  <p>MobileFragemnt.java</p>
  
  <pre><code>package com.example.admin.smsrupee;
  
  import android.app.Fragment;
  import android.content.Context;
  import android.os.Bundle;
  import android.support.annotation.Nullable;
  import android.support.v4.view.ViewPager;
  import android.view.LayoutInflater;
  import android.view.View;
  import android.view.ViewGroup;
  import android.widget.EditText;
  import android.widget.ImageView;
  import android.widget.LinearLayout;
  import android.widget.RelativeLayout;
  import android.widget.Toast;
  
  /**
   * Created by admin on 11/4/2015.
   */
  public class MobileFragment extends android.support.v4.app.Fragment {
  
      EditText editText;
      private ImageView menuicon;
      private LinearLayout layout;
      private RelativeLayout relativeLayout;
  
      @Override
      public void onCreate(Bundle savedInstanceState) {
          super.onCreate(savedInstanceState);
      }
  
      @Nullable
      @Override
      public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
          View view= inflater.inflate(R.layout.mobile_fragment, container, false);
          return view;
      }
  
      public static MobileFragment newInstance(int index) {
          MobileFragment f = new MobileFragment();
          Bundle args = new Bundle();
          args.putInt("index", index);
          f.setArguments(args);
          return f;
      }
  
  }
  </code></pre>
  
  <p>activity_main.xml</p>
  
  <pre><code>&lt;?xml version="1.0" encoding="utf-8"?&gt;
  &lt;android.support.design.widget.CoordinatorLayout
      xmlns:android="http://schemas.android.com/apk/res/android"
      xmlns:app="http://schemas.android.com/apk/res-auto"
      android:id="@+id/cordinator"
      android:clickable="true"
      xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
      android:layout_height="match_parent" android:fitsSystemWindows="true"
      tools:context=".MainActivity"&gt;
  
  
      &lt;android.support.design.widget.AppBarLayout
          android:layout_height="wrap_content"
          android:layout_width="match_parent" android:theme="@style/AppTheme.AppBarOverlay"&gt;
  
          &lt;android.support.v7.widget.Toolbar android:id="@+id/toolbar"
              android:layout_width="match_parent"
              android:layout_height="?attr/actionBarSize"
              android:contentInsetStart="0dp"
              android:contentInsetLeft="0dp"
              app:contentInsetLeft="0dp"
              app:contentInsetStart="0dp"
              android:background="?attr/colorPrimary" app:popupTheme="@style/AppTheme.PopupOverlay"&gt;
              &lt;include layout="@layout/content_main"/&gt;
  
  
          &lt;/android.support.v7.widget.Toolbar&gt;
  
  
  
      &lt;/android.support.design.widget.AppBarLayout&gt;
  
      &lt;View
          android:layout_width="match_parent"
          android:layout_height="1dp"
          android:background="#2f5392"
          app:layout_behavior="@string/appbar_scrolling_view_behavior"
          /&gt;
  
      &lt;android.support.design.widget.TabLayout
          android:id="@+id/tabs"
          android:layout_width="match_parent"
          app:layout_behavior="@string/appbar_scrolling_view_behavior"
          android:layout_height="wrap_content"
          app:tabMode="scrollable"
          app:tabGravity="fill"/&gt;
  
      &lt;android.support.v4.view.ViewPager
          android:id="@+id/viewpager"
          android:layout_width="match_parent"
          android:layout_marginTop="50dp"
          android:layout_height="match_parent"
          app:layout_behavior="@string/appbar_scrolling_view_behavior" &gt;
  
      &lt;/android.support.v4.view.ViewPager&gt;
  
      &lt;!--&lt;include layout="@layout/dummy_layout"
          android:layout_width="fill_parent"
          android:layout_height="fill_parent"
          app:layout_behavior="@string/appbar_scrolling_view_behavior"
          /&gt;--&gt;
  
      &lt;include layout="@layout/menu_contents"
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          app:layout_behavior="@string/appbar_scrolling_view_behavior"
          /&gt;
  
      &lt;include layout="@layout/profile_contents"
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          app:layout_behavior="@string/appbar_scrolling_view_behavior"
          /&gt;
  
  &lt;/android.support.design.widget.CoordinatorLayout&gt;
  </code></pre>
  
  <p>mobile_fragment.xml</p>
  
  <pre><code>&lt;RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
      xmlns:tools="http://schemas.android.com/tools"
      android:id="@+id/mobile_relative_layout"
      android:layout_width="match_parent"
      android:layout_height="match_parent"
      tools:context="info.androidhive.materialtabs.fragments.OneFragment"&gt;
      &lt;View
          android:layout_width="match_parent"
          android:layout_height="1dp"
          android:background="#2f5392"
          android:id="@+id/view" /&gt;
  
      &lt;LinearLayout
          android:layout_width="wrap_content"
          android:id="@+id/linearlayout_one1"
          android:layout_marginTop="30dp"
          android:layout_centerHorizontal="true"
          android:layout_height="wrap_content"
          android:orientation="horizontal"
          &gt;
      &lt;RadioButton
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:text="Prepaid"
          android:textColor="#2f5392"
          android:layout_marginRight="20dp"
          android:id="@+id/prepaid_radio1"
          android:checked="false" /&gt;
  
      &lt;RadioButton
              android:layout_width="wrap_content"
              android:textColor="#2f5392"
              android:layout_height="wrap_content"
              android:text="Postpaid"
              android:id="@+id/postpaid_radio1"
              android:checked="false" /&gt;
      &lt;/LinearLayout&gt;
  
      &lt;LinearLayout
          android:layout_width="fill_parent"
          android:id="@+id/linearlayout_two1"
          android:layout_below="@+id/linearlayout_one1"
          android:layout_height="wrap_content"
          android:gravity="center_horizontal"
          android:layout_marginTop="20dp"
          android:orientation="vertical"
          &gt;
  
          &lt;EditText
              android:layout_width="300dp"
              android:hint="Enter Your Mobile Number"
              android:textSize="15sp"
              android:text="123xxxxxx"
              android:id="@+id/mobile_number1"
              android:paddingLeft="30dp"
              android:layout_height="wrap_content"
              android:drawableRight="@drawable/editbox_icon"
              /&gt;
  
          &lt;EditText
              android:layout_width="300dp"
              android:hint="Select Operator"
              android:paddingLeft="30dp"
              android:id="@+id/operator1"
              android:textSize="15sp"
              android:layout_height="wrap_content"
              android:drawableRight="@drawable/down_arrow"
              /&gt;
          &lt;EditText
              android:layout_width="300dp"
              android:drawableLeft="@drawable/indian_rupee"
              android:hint="    Amount"
              android:id="@+id/amount1"
              android:textSize="15sp"
              android:layout_height="wrap_content"
              android:drawableRight="@drawable/browse_plan"
              /&gt;
  
      &lt;/LinearLayout&gt;
  
      &lt;Button
          android:layout_below="@+id/linearlayout_two1"
          android:layout_marginTop="35dp"
          android:layout_width="250dp"
          android:id="@+id/proceed1"
          android:layout_centerHorizontal="true"
          android:layout_height="37dp"
          android:background="#2f5392"
          android:textColor="#ffffff"
          android:text="PROCEED"/&gt;
  
  &lt;/RelativeLayout&gt;
  </code></pre>
  
  <p>content_main.xml</p>
  
  <pre><code>&lt;?xml version="1.0" encoding="utf-8"?&gt;
  &lt;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:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:paddingTop="@dimen/activity_vertical_margin"
      android:paddingBottom="@dimen/activity_vertical_margin"
      app:layout_behavior="@string/appbar_scrolling_view_behavior"
      tools:showIn="@layout/activity_main" tools:context=".MainActivity"&gt;
  
      &lt;RelativeLayout
          android:id="@+id/relative_one"
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          &gt;
          &lt;ImageView
              android:layout_width="wrap_content"
              android:layout_height="wrap_content"
              android:src="@drawable/sms_rupee_logo"
              /&gt;
          &lt;ImageView
              android:id="@+id/menu_icon"
              android:layout_width="wrap_content"
              android:layout_marginRight="10dp"
              android:layout_alignParentRight="true"
              android:layout_height="wrap_content"
              android:src="@drawable/menu_icon"
              /&gt;
  
          &lt;ImageView
              android:id="@+id/wallet_icon"
              android:layout_width="wrap_content"
              android:layout_height="wrap_content"
              android:layout_marginRight="20dp"
              android:layout_toLeftOf="@+id/menu_icon"
              android:src="@drawable/wallet_icon" /&gt;
          &lt;ImageView
              android:id="@+id/profile_icon"
              android:layout_width="wrap_content"
              android:layout_height="wrap_content"
              android:layout_marginRight="20dp"
              android:layout_toLeftOf="@+id/wallet_icon"
              android:src="@drawable/profile_icon" /&gt;
  
      &lt;/RelativeLayout&gt;
  
  
  &lt;/RelativeLayout&gt;
  </code></pre>
  
  <p>profile_content.xml</p>
  
  <pre><code>&lt;?xml version="1.0" encoding="utf-8"?&gt;
  
  &lt;RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:orientation="vertical" &gt;
  
      &lt;LinearLayout
          android:id="@+id/profile_menu_list"
          android:layout_width="165dp"
          android:layout_height="fill_parent"
          android:layout_alignParentRight="true"
          android:clickable="true"
          android:layout_alignParentTop="true"
          android:background="#2f5392"
          android:orientation="vertical"
          android:visibility="invisible"
          &gt;
          &lt;LinearLayout
              android:layout_width="wrap_content"
              android:layout_height="wrap_content"
              android:orientation="horizontal"&gt;
  
          &lt;ImageView
              android:layout_width="wrap_content"
              android:layout_gravity="center_vertical"
              android:padding="8dp"
              android:layout_height="wrap_content"
              android:src="@drawable/add_user"/&gt;
  
          &lt;TextView
              android:id="@+id/register"
              android:layout_width="match_parent"
              android:layout_height="wrap_content"
              android:layout_marginLeft="3dp"
              android:layout_gravity="center_vertical"
              android:padding="8dp"
              android:text="Register"
              android:textColor="#fff"
              android:textSize="17dp"
              /&gt;
  
          &lt;/LinearLayout&gt;
  
      &lt;LinearLayout
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:orientation="horizontal"&gt;
  
          &lt;ImageView
              android:layout_width="wrap_content"
              android:padding="8dp"
              android:layout_height="wrap_content"
              android:layout_gravity="center_vertical"
              android:src="@drawable/login"/&gt;
  
          &lt;TextView
              android:id="@+id/login"
              android:layout_width="match_parent"
              android:layout_height="wrap_content"
              android:layout_gravity="center_vertical"
              android:layout_marginLeft="3dp"
              android:padding="8dp"
              android:text="Login"
              android:textColor="#ffffff"
              android:textSize="17dp"
              /&gt;
  
          &lt;/LinearLayout&gt;
  
      &lt;LinearLayout
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:orientation="horizontal"&gt;
  
          &lt;ImageView
              android:layout_width="wrap_content"
              android:padding="8dp"
              android:layout_height="wrap_content"
              android:layout_gravity="center_vertical"
              android:src="@drawable/referral"/&gt;
  
          &lt;TextView
              android:id="@+id/referrals"
              android:layout_width="match_parent"
              android:layout_height="wrap_content"
              android:layout_marginLeft="3dp"
              android:layout_gravity="center_vertical"
              android:padding="8dp"
              android:text="Referrals"
              android:textColor="#ffffff"
              android:textSize="17dp"
              /&gt;
          &lt;/LinearLayout&gt;
  
      &lt;LinearLayout
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:orientation="horizontal"&gt;
  
          &lt;ImageView
              android:layout_width="wrap_content"
              android:padding="8dp"
              android:layout_gravity="center_vertical"
              android:layout_height="wrap_content"
              android:src="@drawable/recharge"/&gt;
  
          &lt;TextView
              android:id="@+id/configure_easychange"
              android:layout_width="match_parent"
              android:layout_height="wrap_content"
              android:layout_marginLeft="3dp"
              android:layout_gravity="center_vertical"
              android:padding="8dp"
              android:text="Configure EasyCharge"
              android:textColor="#ffffff"
              android:textSize="17dp"
              /&gt;
          &lt;/LinearLayout&gt;
  
      &lt;/LinearLayout&gt;
  &lt;/RelativeLayout&gt;
  </code></pre>