Here is the code that i'm facing the problem i took 2 linear layout inside scroll view now the last button inside 2nd linear layout is hidden or i can say not showing properly.
Here is the screen shot.
you can check that i selected area is button but not working properly.
<ScrollView
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"
android:weightSum="1">
<LinearLayout
android:id="#+id/ConcernedPortionofScreen"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.25"
android:orientation="vertical">
</LinearLayout>
<LinearLayout
android:id="#+id/RestofScreen"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.75"
android:orientation="vertical"
android:padding="20dp">
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/custom_button_shape_with_bg_primary"
android:minHeight="#dimen/minimum_height_all_object"
android:layout_marginTop="#dimen/add_child_rquest_margin_top"
android:text="SELECT"
android:textColor="#color/white"
/>
</LinearLayout>
</LinearLayout>
</ScrollView>
when i try to remove layout_weight my layout getting mass.
<android.support.constraint.ConstraintLayout 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:background="#android:color/white"
android:orientation="vertical"
tools:context=".MainActivity">
<ScrollView 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="wrap_content"
android:orientation="vertical"
android:weightSum="1">
<LinearLayout
android:id="#+id/ConcernedPortionofScreen"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.25"
android:orientation="vertical">
<!-- Parent FrameLayout 'FL' -->
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<!--Conitans Tree Childs -->
</FrameLayout>
</LinearLayout>
<LinearLayout
android:id="#+id/RestofScreen"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.75"
android:orientation="vertical"
android:padding="20dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:weightSum="1">
<!--Conitans Two Childs -->
</LinearLayout>
<EditText
style="#style/CustomEdittextTheme"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/add_child_rquest_margin_top"
android:hint="Enter Child Name"
android:minHeight="#dimen/add_child_rquest_minimum_height_all_object" />
<EditText
style="#style/CustomEdittextTheme"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/add_child_rquest_margin_top"
android:hint="Select City"
android:minHeight="#dimen/add_child_rquest_minimum_height_all_object" />
<TextView
style="#style/CustomEdittextTheme"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/add_child_rquest_margin_top"
android:hint="Select Birthdate"
android:minHeight="#dimen/add_child_rquest_minimum_height_all_object" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="1">
<!--Conitans Two Childs -->
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="1">
<!--Conitans Two Childs -->
</LinearLayout>
<EditText
style="#style/CustomEdittextTheme"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/add_child_rquest_margin_top"
android:hint="Enter Mobile Number"
android:minHeight="#dimen/add_child_rquest_minimum_height_all_object" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="1">
<!--Conitans Two Childs -->
</LinearLayout>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/add_child_rquest_margin_top"
android:fontFamily="#font/segoe_ui_bold"
android:paddingLeft="10dp"
android:text="Note / Message :"
android:textColor="#color/colorPrimaryDark"
android:textSize="18dp" />
<EditText
style="#style/CustomEdittextTheme"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/add_child_rquest_margin_top"
android:inputType="textMultiLine"
android:lines="8"
android:maxLines="8"
android:minHeight="#dimen/add_child_rquest_minimum_height_all_object"
android:minLines="8"
android:scrollbars="vertical" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginTop="#dimen/add_child_rquest_margin_top"
android:background="#drawable/custom_button_shape_with_bg_primary"
android:fontFamily="#font/segoe_ui_bold"
android:minHeight="#dimen/add_child_rquest_minimum_height_all_object"
android:text="SUBMIT"
android:textColor="#color/white" />
</LinearLayout>
</LinearLayout>
</ScrollView>
</android.support.constraint.ConstraintLayout>
This Happends Because of layout_height="match_parent" for ScrollView child LinearLayout
Change layout_height to wrap_content
<ScrollView
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:layout_height="wrap_content"
android:orientation="vertical"
android:weightSum="1">
//childs ..........
</LinearLayout>
<ScrollView>
wrap_content
Setting a View's size to wrap_content will force it to expand only far enough to contain the values (or child controls) it contains. For controls -- like text boxes (TextView) or images (ImageView) -- this will wrap the text or image being shown. For layout elements it will resize the layout to fit the controls / layouts added as its children.
Official Docs Says
FILL_PARENT (renamed MATCH_PARENT in API Level 8 and higher), which means that the view wants to be as big as its parent (minus padding)
WRAP_CONTENT, which means that the view wants to be just big enough to enclose its content (plus padding)
Use nested Scroll View, scroll view will truncate the last item in the layout
add padding from bottom and check.
android:layout_marginBottom="5dp"
android:layout_paddingBottom="10dp"
The simplest solution is placing ConstraintLayout inside ScrollView like this
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true"
android:overScrollMode="never">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/constraintLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:baselineAligned="false"
android:orientation="vertical">
<!-- your other views could be here-->
<!-- your other views could be here-->
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
</ScrollView>
Related
I have a RecyclewView and a button below it, it's all inside the NestedScrollView. If I add more items to the RecyclerView, the button will hide.
Is there a way to attach the button to the bottom of the screen if there are a lot of elements, and to the bottom of the RecyclerView if it fits on the screen?
<androidx.core.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/recycler_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:itemCount="3"
tools:listitem="#layout/form_field" />
<Button
android:id="#+id/send_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="Click me" />
</LinearLayout>
</androidx.core.widget.NestedScrollView>
It should be like this:
You can take that view out of the NestedScrollView. like this:
Here is the edited code, it will work perfectly.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<androidx.core.widget.NestedScrollView
android:id="#+id/scroll_view"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/recycler_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:itemCount="3"
tools:listitem="#layout/form_field" />
</LinearLayout>
</androidx.core.widget.NestedScrollView>
<Button
android:layout_marginBottom="10dp"
android:id="#+id/send_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="Click me" />
</LinearLayout>
Try to use a ConstraintLayout instead of LinearLayout.
Set the constraint of the button on the left, bottom, top and right of the screen in te XML file.
<ScrollView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:fillViewport="true" >
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginTop="15px" >
<!-- bunch of components here -->
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_below="#+id/spinner"
android:layout_marginTop="5px"
android:gravity="center_horizontal|bottom"
android:paddingTop="2px" >
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingLeft="20px"
android:paddingRight="20px"
android:text="Delete" />
</LinearLayout>
</RelativeLayout>
I have a fragment_layout.xml with two buttons (filter_1_btn, filter_2_btn) that perform filtering to the items of a RecyclerView. The problem is that when I scroll a bit (because the TextView above the buttons contains multiple lines of text) and then apply the filtering, then the NestedScrollView scrolls on top of the screen. Is there a way to stay at the same scrolled height after the filtering?
fragment_layout
<?xml version="1.0" encoding="utf-8"?>
<androidx.core.widget.NestedScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/nested_scrollView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:descendantFocusability="blocksDescendants"
android:focusable="true"
android:focusableInTouchMode="true"
android:orientation="vertical">
<TextView
android:id="#+id/description_tv"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="36dp"
android:text="Very long random text..." />
<Button
android:id="#+id/filter_1_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Filter 1"/>
<Button
android:id="#+id/filter_2_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Filter 2"/>
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/list"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="24dp" />
</LinearLayout>
</androidx.core.widget.NestedScrollView>
This is happening because the recyclerView's container is set to wrap_content , so when the height get smaller than the NestedScrollView, it gets scrolled to top.
you can fix it by providing a height larger than NestedScrollView :
So add minHeight :
<?xml version="1.0" encoding="utf-8"?>
<androidx.core.widget.NestedScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/nested_scrollView"
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:descendantFocusability="blocksDescendants"
android:focusable="true"
android:focusableInTouchMode="true"
android:orientation="vertical">
<TextView
android:id="#+id/description_tv"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="36dp"
android:text="Very long random text..." />
<Button
android:id="#+id/filter_1_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Filter 1" />
<Button
android:id="#+id/filter_2_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Filter 2" />
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="1000dp">
<!-- Add min height to support scrolling-->
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/list"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="24dp" />
</FrameLayout>
</LinearLayout>
</androidx.core.widget.NestedScrollView>
The list of things expected in the outout
1.a linear layout to the buttom of the activity as shown in the expected image
2.a recycler view above the linear layout to achieve the scrolling funtionality as shown in the expected image
The problem can be solved if I give the height to the recycler view.But in this case the layout won't be responsive to the samller sized screens
How can I achieve it?
xmlfile.xml
<?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:numberpicker="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=".CartPage">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="70dp"
android:padding="20dp">
<ImageView
android:id="#+id/back_icon"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_centerVertical="true"
android:src="#drawable/ic_arrow_back_black_24dp" />
<TextView
android:id="#+id/product_buy"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center_vertical|center_horizontal"
android:layout_marginLeft="20dp"
android:layout_toRightOf="#+id/back_icon"
android:fontFamily="#font/carter_one"
android:text="My Cart"
android:textColor="#color/black"
android:textSize="20sp"
tools:ignore="RtlCompat" />
</RelativeLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/product_recycler"
android:layout_width="match_parent"
android:layout_height="400sp"
android:padding="0dp" />
// this is the buttom recycler
<LinearLayout
android:layout_alignParentBottom="true"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:id="#+id/buttom"
android:gravity="bottom|end"
android:layout_gravity="bottom"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/border_gray"
android:orientation="vertical"
android:padding="5dp">
<TextView
android:id="#+id/details"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/border_gray"
android:fontFamily="sans-serif"
android:lineHeight="28dp"
android:padding="5dp"
android:text="Price Details"
android:textColor="#color/grey_400"
android:textSize="18sp"
tools:ignore="RtlCompat" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
</LinearLayout>
If you wish to tell your RecyclerView to fill the left over space of your LinearLayout you have to use the following layout_height and layout_weight on your RecyclerView:
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/product_recycler"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:padding="0dp" />
I have the following RelativeView. I want
EditText at bottom
TextView on top - I have an issue here - it doesn't show but I don't understand why
2 ListViews between them - both taking half of the screen vertically
Please do you see why that top TextView doesn't show ?
<?xml version="1.0" encoding="utf-8"?>
<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">
<EditText
android:id="#+id/Search"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="text"
android:layout_alignParentBottom="true">
<requestFocus />
</EditText>
<View android:id="#+id/Placeholder"
android:layout_height="0dp"
android:layout_width="0dp"
android:layout_above="#id/Search"
android:layout_centerInParent="true"/>
<ListView
android:id="#+id/ResultsColumn1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignRight="#id/Placeholder"
android:layout_above="#id/Search" />
<ListView
android:id="#+id/ResultsColumn2"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignLeft="#id/Placeholder"
android:layout_above="#id/Search"/>
<TextView
android:id="#+id/InformationTextTop"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#id/ResultsColumn1"
android:text="Why is this not visible ?"/>
</RelativeLayout>
It's simply because the ListViews have match_parent in the android:layout_height property and the TextView is defined after them in the xml. Since this is a pretty simple layout I would recommend to use the LinearLayout instead.
<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">
<TextView
android:id="#+id/InformationTextTop"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#id/ResultsColumn1"
android:text="Why is this not visible ?"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:orientation="horizontal">
<ListView
android:id="#+id/ResultsColumn1"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"/>
<ListView
android:id="#+id/ResultsColumn2"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"/>
</LinearLayout>
<EditText
android:id="#+id/Search"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="text">
<requestFocus />
</EditText>
</LinearLayout>
I'm trying to create a responsive layout using weights but I also need to use a scroll view in this case.
This is my code at this moment:
<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=".EncyclopediaFragment">
<!--Linear Container-->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:weightSum="100">
<!--Title Box-->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="20"
android:orientation="horizontal"
android:weightSum="100">
<!--Empty Space-->
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="5">
</LinearLayout>
<!--Text Box-->
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="95">
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="#string/encyclopedia_mosntersLabel"
android:gravity="center"
android:textAlignment="viewStart"/>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="40">
</LinearLayout>
</LinearLayout>
but it needs to be like this.
That layout is suppose to be responsive with weights but at the same time I need to make it possible to scroll.
So my question is: how can I create a layout responsive with weights and at the same time a layout that can scroll down, just like in the picture?
If you have a determined number of 6 Monsters and 8 Towers, here is how you should organize your layout:
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Monsters"/>
<!-- the following LinearLayout should be repeated twice for 6 Monsters -->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<MonsterView
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="wrap_content" />
<MonsterView
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="wrap_content" />
<MonsterView
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="wrap_content" />
</LinearLayout>
...
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Towers"/>
<!-- the following LinearLayout should be repeated twice for 6 Towers -->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TowerView
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="wrap_content" />
<TowerView
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="wrap_content" />
<TowerView
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="wrap_content" />
</LinearLayout>
...
<!-- attention here for two Towers in the last row -->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="3">
<TowerView
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="wrap_content" />
<TowerView
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="wrap_content" />
</LinearLayout>
</LinearLayout>
</ScrollView>
The content inside your ScrollView should use wrap_parent, and if you want to stretch the content inside it set android:fillViewport="true". Try this:
<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=".EncyclopediaFragment">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<!--Linear Container-->
</RelativeLayout>
</ScrollLayout>
</RelativeLayout>
<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=".EncyclopediaFragment">
<!--Toolbar-->
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<!--Linear Container With Weights-->
</RelativeLayout>
</ScrollLayout>
</RelativeLayout>