Layout with tabs with ad on bottom and a button above it - android

I have created a layout with tabs
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:ads="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
</android.support.design.widget.CoordinatorLayout>
<com.google.android.gms.ads.AdView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
ads:adSize="SMART_BANNER"
ads:adUnitId="#string/ad_id"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true">
</com.google.android.gms.ads.AdView>
</RelativeLayout>
One of the tabs is
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/image_section"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:orientation="vertical">
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/image"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/text"
android:gravity="center"/>
</LinearLayout>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/button"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:gravity="center"/>
</RelativeLayout>
The problem is that before the ad loads I can see the button all the way on the bottom. How would I make the layout for the tab to take up exactly the space available instead of the whole screen? Same way if I added a button and make it be on top, instead of appearing below the tabs, it appears all the way on the top.
EDIT: I would like to make it look like this image
The button is part of tab content that is shown and the ad is part of the main layout. The problem is that whenever I set button to android:layout_alignParentBottom="true" then I end up with it being on the bottom and hidden behind the ad.

Change the root of your main layout to vertical LinearLayout instead of RelativeLayout.
Now you have two children in LinearLayout i.e CoordinatorLayout and AdView.
Since you want AdView to lie below CoordinatorLayout and CordinatorLayout to occupy the rest of the space,
set the height of CoordinatorLayout as android:layout_height="match_parent" with android:layout_weight="1" and the issue should be fixed.
Also change the height of AppBarLayout and TabLayout to match_parent.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:ads="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
</android.support.design.widget.CoordinatorLayout>
<com.google.android.gms.ads.AdView
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_gravity="center"
ads:adSize="SMART_BANNER"
ads:adUnitId="#string/ad_id">
</com.google.android.gms.ads.AdView>
</LinearLayout>
There is no need to change in the other layout. But I would recommend you use LinearLayout as the root layout instead of RelativeLayout
So here are the changes that I would recommend doing in your tab layout:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:id="#+id/image_section"
android:orientation="vertical">
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/image"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/text"
android:gravity="center"/>
</LinearLayout>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/button"
android:layout_centerHorizontal="true"
android:gravity="center"/>
</LinearLayout>
Edit: Attaching images for better understanding:

Have You tried setting minHeight in Your AdView?
Change your Tab layout to this:
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/image_section"
android:orientation="vertical">
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/image"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/text"
android:gravity="center"/>
<View
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"/>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/button"
android:gravity="center"/>
</LinearLayout>

Related

How to set view between activity views and tablayout?

I have a TabLayout. In the MainActivity where I set the TabLayout I also have three buttons and a banner on bottom (so those buttons and banner are on front of the the tablayout). What I want to do is place an ImageView exactly between the button/banner and the tab. How can I achieve this?
Here is a picture of the layout, I want the view exactly in center between buttons and layout.
Code main_activity:
<?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"
xmlns:tools="http://schemas.android.com/tools"
xmlns:ads="http://schemas.android.com/apk/res-auto"
android:id="#+id/main_content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context="com.tomhogenkamp.NeonDiscoLight.MainActivity">
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.google.android.gms.ads.AdView
android:id="#+id/adView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_alignParentBottom="true"
ads:adSize="BANNER"
ads:adUnitId="ca-app-pub-3940256099942544/6300978111">
</com.google.android.gms.ads.AdView>
<LinearLayout
android:layout_above="#id/adView"
android:id="#+id/linearLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="3">
<Button
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="settings"
android:id="#+id/setting"/>
<Button
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="start"
android:id="#+id/start"/>
<Button
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="rate"
android:id="#+id/rate"/>
</LinearLayout>
</RelativeLayout>
and code for fragment:
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/background">
<View
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/viewStrobe"/>
<ImageView
android:layout_above="#+id/linearLayout"
android:id="#+id/imageViewStroboscope"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerInside"
android:adjustViewBounds="true"/>
</RelativeLayout>

Content inside NestedScrollview is pushed down

