Scroll View is not working with relative layout - android

I tried to make a scroll view. However,it does not display the viewPager inside the scroll view. I don't know which part is wrong.
This is my xml file
<?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"
tools:context="com.example.qianonnphoon.tradeal.displaytrade.DisplayTradeActivity">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v4.view.ViewPager
android:id="#+id/view_pager"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.design.widget.TabLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabBackground="#drawable/tab_selector"
app:tabGravity="center"
app:tabIndicatorHeight="0dp">
</android.support.design.widget.TabLayout>
</android.support.v4.view.ViewPager>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="23dp"
android:layout_below="#+id/view_pager"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:id="#+id/tvOwnItemName"/>
</RelativeLayout>
</ScrollView>
This is the output
The viewPager is not displayed. The viewPager will be displayed only when I removed the scroll view

try this out:
<ScrollView
android:id="#+id/scroll"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scrollbars="vertical">
android:fillViewport="true" >
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
</RelativeLayout>
</ScrollView>

Try adding this piece of code before loading your viewPager
NestedScrollView scrollView = (NestedScrollView) findViewById
(R.id.nest_scrollview);
scrollView.setFillViewport (true);

Add
android:fillViewport="true"
to scrollview and set scrollview height to
android:layout_height="300dp"
solve my problem.
However, I dont know why the height cannot set as wrap_content

Related

How to add button to a view pager in Android Studio?

I want to add a button to a View Pager. Tried adding button, fragment, and layout without success.
I've also tried this:
Add button to ViewPager
But it didn't work.
This is my layout
<?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:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context="com.airpal.yonatan.airpal.MainActivity_User">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/appBarLayout">
<include layout="#layout/app_bar_layout" android:id="#+id/main_page_toolbar" />
<android.support.design.widget.TabLayout
android:id="#+id/main_tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabSelectedTextColor="#android:color/white"
app:tabTextColor="#android:color/white">
</android.support.design.widget.TabLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/main_tabPager"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/appBarLayout">
</android.support.v4.view.ViewPager>
</LinearLayout>
This is the screen shot, I want to add the button on the bottom of the page.
Thanks.
You can Wrap this LinearLayout in the Relative layout. If you don't want to change the Linear layout to RelativeLayout. Here is the modified layout XML and It will display Button the Bottom Right. You can modify layout_alignParentRight to left, center depend on your need.
<?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"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context="com.airpal.yonatan.airpal.MainActivity_User">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/appBarLayout">
<include layout="#layout/app_bar_layout" android:id="#+id/main_page_toolbar" />
<android.support.design.widget.TabLayout
android:id="#+id/main_tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabSelectedTextColor="#android:color/white"
app:tabTextColor="#android:color/white">
</android.support.design.widget.TabLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/main_tabPager"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/appBarLayout">
</android.support.v4.view.ViewPager>
</LinearLayout>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Submit"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"/>
</RelativeLayout>
Try using RelativeLayout for the root view and use :
android:layout_alignParentBottom="true"
With LinearLayout at root view is not possible. Also, instead of RelativeLayout, ConstraintLayout is a good alternative.

NestedSCrollView not scrolling fully in CoordinatorLayout

I have a NestedSCrollView inside CoordinatorLayout. In the NestedSCrollViewthere is a ViewPager. I put a fragment view in it containing WebView. The problem is that if the text in the WebView is very long it gets cut and I can't scroll. How to solve this?
<android.support.v4.widget.NestedScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/nest_scrollview"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<LinearLayout
android:orientation="vertical"
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"
app:tabMode="scrollable"
app:tabGravity="fill"/>
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
This is the fragment xml:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<WebView
android:id="#+id/appearance"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="5dp"
/>
The problem is that ViewPager does not support wrap_content. So it has to be precise or match parent.
Another solution is to override OnMeasure method of the ViewPager. Check out this answer.

NestedScrollView could not scroll with match_parent height child

