Show/Hide Fragments and change the visibility attribute programmatically

Question

This is a 2 part problem. What I'm having is a 3 Fragment layout where the 3'rd Fragment(FragmentC) is added dynamically when the user taps a button found in another fragment. Then, after it's added the 3'rd Fragment has a button to maximize/minimize it.

UPDATE: Scrool at the end for SOLUTION

PROBLEM 1:

I'm trying to change the visibility attribute of a FrameLayout that acts as a container for the 3'rd fragment(R.id.fragment_C).

What the code is supposed to do is to generate another fragment that, originally has an XML containing android:visibility = "gone". Then, the Fragment is added when tapping a button and the visibility is suppose to change to VISIBLE.

I know this has been covered before, but after 4 hours of trying to make it work I decided to ask what I'm doing wrong.

PROBLEM 2:

After the 3'rd fragment is generated I have a minimize/maximize button that's supposed to hide the first 2 Fragments and allow the 3'rd Fragment to fill the screen.

The problem is the Views of the first 2 Fragments are not removed when using .setVisibility(View.GONE). This has been covered before as well, but I can't figure out why it doesn't work in my code.

The code so far(sorry if it's to verbose but I thought it's better to include all details for you folks):

main_activity.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:paddingLeft="0dp"
    android:paddingRight="0dp"
    android:orientation="vertical"
    >

    <FrameLayout
        android:id="@+id/fragment_A"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:background="#CCCCCC" 
        >
    </FrameLayout>

    <FrameLayout
        android:id="@+id/fragment_B"
        android:layout_width="fill_parent"
        android:layout_height="300dp"
        android:layout_below="@id/fragment_A"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="15dp"
        android:background="#B4B4B4"
        >
    </FrameLayout>

    <FrameLayout
        android:id="@+id/fragment_C"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_below="@id/fragment_B"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="0dp"
        android:background="#A3A3A3"
        android:visibility="gone"
        >
    </FrameLayout>

</RelativeLayout>

land/main_activity.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="horizontal"
    android:paddingLeft="0dp"
    android:paddingRight="0dp" >

    <LinearLayout
        android:id="@+id/fragments_container"
        android:layout_width="fill_parent"
        android:layout_height="200dp"
        android:baselineAligned="false" >

        <FrameLayout
            android:id="@+id/fragment_A"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_weight="0.5"
            android:background="#CCCCCC" >
        </FrameLayout>

        <FrameLayout
            android:id="@id/fragment_B"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_weight="0.5"
            android:background="#B4B4B4"
             >
        </FrameLayout>
    </LinearLayout>

    <FrameLayout
        android:id="@+id/fragment_C"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_below="@id/fragment_container"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="0dp"
        android:background="#A3A3A3"
        android:visibility="gone" >
    </FrameLayout>

</RelativeLayout>

MainActivity.java

package com.example.android.fragments_proto.activity;

import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentTransaction;

import com.example.android.fragments_proto.R;
import com.example.android.fragments_proto.fragment.GMC_DateSelectionFragment;
import com.example.android.fragments_proto.fragment.GMC_ProdUnitSelectionFragment;

public class MainActivity extends FragmentActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        setContentView(R.layout.main_activity);

        FragmentManager fm = getSupportFragmentManager();

        Fragment fragmentA = fm.findFragmentById(R.id.fragment_A);

        Fragment fragmentB = fm.findFragmentById(R.id.fragment_B);

        if (fragmentA == null) {

            FragmentTransaction ft = fm.beginTransaction();
            ft.add(R.id.fragment_A, new FragmentA());
            ft.commit();
        }

        if (fragmentB == null) {

            FragmentTransaction ft = fm.beginTransaction();
            ft.add(R.id.fragment_B, new FragmentB());
            ft.commit();
        }
    }
}

Now the XML and .java files for the first Fragment.

fragment_A.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center_horizontal"
    >

    <DatePicker
        android:id="@+id/datePicker1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

</LinearLayout>

FragmentA.java

package com.example.android.fragments_proto.fragment;

import android.app.Activity;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.MotionEvent;
import android.view.View;
import android.view.View.OnTouchListener;
import android.view.ViewGroup;
import android.widget.DatePicker;
import android.widget.Toast;

import com.example.android.fragments_proto.R;

public class FragmentA extends Fragment {

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {

        View view = inflater.inflate(R.layout.fragment_A, container, false);

        DatePicker datePicker = (DatePicker) view.findViewById(R.id.datePicker1);
        datePicker.setCalendarViewShown(true);
        datePicker.setSpinnersShown(false);            

        datePicker.setOnTouchListener(new OnTouchListener() {

            @Override
            public boolean onTouch(View v, MotionEvent event) {
                 Activity activity = getActivity();

                    if (activity != null) {

                        Toast.makeText(activity, "You Touched ME!", Toast.LENGTH_SHORT).show();
                    }
            return false;
            }
        });

        return view;
    }
}

Now the XML and .java files for the Fragment that contains the button that when tapped adds the content in R.id.fragment_C

fragment_B.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    >

    <LinearLayout
        android:orientation="horizontal"
        android:layout_width="fill_parent"
        android:layout_height="0dp"
        android:layout_weight="0.1"
        >

        <ListView
            android:id="@+id/listView1"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            >
        </ListView>

    </LinearLayout>

    <LinearLayout
        android:layout_width="fill_parent"
        android:orientation="horizontal"
        android:gravity="center"
        android:layout_height="wrap_content">

            <Button
                android:id="@+id/button"
                android:text="@string/btn_fragment"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
            />

    </LinearLayout>