I have a screen contain collapsable toolbar (AppBarLayout) and scrollable content with NestedScrollviews
My Main layout:
<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:theme="#style/ToolbarTheme"
android:layout_width="match_parent"
android:layout_height="#dimen/actionBarHeight"
android:background="#color/colorPrimary"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light" />
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true"
android:scrollbars="none"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<FrameLayout
android:id="#+id/layoutMainContent"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>
And the layout content that I put into FrameLayout layoutMainContent is as below
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/colorBackground">
<LinearLayout
android:id="#+id/layoutAbout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_centerInParent="true">
<ImageView
android:id="#+id/ivLogo"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_gravity="center_horizontal"
android:src="#drawable/logo"/>
</LinearLayout>
<TextView
android:id="#+id/tvViewDetail"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:textColor="#color/colorPrimary"
android:text="#string/see_license"
android:gravity="center_horizontal"/>
</RelativeLayout>
What I want is the logo image is in the center and the TextView (tvViewDetail) is at the bottom the the screen. However, logo image is not in the center (pushed down a little bit) and tvViewDetail is pushed out of the screen.
Is there anything I've done wrong? Any suggestion would be helpful!
Thank you all masters,
Try this way I hope it helps.
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/colorBackground">
<LinearLayout
android:id="#+id/layoutAbout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:gravity="center"
android:layout_centerInParent="true">
<ImageView
android:id="#+id/ivLogo"
android:layout_width="100dp"
android:layout_height="100dp"
android:src="#drawable/logo"/>
<TextView
android:id="#+id/tvViewDetail"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/colorPrimary"
android:text="#string/see_license"/>
</LinearLayout>
</RelativeLayout>
hence linearlayout height and width will be wrap_content and gravity will be center so all child of that linear layout will be at center of the linear layout. and linear layout also appear at the center of the relative layout.

Fragment container layout overlapping main activity contents