I implement NonSwipeableViewPager with a fragment has NestedScrollView like this, what I expect is that the scrollview can scroll up and show 2 textviews:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.NestedScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<include
android:id="#+id/header"
android:layout_width="match_parent"
android:layout_height="match_parent"
layout="#layout/header" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="16dp"
android:src="#drawable/ic_up" />
</RelativeLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Text 1" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Text 2" />
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
But it could not scroll, I tried many ways but still did not get any solution
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.NestedScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
This linearlayout should have android:layout_height="wrap_content".
Reason for that is that if the scrollview's child is the same size as the scrollview itself (both match_parent for height) it means that there is nothing to scroll through, since they are of same size and the scrollview will only be as high as the screen.
If the linearlayout has a height of wrap_content then the height is not related to the height of the screen and the scrollview will be able to scroll through it.
Just remember that a scrollview can only have 1 direct child, and that child needs android:layout_height="wrap_content"
In my case app:layout_behavior="#string/appbar_scrolling_view_behavior" this is working only if some one face problem will be try it and may be solve your problem too. you should add also android:fillViewport="true" but without this my code working.
<android.support.v4.widget.NestedScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:background="#drawable/subscription_background"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
For me it worked when i added "android:layout_marginBottom="100dp"" for last child in androidx.core.widget.NestedScrollView
if you have used netedscrollview as follow you have to use
android:scrollbars="vertical"
<androidx.core.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintTop_toBottomOf="#id/toolbar_updateUserDetails"
app:layout_constraintBottom_toBottomOf="parent"
android:fillViewport="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:scrollbars="vertical"
>
</LinearLayout>
</androidx.core.widget.NestedScrollView>
You have to calculate your other child because last child binding on nestedScrollView. You add margin like child height. It is working.

ViewPager causes wrong layout display

I have added viewpager in an activity with the following layout:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent" android:layout_height="match_parent"
android:weightSum="1">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center_horizontal"
android:layout_weight="0.45">
<include
android:id="#+id/toolbar"
layout="#layout/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0.1" />
</FrameLayout>
<android.support.v4.view.ViewPager
android:id="#+id/imgdetail"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="0.15"
android:foregroundGravity="center_vertical|fill_vertical">
</android.support.v4.view.ViewPager>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/container1"
android:layout_weight="0.4"></FrameLayout>
</LinearLayout>
But the toolbar colour has moved and the viewpager has gone to the center of the screen.
Do you need to put the toolbar inside the frame layout. And if so, consider removing the wight for the toolbar and just leave the wrap_content.
Change the height of the layouts with weight specified to "0dip".
If all else fails consider changing the wights to whole numbers and add them to make the wight_sum of the linear_layout e.g.toolbar frame layout gets 9, view pager gets 3, frame at the bottom gets 8 and weight_sum is 20.
Its easy to implement your layout using RelativeLayout. Use RelativeLayout and make the ToolBar layout the top child and put ViewPager below "Toolbar layout".
Hope this helps.
Regards,
Try this layout
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<include
android:id="#+id/toolbar"
layout="#layout/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"/>
<android.support.v4.view.ViewPager
android:id="#+id/imgdetail"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="?attr/actionBarSize"/>
<FrameLayout
android:id="#+id/container1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="?attr/actionBarSize"/>
</FrameLayout>
Try it this way. Just specify the height of the elements
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<include
android:id="#+id/toolbar"
layout="#layout/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<android.support.v4.view.ViewPager
android:id="#+id/imgdetail"
android:layout_below="#id/toolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:foregroundGravity="center_vertical|fill_vertical">
</android.support.v4.view.ViewPager>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/container1"
android:layout_below="#id/imgdetail">
</FrameLayout></RelativeLayout>

How to get Toolbar to overlay sibling layout (z-ordering)

For the life of me, I cannot get this Toolbar to layout on top (note: not above, but on top of) its sibling LinearLayout. The only way I can get the Toolbar to overlay its sibling is by specifying the Toolbar's elevation to be > 0, but this doesn't work for pre-5.0.
I am using a parent FrameLayout, and the child Toolbar is located after its sibling LinearLayout in the XML. What am I missing? Even the Android Studio preview pane shows the Toolbar on top of the LinearLayout
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent">
<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:id="#+id/fragment_main_container"
tools:context=".MainActivity"
tools:ignore="MergeRootFrame"
android:orientation="vertical"
>
<FrameLayout
android:layout_weight="4"
android:layout_width="match_parent"
android:layout_height="0dp">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="#drawable/ic_launcher"
/>
</FrameLayout>
<ListView
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="5"
android:id="#+id/home_list_listview"
android:drawSelectorOnTop="true"
android:divider="#null"
android:dividerHeight="0dp"
tools:listitem="#layout/home_list_item"
>
</ListView>
<TextView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:text="#string/slogan"
android:gravity="center"
android:textColor="#color/colorPrimaryDark"
/>
</LinearLayout>
<android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
app:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="?attr/actionBarSize"
android:background="#android:color/transparent"
/>
</FrameLayout>
Turns out I had a fragment committing the linear layout over the main activity, which already contained it. Oops!
That's because of FrameLayout.
If you want to use FrameLayout, the views will not relate each other.
So all you need to do is ...
set "height of toolbar" to MarginTop of LinearLayout.
Hope, it will help.

Categories

Resources