Develop Reference

A lot of frame layout in activity

I am trying to add a lot of Frame Layout to activity. It looks like:
photo1
photo2
How much will appear on the screen depends on the screen resolution so I would like to add over a dozen fragments and make activity scrollable. I want it to look like list view. For now I have a few Frame Layout and adds fragments one by one. If anyone has an idea how to do it, please help me. Thanks.
FragmentManager fragmentManager = getSupportFragmentManager();
Fragment s1 = new SingleCourseFragment();
FragmentTransaction fragmentTransaction = fragmentManager.beginTransaction();
FrameLayout container = findViewById(R.id.fragmentContainer);
fragmentTransaction.add(R.id.fragmentContainer, s1);
fragmentTransaction.commit();
Fragment s2 = new SingleCourseFragment();
FragmentTransaction fragmentTransaction2 = fragmentManager.beginTransaction();
fragmentTransaction2.add(R.id.fragmentContainer2, s2);
fragmentTransaction2.commit();
FrameLayout container2 = findViewById(R.id.fragmentContainer2);
Fragment s3 = new SingleCourseFragment();
FragmentTransaction fragmentTransaction3 = fragmentManager.beginTransaction();
fragmentTransaction3.add(R.id.fragmentContainer3, s3);
fragmentTransaction3.commit();
FrameLayout container3 = findViewById(R.id.fragmentContainer3);
Fragment s4 = new SingleCourseFragment();
FragmentTransaction fragmentTransaction4 = fragmentManager.beginTransaction();
fragmentTransaction4.add(R.id.fragmentContainer4, s4);
fragmentTransaction4.commit();
FrameLayout container4 = findViewById(R.id.fragmentContainer4);
container.setVisibility(View.VISIBLE);
container2.setVisibility(View.VISIBLE);
container3.setVisibility(View.VISIBLE);
container4.setVisibility(View.VISIBLE);
XML
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:descendantFocusability="beforeDescendants"
android:focusableInTouchMode="true"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:context=".MainActivity"
tools:showIn="#layout/activity_main">
<EditText
android:id="#+id/startET"
android:layout_width="match_parent"
android:layout_height="40dp"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:inputType="text"
android:layout_margin="20dp"
android:enabled="false"
android:gravity="center"
android:background="#drawable/rounded_border_edittext"
android:hint="#string/start"/>
<EditText
android:id="#+id/endET"
android:layout_width="match_parent"
android:layout_height="40dp"
android:layout_alignParentStart="true"
android:layout_below="#+id/startET"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:layout_marginBottom="20dp"
android:enabled="false"
android:gravity="center"
android:background="#drawable/rounded_border_edittext"
android:inputType="text"/>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/fragmentContainer"
android:layout_below="#+id/endET"
android:visibility="invisible">
</FrameLayout>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/fragmentContainer2"
android:layout_below="#+id/fragmentContainer"
android:visibility="invisible">
</FrameLayout>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/fragmentContainer3"
android:layout_below="#+id/fragmentContainer2"
android:visibility="invisible">
</FrameLayout>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/fragmentContainer4"
android:layout_below="#+id/fragmentContainer3"
android:visibility="invisible">
</FrameLayout>
</RelativeLayout>

If I understood correctly, you just want to make your layout scrollable.
You can make the top-level layout a ScrollView as below
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true">
<!-- Then put your layout here as such-->
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:descendantFocusability="beforeDescendants"
android:focusableInTouchMode="true"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:context=".MainActivity"
tools:showIn="#layout/activity_main">
<!-- other widgets in your layout -->
</RelativeLayout>
</ScrollView>
Update
You could try adding in the xml
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true">
<!-- Add a linear layout-->
<LinearLayout
android:id="#+id/list_of_frags"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
</LinearLayout>
</ScrollView>
Or
//Begin the transaction
LinearLayout layout = (LinearLayout)findViewById(R.id.list_of_frags);
FragmentTransaction ft = getSupportFragmentManager().beginTransaction();
//You can create an array with the container
ArrayList<int> listOfContainers = ArrayList<int>()
listOfContainers.add(R.id.fragmentContainer1)
listOfContainers.add(R.id.fragmentContainer2)
listOfContainers.add(R.id.fragmentContainer3)
listOfContainers.add(R.id.fragmentContainer4)
Int AmountOfFragments = 4
//Replace the contents of the container with the new fragmentTest
for (int i = 0; i < AmountOfFragments; i++){
//Or You can create the FrameLayout programmatically as below
FrameLayout frame = new FrameLayout(this);
frame.setId(i);
layout.addView(frame);
ft.add(i, new SingleCourseFragment());
//if you do the above you don't need this line
ft.add(listOfContainers[i], new SingleCourseFragment());
}
//Complete the changes
ft.commit();

