Fragment application, how to add a footer? - java

I'm working on an Android application with 4 tabs.
Here is my activity_main.xml
<android.support.v4.view.ViewPager xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="match_parent">
</android.support.v4.view.ViewPager>
And here is one of my tab (they are all the same for the moment)
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="#ff8400" >
<TextView android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="Top Screen"
android:textSize="20dp"
android:layout_centerInParent="true"/>
</RelativeLayout>
How could I add a footer that would be visible on each tab?
It's to add a player that stays visible while scrolling the tab.

You're going to need to make a change to your main activity layout. You can do it with a LinearLayout or RelativeLayout. Because a LinearLayout is less expensive I will show you that here.
<?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:orientation="vertical">
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1"/>
<View
android:id="#+id/music_player"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
</LinearLayout>
The view could been anything, I would recommend using a framelayout there and putting in a fragment if it is going to be as complicated as a music player. How this works is you set the height of the musicplayer (wrap_content) and you tell the pager to take up the rest of the space with layout_height="0dp" and layout_weight="1".
If you want to do a RelativeLayout then the musicplayer would alignParentBottom="true" and the pager would have layout_above="#+id/music_player with either layout_height="matchparent" or alignParentTop="true".

Related

How to make my fragment fit between my toolbar and bottom navigation bar and still make it scrollable?

So I will have my main-activity layout file below so you can understand what is happening
<?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"
tools:context=".MainActivity">
<include
android:id="#+id/toolbar"
layout="#menu/toolbar"/>
<FrameLayout
android:id="#+id/fragment_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/bottom_nav">
</FrameLayout>
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/bottom_nav"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
app:menu="#menu/bottom_navigation"
app:itemIconTint="#android:color/white"
android:background="#39b54a"
app:labelVisibilityMode="unlabeled">
</com.google.android.material.bottomnavigation.BottomNavigationView>
</RelativeLayout>
The problem with this layout is that the toolbar on the top and the bottom navigation bar cover content from my fragments. Also one of my fragments has got a recyclerview with many items and I canĀ“t scroll down for some reason ? Is there a way to make the fragments fit exactly between the toolbar and bottomnavigation like resizing itself to fit into that area without cutting content and still make it scrollable ?
Do it like this ...
<?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"
tools:context=".MainActivity">
<include
android:id="#+id/toolbar"
layout="#layout/toolbar_layout"/> <!--include your layout file here -->
<FrameLayout
android:id="#+id/fragment_container"
android:layout_width="match_parent"
android:layout_below="#id/toolbar"
android:layout_height="match_parent"
android:layout_above="#+id/bottom_nav">
</FrameLayout>
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/bottom_nav"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
app:menu="#menu/bottom_nav_menu"
app:itemIconTint="#android:color/white"
android:background="#39b54a"
app:labelVisibilityMode="unlabeled">
</com.google.android.material.bottomnavigation.BottomNavigationView>
</RelativeLayout>
And by the way, you are supposed to set a layout resource file into the toolbar layout while including but you are passing the menu resource file. Change that also accordingly...

RecyclerView inside LinearLayout and NestedScrollView - How to scroll to top of item on a certain position?

I implemented RecyclerView. I would like a view scroll to top of item on 5th position in RecyclerView. scrollToPosition(5) don't work
XML file:
<?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:card_view="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="128dp"
android:orientation="vertical">
<androidx.core.widget.NestedScrollView
android:id="#+id/nestedScrollView_mark"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:id="#+id/linearLayout_markView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/recyclerView_marks"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="1dp" />
<LinearLayout
android:id="#+id/linearLayout_behavior"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:background="#drawable/layout_bg"
android:orientation="vertical"
android:visibility="invisible">
in Fragment:
recyclerView.setLayoutManager(new LinearLayoutManager(getActivity()));
recyclerView.getLayoutManager().scrollToPosition(5);
recyclerView.setAdapter(adapter);
The scrollToPosition() needs to be used with any of the following ways to restore the scroll position to the selected position.You can save the selected position in onPause() and then restore subsequently.
There might be two useful ways :-
Using onSaveInstanceState() function to save the state as explained here.
Using Shared Prefereneces to store the position, and restoring the state after the onCreateView.

How to get a whole screen in an activity to scroll when a scrollable recyclerView imakes up only half of the phone screen