</LinearLayout>

FragmentB.java

package com.example.android.fragments_proto.fragment;

import android.app.Activity;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentTransaction;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ArrayAdapter;
import android.widget.Button;
import android.widget.ListView;

import com.example.android.fragments_proto.R;

public class FragmentB extends Fragment {

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {

        View view = inflater.inflate(R.layout.fragmentB, container, false);

        ListView listView = (ListView) view.findViewById(R.id.listView1);
        Button button = (Button) view.findViewById(R.id.button);

        String[] machines = new String[] { "MachineId-001", "MachineId-002", "MachineId-003", "MachineId-004", "MachineId-005", "MachineId-006", "MachineId-007", "MachineId-008"};

        listView.setChoiceMode(ListView.CHOICE_MODE_MULTIPLE);
        listView.setAdapter(new ArrayAdapter<String>(getActivity(), android.R.layout.select_dialog_multichoice, machines));
        final FrameLayout frameLayout = (FrameLayout) view.findViewById(R.id.fragment_C);

        button.setOnClickListener(new View.OnClickListener() {

            @Override
            public void onClick(View v) {
               Activity activity = getActivity();

               if (activity != null) {
                   getFragmentManager().beginTransaction().replace(R.id.fragment_C, new FragmentC()).setTransition(FragmentTransaction.TRANSIT_FRAGMENT_FADE).addToBackStack(null).commit();
                   frameLayout.setVisibility(View.VISIBLE);
                }
            }

        });

        return view;
    }

}

The XML and .java files for the Fragment that's supposed to be added.

fragment_C.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <LinearLayout
        android:layout_width="fill_parent"
        android:orientation="horizontal"
        android:gravity="center"
        android:layout_height="wrap_content">

    <Button
        android:id="@+id/maximize_button"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="Maximize Me!" />

    </LinearLayout>

    <TextView 
        android:id="@+id/text_view"
        android:textIsSelectable="true"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:background="#FF33FF"
        />

</LinearLayout>

FragmentC.java

package com.example.android.fragments_proto.fragment;

import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentTransaction;
import android.view.LayoutInflater;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.ViewGroup;
import android.widget.Button;
import android.widget.TextView;

import com.example.android.fragments_proto.R;

public class FragmentC extends Fragment {

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
            Bundle savedInstanceState) {

        View view = inflater.inflate(R.layout.fragment_C, container, false);

        TextView textView = (TextView) view.findViewById(R.id.text_view);

            final Fragment fragmentA = getFragmentManager().findFragmentById(R.id.fragment_A);
            final Fragment fragmentB = getFragmentManager().findFragmentById(R.id.fragment_B);

            button.setOnClickListener(new OnClickListener() {
                public void onClick(View v) {
                    FragmentTransaction ft = getFragmentManager().beginTransaction();

                    if (fragmentA.isVisible() && fragmentB.isVisible()) {
                        ft.hide(fragmentA);
                        ft.hide(fragmentB);
                        fragmentA.getView().setVisibility(View.GONE);
                        fragmentB.getView().setVisibility(View.GONE);
                        button.setText("Minimize Me!");
                        ft.addToBackStack(null);
                    } else {
                        ft.show(fragmentA);
                        ft.show(fragmentB);
                        fragmentA.getView().setVisibility(View.VISIBLE);
                        fragmentB.getView().setVisibility(View.VISIBLE);
                        button.setText("Maximize Me!");
                        ft.addToBackStack(null);
                    }
                    ft.commit();
                }
            });     

        return view;

    }
}

Found the problem and a solution thanks to Moesio

PROBLEM:

My error was that I was trying to find a view (in FragmentB.java) with

final FrameLayout frameLayout = (FrameLayout) view.findViewById(R.id.fragment_C);

This line was returning null so when the code reached the point where it was supposed to do a .setVisibility() then the app. would return a nullPointerException.

The same happened for FragmentC.java (so my 2 problems were related). The Views were not removed because my findViewById was null!

SOLUTION:

Just search for your View with getActivity.findViewById(R.id.your_view);

Answer 1

In FragmentB you're trying get a view which is not on your contentView

public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {

    View view = inflater.inflate(R.layout.fragment_b, container, false);

    // this is in fragment_b layout
    ListView listView = (ListView) view.findViewById(R.id.listView1);
    Button button = (Button) view.findViewById(R.id.button);

    /* ... */
    // ****************************************
    // this is NOT in fragment_b layout, which causes null
    // ****************************************
    final FrameLayout frameLayout = (FrameLayout) view.findViewById(R.id.fragment_C);

    /* ... */
}

Try:

    final FrameLayout frameLayout = (FrameLayout) getActivity().getWindow().findViewById(R.id.fragment_C);

Whereas R.id.fragment_C is inflated and setted on MainActivity.

Moreover, I had the same problem until use an extra flag

    FragmentTransaction fragmentTransaction = getSupportFragmentManager().beginTransaction();
    final Fragment fragmentC = new FragmentC();
    fragmentTransaction.add(R.id.fragment_C, fragmentC);
    fragmentTransaction.commit();
    menuIsOn = false;

    final View fragmentCView = findViewById(R.id.fragment_C);

    final Button btn = (Button) findViewById(R.id.btn);
    btnPowers.setOnClickListener(new View.OnClickListener() {

        @Override
        public void onClick(View v) {
            if (!menuIsOn) {
                fragmentCView.setVisibility(View.VISIBLE);
            } else {
                fragmentCView.setVisibility(View.INVISIBLE);
            }
            menuIsOn = !menuIsOn;
        }
    });