Replacing a single fragment with multiple fragments

I have one activity (Navigation Controller) that controls multiple fragments. The initial screen the user sees is a single fragment placed into one container. When I click a button to a different fragment I need to add the first fragment to the backstack and add the two new fragments to different containers than the first one. The two fragments are a map fragment on top and a profile details fragment on the bottom Is this even possible?
The code is below.
Navigation Controller Home Fragment (this is the main screen when the app starts):
public void home(Bundle savedInstanceState){
FragmentManager fm = getFragmentManager();
FragmentTransaction fragmentTransaction = fm.beginTransaction();
if (findViewById(R.id.fragment_container) != null) {
if (savedInstanceState != null) {
return;
}
// Create a new Fragment to be placed in the activity layout
CurrentFriendsFragment firstFragment = new CurrentFriendsFragment();
// Add the fragment to the 'fragment_container' FrameLayout
fragmentTransaction
.setCustomAnimations(R.animator.fade_in, R.animator.fade_out)
.replace(R.id.fragment_container, firstFragment, "firstFragment")
.commit();
}
}
Navigation Controller Profile Fragment:
#Override
public void onProfileButtonClicked() {
FragmentManager fm = getFragmentManager();
FragmentTransaction fragmentTransaction = fm.beginTransaction();
if (findViewById(R.id.fragment_container) != null) {
if (savedInstanceState1 != null) {
return;
}
MapFragment mapFragment = new MapFragment();
// Create a new Fragment to be placed in the activity layout
ProfileFragment profileFragment = new ProfileFragment();
// Add the fragment to the 'fragment_container' FrameLayout
fragmentTransaction
.setCustomAnimations(R.animator.slide_in_up, R.animator.slide_out_up, R.animator.slide_in_down, R.animator.slide_out_down)
.add(R.id.fragment_container_bottom_large, profileFragment)
.add(R.id.fragment_container_top_small, mapFragment)
.commit();
}
}
And here is the main activities xml file. Note the three different containers. "fragment_container" for full screen fragments, and "fragment_container_top_small", "fragment_container_bottom_large" for multiple fragments on one page.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/activity_navigation"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.parse.starter.ViewControllers.NavigationController"
android:background="#color/palette_darkwhite">
<include layout="#layout/tool_bar"
android:id="#+id/toolbar_layout" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_below="#+id/toolbar_layout"
android:layout_above="#+id/bottom_navigation_navbar">
<RelativeLayout
android:id="#+id/fragment_container_top_small"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
</RelativeLayout>
<FrameLayout
android:id="#+id/fragment_container_bottom_large"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="3">
</FrameLayout>
</LinearLayout>
<FrameLayout
android:id="#+id/fragment_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/toolbar_layout"
android:layout_above="#+id/bottom_navigation_navbar">
</FrameLayout>
<FrameLayout
android:id="#+id/fragment_container_popup"
android:layout_width="275dp"
android:layout_height="275dp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true">
</FrameLayout>
<android.support.design.widget.BottomNavigationView
android:id="#+id/bottom_navigation_navbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:background="#color/palette_lightwhite">
<ImageView
android:layout_width="20dp"
android:layout_height="20dp"
android:layout_gravity="center_horizontal"
android:background="#null"
app:srcCompat="#drawable/collpaseup" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center_vertical">
<LinearLayout android:id="#+id/thumbnail2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="3dp"
android:layout_alignParentLeft="true"
android:layout_marginRight="5dp">
<de.hdodenhof.circleimageview.CircleImageView
android:id="#+id/profile_picture_navbar"
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_gravity="center_vertical"
app:civ_border_color="#FF000000"/>
</LinearLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="#+id/thumbnail2"
android:layout_toRightOf="#+id/thumbnail2"
android:textColor="#color/palette_primarycolor"
android:id="#+id/nameLabel"
android:text="Name"
android:textSize="15sp"
android:textStyle="bold"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/nameLabel"
android:layout_toRightOf="#+id/thumbnail2"
android:textColor="#color/palette_primarycolor"
android:id="#+id/locationLabel"
android:text="Location"
android:textSize="12sp"
android:textStyle="bold"/>
</RelativeLayout>
</android.support.design.widget.BottomNavigationView>
</RelativeLayout>

