androidxmlandroid-fragmentsandroid-viewpager
How to hide layout when click outside of it?
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.
This is my app sturcture:
This is the problem:
Here is my code:
MainActivity.java
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<Fragment> mFragmentList = new ArrayList<>();
private final List<String> mFragmentTitleList = new ArrayList<>();
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);
}
}
MobileFragemnt.java
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;
}
}
activity_main.xml
<?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"
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">
<android.support.design.widget.AppBarLayout
android:layout_height="wrap_content"
android:layout_width="match_parent" android:theme="@style/AppTheme.AppBarOverlay">
<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">
<include layout="@layout/content_main"/>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#2f5392"
app:layout_behavior="@string/appbar_scrolling_view_behavior"
/>
<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"/>
<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" >
</android.support.v4.view.ViewPager>
<!--<include layout="@layout/dummy_layout"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior"
/>-->
<include layout="@layout/menu_contents"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_behavior="@string/appbar_scrolling_view_behavior"
/>
<include layout="@layout/profile_contents"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_behavior="@string/appbar_scrolling_view_behavior"
/>
</android.support.design.widget.CoordinatorLayout>
mobile_fragment.xml
<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">
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#2f5392"
android:id="@+id/view" />
<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"
>
<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" />
<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" />
</LinearLayout>
<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"
>
<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"
/>
<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"
/>
<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"
/>
</LinearLayout>
<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"/>
</RelativeLayout>
content_main.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: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">
<RelativeLayout
android:id="@+id/relative_one"
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/sms_rupee_logo"
/>
<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"
/>
<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" />
<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" />
</RelativeLayout>
</RelativeLayout>
profile_content.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical" >
<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"
>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageView
android:layout_width="wrap_content"
android:layout_gravity="center_vertical"
android:padding="8dp"
android:layout_height="wrap_content"
android:src="@drawable/add_user"/>
<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"
/>
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageView
android:layout_width="wrap_content"
android:padding="8dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:src="@drawable/login"/>
<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"
/>
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageView
android:layout_width="wrap_content"
android:padding="8dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:src="@drawable/referral"/>
<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"
/>
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageView
android:layout_width="wrap_content"
android:padding="8dp"
android:layout_gravity="center_vertical"
android:layout_height="wrap_content"
android:src="@drawable/recharge"/>
<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"
/>
</LinearLayout>
</LinearLayout>
</RelativeLayout>
Solution
Firstly, you can get an instance of an Activity inside its fragment by help of getActivity() method. Use this instance to call any method of the activity from your fragment like this :-
((MainActivity) getActivity()).methodName();
Secondly, I would suggest you to convert that bar into a NavigationDrawer which will benefit you by providing you with a much cleaner user interface with more cleaner transitions.