I am trying to add a custom header in my main activity that already contains a bottom navigator and a framelayout that acts as a container for the fragments i want to display.
The below given code contains a Linearlayout["#+id/application_header] that should act as the application header, however the header is displayed by the fragment container[#+id/main_container] is overlapping the header.
Tried the properties android:layout_below and android:layout_above but it is still overlapping.
<?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:design="http://schemas.android.com/apk/res-auto"
android:id="#+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.amplitude.tron.volksradio.MainActivity">
<LinearLayout
android:id="#+id/application_header"
android:layout_width="match_parent"
android:layout_height="50dp"
android:orientation="horizontal"
android:gravity="center_horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="RADIO"
android:layout_gravity="center"/>
</LinearLayout>
<FrameLayout
android:id="#+id/main_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/application_header"
android:layout_above="#+id/bottomNavigationBar"
android:layout_alignParentTop="true">
</FrameLayout>
<android.support.design.widget.BottomNavigationView
android:id="#+id/bottomNavigationBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
design:menu="#menu/bottom_menu_navigation"
android:background="#50b1b5b9">
</android.support.design.widget.BottomNavigationView>
</RelativeLayout>
<?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">
<LinearLayout
android:id="#+id/application_header"
android:layout_width="match_parent"
android:layout_height="50dp"
android:orientation="horizontal"
android:gravity="center_horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="RADIO"
android:layout_gravity="center"/>
</LinearLayout>
<FrameLayout
android:id="#+id/main_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/application_header"
android:layout_above="#+id/bottomNavigationBar"
android:layout_alignParentTop="true">
</FrameLayout>
<android.support.design.widget.BottomNavigationView
android:id="#+id/bottomNavigationBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
design:menu="#menu/bottom_menu_navigation"
android:background="#50b1b5b9">
</android.support.design.widget.BottomNavigationView>
</LinearLayout>
android:layout_below and android:layout_above work with RelativeLayout. BTW, the LinearLayout with only one TextView is redundant. You can just use TextView. Here are some options on how to get that done.
Using RelativeLayout:
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:design="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:id="#+id/application_header"
android:layout_width="match_parent"
android:layout_height="50dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="RADIO"/>
</LinearLayout>
<FrameLayout
android:id="#+id/main_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/bottomNavigationBar"
android:layout_alignParentTop="true"
android:layout_below="#id/application_header">
</FrameLayout>
<android.support.design.widget.BottomNavigationView
android:id="#+id/bottomNavigationBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:background="#50b1b5b9"
design:menu="#menu/bottom_menu_navigation">
</android.support.design.widget.BottomNavigationView>
</RelativeLayout>
Using LinearLayout:
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:design="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:id="#+id/application_header"
android:layout_width="match_parent"
android:layout_height="50dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="RADIO"/>
</LinearLayout>
<FrameLayout
android:id="#+id/main_container"
android:layout_width="match_parent"
android:layout_height="match_parent">
</FrameLayout>
<android.support.design.widget.BottomNavigationView
android:id="#+id/bottomNavigationBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:background="#50b1b5b9"
design:menu="#menu/bottom_menu_navigation">
</android.support.design.widget.BottomNavigationView>
</LinearLayout>
One more (better) alternative would be using CoordinatorLayout with Toolbar:
<android.support.design.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:design="http://schemas.android.com/tools">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
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:background="?attr/colorPrimary"
app:popupTheme="#style/AppTheme.PopupOverlay"/>
</android.support.design.widget.AppBarLayout>
<FrameLayout
android:id="#+id/main_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/application_header"
android:layout_above="#+id/bottomNavigationBar"
android:layout_alignParentTop="true"
app:layout_behavior="#string/appbar_scrolling_view_behavior"/>
<android.support.design.widget.BottomNavigationView
android:id="#+id/bottomNavigationBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
design:menu="#menu/bottom_menu_navigation"
android:background="#50b1b5b9"/>
</android.support.design.widget.CoordinatorLayout>
Solved it my self, although there might other clean solution and would be accepted as answer if found feasible.
I just added android:layout_marginTop="50dp" which is same as the height of element with id - #+id/application_header
PS- i don't know if this would effect screens with different sizes and my testing device is only 5.5 inches to which the solution worked perfectly.
You can also make the layout align center of the screen by adding this :
android:layout_centerInParent="true"
also add a padding or margin incase there is any small amount of overlapping

Toolbar overlaps LinearLayout

I have a LinearLayout with 2 inner LinearLayouts. If I add the Toolbar in this layout-file it always overlaps the whole layout. So only the Toolbar is visible. In the other layout-files it worked without any problem.
<LinearLayout 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="match_parent"
android:orientation="horizontal"
tools:context="de.dk.mafi.ActMain">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="40dp"
android:background="?attr/colorPrimary"
android:fitsSystemWindows="true"
android:minHeight="?attr/actionBarSize"
android:padding="2dp"
app:titleMarginStart="20dp"
app:titleTextAppearance="#style/MyMaterialTheme.Base.TitleTextStyle"
app:titleTextColor="#color/textColorPrimary">
<TextView
android:id="#+id/toolbar_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="TEST"
android:textColor="#android:color/white"
android:textStyle="bold|italic"/>
</android.support.v7.widget.Toolbar>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_margin="20dp"
android:layout_weight="1"
android:orientation="vertical">
<TextView
android:id="#+id/text"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#drawable/border"
android:padding="10dp"
android:text="#string/welcome"/>
<Button android:id="#+id/button2" android:layout_width="match_parent"
android:layout_height="wrap_content" android:text="Favoriten"/>
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_margin="20dp"
android:layout_weight="1"
android:orientation="vertical">
<ImageView
android:id="#+id/imageView"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:src="#drawable/training"/>
<Button android:id="#+id/button" android:layout_width="match_parent"
android:layout_height="wrap_content" android:text="Hauptmenü"/>
</LinearLayout>
What is the problem here?
The first LinearLayout has a wrong orientation. It should be set with vertical, instead of horizontal which gives the other children (as the inner LinearLayouts) to be draw after the Toolbar on the right outside the width screen. Change to:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
...
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:fitsSystemWindows="true">
Then, remove the android:fitsSystemWindows="true" from the Toolbar.
EDIT:
I just did this, it works as expected:
<LinearLayout 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:orientation="vertical"
android:fitsSystemWindows="true"
tools:context="...">
<include layout="#layout/include_toolbar" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#color/blue"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#color/red"/>
</LinearLayout>
Where I'm reusing this Toolbar layout on other Activities:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"/>
Output:
My test contains above/below inner children, but to keep your requirements, juste add a parent container for the children, easily do as:
<LinearLayout ...>
<include layout="#layout/include_toolbar" />
<!-- use a parent container with horizontal orientation -->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1" .../>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1" .../>
</LinearLayout>
</LinearLayout>

Scroll a TextView out the screen

I have a bit of a predicament.
My Layout is currently this:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/white"
android:orientation="vertical">
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:isScrollContainer="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="#+id/item_shipping_shipping_description"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="start|left"
android:padding="#dimen/margin_16"/>
<View
android:id="#+id/line43"
android:layout_width="match_parent"
android:layout_height="#dimen/line_height"
android:background="#color/light_gray"/>
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
<android.support.v7.widget.RecyclerView
android:id="#+id/item_shipping_fragment_recyclerview"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/white"
android:isScrollContainer="true"/>
</LinearLayout>
The TextView is dynamic content set by the server and it can be really long sometimes.
The problem I am having is the TextView can take up the whole screen. This XML is a fragment that is in a TabLayout with a collapsable toolbar. So when I scroll the content I would like the TextView to scroll out the screen, if this is possible. I tried to embed the Textview in a scrollView but this doesn't work as you see about?
Got any ideas how I can still have the CollapsableToolbar collapse as well as scroll the Textview out the screen to reveal the RecyclerView?
Thank you
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/white"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:isScrollContainer="true">
<TextView
android:id="#+id/item_shipping_shipping_description"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="start|left"
android:padding="#dimen/margin_16"/>
</android.support.v4.widget.NestedScrollView>
<View
android:id="#+id/line43"
android:layout_width="match_parent"
android:layout_height="#dimen/line_height"
android:background="#color/light_gray"/>
</LinearLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/item_shipping_fragment_recyclerview"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/white"
android:isScrollContainer="true"/>
</LinearLayout>

Categories

Resources