Have 3 containers and use View.GONE to make the 1st disappear and then View.VISIBLE to make the other 2 appear.

Replacing fragments on click of button android

I am trying to create a swappable fragements on my android app
Only half the part of fragment seems to be replacing
screenshot:
The xml file for the main is
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:showIn="#layout/app_bar_main"
tools:context=".MainActivity"
android:id="#+id/contentlayout">
<fragment
android:layout_width="match_parent"
android:layout_height="60dp"
android:id="#+id/header_menufragment"
class="com.example.www.newapp.header_menu" />
<fragment
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/dynamicfragment"
class="com.example.www.newapp.mainfragment"/>
</LinearLayout>
the whole dynamicfragment is supposed to be replaced by projectfragment on click of Project button.
project.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
getFragmentManager()
.beginTransaction()
.replace(R.id.dynamicfragment, new projectfragment())
.addToBackStack(null)
.commit();
}
});
the projectfragment class has
public class projectfragment extends Fragment {
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,Bundle savedInstanceState) {
return inflater.inflate(R.layout.fragment_project, container,false);
}
}
the layout file is
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingLeft="15dp"
android:paddingRight="15dp"
android:paddingBottom="10dp"
android:paddingTop="10dp"
android:background="#color/colorDarkRed">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
android:layout_weight=".5">
<ImageButton
android:id="#+id/img1"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_weight="1" />
<ImageButton
android:id="#+id/img2"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_weight="1" />
</LinearLayout>
<ImageButton
android:id="#+id/img3"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:src="#drawable/imgfile"/>
</LinearLayout>
Kindly help me solve this issue.

You cannot replace a fragment defined statically in the layout file. You can only replace fragments that you added dynamically via a FragmentTransaction.
Use FrameLayout as container and replace Fragment inside that.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent" android:layout_height="match_parent">
<FrameLayout android:id="#+id/fragment_container" android:layout_weight="1"
android:layout_width="match_parent" android:layout_height="match_parent" />
</LinearLayout>
On Activity add Fragment same as you do:
getFragmentManager()
.beginTransaction()
.replace(R.id.fragment_container, new projectfragment())
.addToBackStack(null)
.commit();
For more info refer below link:
link1
link2

that worked for me try this way
WishaFriend ff = new WishaFriend();
android.app.FragmentManager fm = getActivity().getFragmentManager();
android.app.FragmentTransaction ft = fm.beginTransaction();
ft.replace(((ViewGroup) getView().getParent()).getId(), ff);
ft.commit();
dialog.dismiss();
try add this
ft.replace(((ViewGroup) getView().getParent()).getId(), ff);

I want to replace fragment but its add after previous fragment