I want my whole screen to scroll but only my recycler will scroll at the moment. This occurs despite all elements being placed in a linear layout inside a Scroll View.
Any ideas where the error is? Here's the relevant code.
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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"
tools:context=".NoodleDetailActivity">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<ImageView
android:id="#+id/noodleImage"
android:layout_width="match_parent"
android:layout_height="200dp"
android:adjustViewBounds="false"
android:scaleType="centerCrop"
app:srcCompat="#mipmap/ic_launcher" />
<TextView
android:id="#+id/description"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/border_bottom"
android:fontFamily="sans-serif-smallcaps"
android:hapticFeedbackEnabled="false"
android:padding="30dp"
android:text="TextView"
android:textSize="18sp" />
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/extras_recycler"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="0dp"
android:background="#F2F2F2"
android:padding="0dp" />
</LinearLayout>
</ScrollView>
</androidx.constraintlayout.widget.ConstraintLayout>
This is what it looks visually.
demo appearance
Found out: it seems best practice is to set the recyclerView to be the whole layout and make it contain multiple view types.
I won't be using a nested scroll view.

Recycler view taking entire screen.Not displaying my UI element above it

I'm trying to add an Imageview above my recycler view but the recycler view ends up taking the whole screen and doesn't display my image view.
<?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/frameLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clipToPadding="false"
tools:context=".AccountFragment">
<android.support.v7.widget.RecyclerView
android:id="#+id/blogListView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#id/imageView">
</android.support.v7.widget.RecyclerView>
<ImageView
android:id="#+id/imageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/acc"
tools:layout_editor_absoluteX="146dp"
tools:layout_editor_absoluteY="86dp" />
</RelativeLayout>
Add this attribute to the ImageView:
android:layout_alignParentTop="true"
so it is at the top of the parent layout.
If you think that these attributes:
tools:layout_editor_absoluteX="146dp"
tools:layout_editor_absoluteY="86dp"
affect the position of the ImageView, then you are wrong.
Any attribute from the tools namespace is valid only at design time.
So you might as well remove them.
Also you might want to center the ImageView horizontally:
android:layout_centerHorizontal="true"
hi try to set this as i checked its working
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/frameLayout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/imageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/icon_play" />
<android.support.v7.widget.RecyclerView
android:id="#+id/blogListView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/imageView"></android.support.v7.widget.RecyclerView>
</RelativeLayout>
A RelativeLayout places every element at the start of the screen (0,0). In your case the ImageView is behind the RecyclerView. If you need to display RecyclerView below ImageView, opt for LinearLayout instead, with orientation set to vertical.
<?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:id="#+id/frameLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clipToPadding="false"
android:orientation="vertical"
tools:context=".AccountFragment">
<ImageView
android:id="#+id/imageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/acc" />
<android.support.v7.widget.RecyclerView
android:id="#+id/blogListView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/imageView">
</android.support.v7.widget.RecyclerView>
</RelativeLayout>
Try the above code and let me know if it works.

Floating Submit Button

The submit button in the activity layout floats to the top left of the phone screen even after the fragment has been added resulting in it obscuring some of the fragment's content. should it not be pushed down when the following code is called:
currentFragment = MyFragment.newInstance();
getSupportFragmentManager().beginTransaction()
.replace(R.id.my_fragment, currentFragment).commit();
Activity Layout:
<?xml version="1.0" encoding="UTF-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools" android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<fragment android:name="com.mycompany.myapp.MyFragment"
android:id="#+id/my_fragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:layout="#layout/my_fragment_layout"/>
<Button
android:id="#+id/submit_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/submit_button_text"
/>
</FrameLayout>
Fragment layout (my_fragment_layout.xml):
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/question_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<TextView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/text"/>
<RadioGroup android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/radio_buttons"></RadioGroup>
</LinearLayout>
What am I missing about fragments and layouts here?
As per your requirement , your Activity parent layout should be LinearLayout or RelativeLayout not FrameLayout. Also set a layout weight for Fragment layout, so that it will occupy the remaining space, used by the Button
Change your activity layout like this
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools" android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<fragment
android:id="#+id/my_fragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:layout="#layout/my_fragment_layout"
android:layout_weight="100"/>
<Button
android:id="#+id/submit_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="submit_button_text"/>
</LinearLayout>
One more suggestion here. If your adding your Fragment using Fragment Manager programmatically you can just define the Fragment container as FrameLayout in XML (Any way your creating the instance of fragment in code).
<FrameLayout
android:id="#+id/my_fragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="100"/>
Hope this helps to fix your issue.

Categories

Resources