I want to replace fragment but android app add new fragment after first fragment instead of replace fragment. And after that when i try to replace again app replace with fragment which one is added after first fragment. First fragment which was loaded on activity, remain static. Can any body help? I am using this code to replace fragment.
Fragment fr = fragment;
FragmentManager fm = getSupportFragmentManager();
FragmentTransaction ft = fm.beginTransaction();
ft.replace(R.id.frgRemote, fr);
ft.commit();
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context="com.cerad.home.automation.RoomsActivity$PlaceholderFragment" >
<LinearLayout
android:id="#+id/lytHeader"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#+id/lytCamcontroller"
android:orientation="vertical" >
<TextView
android:id="#+id/tvHeading"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:textAppearance="?android:attr/textAppearanceMedium" />
<ImageView
android:id="#+id/stream_image"
android:layout_width="640px"
android:layout_height="480px"
android:layout_gravity="center_horizontal"
android:layout_margin="5dp"
android:background="#drawable/border"
android:contentDescription="#string/image_descriptor_video_streaming" />
<ScrollView
android:id="#id/lytCommandnControl"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<fragment
android:id="#+id/frgRemote"
android:name="com.cerad.automation.DefaultRemoteFragment"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<TableLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TableRow
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center" >
<Button
android:id="#+id/btnTVRemote"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="#string/button_tv_remote" />
<Button
android:id="#+id/btnDefault"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:checked="true"
android:text="#string/button_default_control" />
<Button
android:id="#+id/btnACRemote"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="#string/button_ac_remote" />
</TableRow>
</TableLayout>
</ScrollView>
</LinearLayout>
<ProgressBar
android:id="#+id/progressBar1"
style="?android:attr/progressBarStyleHorizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true" />
</RelativeLayout>

I have three fragments, i replace like this:
private void displayView(int position) {
Fragment fragment = null;
switch (position) {
case 0:
fragment = new HomeFragment();
break;
case 1:
fragment = new AlterFragment();
break;
case 2:
fragment = new ExtraFragment();
break;
default:
break;
}
if (fragment != null) {
FragmentManager fragmentManager = getFragmentManager();
fragmentManager.beginTransaction().replace(R.id.frame_container, fragment).commit();
mDrawerList.setItemChecked(position, true);
mDrawerList.setSelection(position);
setTitle(navMenuTitles[position]);
mDrawerLayout.closeDrawer(mDrawerList);
}
else {
}
}

You might want to re-read the documentation for FragmentTransaction.replace():
The first argument to replace(int containerViewId, Fragment fragment) is not the ID of the fragment's view, but the ID of the container of the fragment. Hence your call adds a new nested fragment (of the same type) inside the fragment view wrapper of the already existing fragment.
From FragmentTransaction.replace(id, frag, tag)'s documentation:
This is essentially the same as calling remove(Fragment) for all currently added fragments that were added with the same containerViewId and then add(int, Fragment, String) with the same arguments given here.
To fix this, you must give an ID to the LinearLayout containing your fragment, e.g.
<LinearLayout
android:id="#+id/fragment_container"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
and call replace() with the ID of the container.
ft.replace(R.id.fragment_container, fr);
It is also good practice to always assign unique tags to pre-defined fragments:
<fragment
android:id="#+id/frgRemote"
android:name="com.cerad.automation.DefaultRemoteFragment"
android:tag="remote_fragment"
android:layout_width="match_parent"
android:layout_height="match_parent" />
So that you can address multiple fragments by their unique tags, if necessary
ft.replace(R.id.fragment_container, fr, "remote_fragment");

Why findFragmentById returns the old fragment was in before the call to replace FragmentLayout?

Why after changing fragments from the first(pageNews) to the second(pageViewFromWeb) "findFragmentById" returns a reference to the first(pageNews) fragment?
layout:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity"
android:paddingTop="10dp"
android:background="#000">
<FrameLayout
android:id="#+id/frgmCont"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#000000">
</FrameLayout>
</RelativeLayout>
code:
fTrans = getSupportFragmentManager().beginTransaction();
fTrans.add(R.id.frgmCont, pageNews);
....
....
public void selectNews(String news_id) {
// Toast.makeText(this, news_id, Toast.LENGTH_SHORT).show();
fTrans = getSupportFragmentManager().beginTransaction();
fTrans.replace(R.id.frgmCont, pageViewFromWeb);
fTrans.commit();
Fragment fragment = getSupportFragmentManager().findFragmentById(R.id.frgmCont);
...
}

Its because replace() does not execute immediately, but the FragmentTransaction is scheduled. When you findFragmentById() immediately after replacing fragments, they are not replaced yet...