Develop Reference

How to put buttons below scrollview and always show button without being overlapped by scrollview in Android?

My layout is like this
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<EditText
android:id="#+id/searchKey"
android:gravity="center_horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="xx" />
<ScrollView
android:layout_weight="1"
android:fillViewport="true"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:id="#+id/search_results"
android:textSize="#dimen/text_font_size"
android:layout_gravity="center_horizontal"
android:gravity="center_horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</ScrollView>
<LinearLayout
android:orientation="horizontal"
android:layout_gravity="center|bottom"
android:layout_weight="1"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Button
android:id="#+id/lastCharacterButton"
android:layout_weight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/lastChar_btn" />
<Button
android:id="#+id/nextCharacterButton"
android:layout_weight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/nextChar_btn" />
</LinearLayout>
</LinearLayout>
However, when there are little or no text, the buttons are pulled up, when there are too many text in search_results TextView, the buttons won't show up because scrollview takes the space all the way to the bottom. Any suggestion to always keep the buttons at the bottom and always visible?

First of all you have to set the ScrollView's height to 0dp.
<ScrollView
android:layout_weight="1"
android:fillViewport="true"
android:layout_width="match_parent"
android:layout_height="0dp">
<TextView
android:id="#+id/search_results"
android:textSize="#dimen/text_font_size"
android:layout_gravity="center_horizontal"
android:gravity="center_horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</ScrollView>
You have to do this because the weight param is going to control the size of the view depending on how much space is available. If you set it to wrap content, it will take how much space it needs to wrap everything within.
Then you need to remove your LinearLayout's weight param:
<LinearLayout
android:orientation="horizontal"
android:layout_gravity="center|bottom"
android:id="#+id/LL1"
android:layout_alignParentBottom="true"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Button
android:id="#+id/lastCharacterButton"
android:layout_weight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Last_Char" />
<Button
android:id="#+id/nextCharacterButton"
android:layout_weight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="next_char" />
</LinearLayout>
And the reason for doing that is just the opposite of the previous explanation: in this case the wrap content is going to take the space necessary to always display the buttons within.

Here is some sample code I put together for you. You basically need to take out the linear layout you have wrapping you xml layout and use a relative layout instead. Once you do that you can add ids to the linear layout with the buttons and then have the edit text align to the parent top. Then you can put the scrollview below the edittext and then put the scrollview above to the linear layout containing the buttons. This should work!
<?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"
tools:context="com.example.thegamefan93.loginregister.LoginActivity">
<EditText
android:id="#+id/searchKey"
android:gravity="center_horizontal"
android:layout_width="match_parent"
android:layout_alignParentTop="true"
android:layout_height="wrap_content"
android:hint="xx" />
<ScrollView
android:layout_weight="1"
android:fillViewport="true"
android:layout_below="#id/searchKey"
android:layout_width="match_parent"
android:layout_above="#+id/LL1"
android:layout_height="wrap_content">
<TextView
android:id="#+id/search_results"
android:textSize="20sp"
android:layout_gravity="center_horizontal"
android:gravity="center_horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</ScrollView>
<LinearLayout
android:orientation="horizontal"
android:layout_gravity="center|bottom"
android:layout_weight="1"
android:id="#+id/LL1"
android:layout_alignParentBottom="true"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Button
android:id="#+id/lastCharacterButton"
android:layout_weight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Last_Char" />
<Button
android:id="#+id/nextCharacterButton"
android:layout_weight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="next_char" />
</LinearLayout>
</RelativeLayout>

Try this,
<?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">
<EditText
android:id="#+id/searchKey"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:hint="xx" />
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#+id/linear"
android:layout_below="#+id/searchKey"
android:layout_weight="1"
android:fillViewport="true">
<TextView
android:id="#+id/search_results"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:gravity="center_horizontal"
android:textSize="#dimen/text_font_size" />
</ScrollView>
<LinearLayout
android:id="#+id/linear"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:orientation="horizontal">
<Button
android:id="#+id/lastCharacterButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="#string/lastChar_btn" />
<Button
android:id="#+id/nextCharacterButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="#string/nextChar_btn" />
</LinearLayout>
</RelativeLayout>

Listview at the bottom that i have designed for android doesnt show up entirely

You can see the code below that belongs layout design.
<LinearLayout
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="wrap_content"
xmlns:android="http://schemas.android.com/apk/res/android"
android:padding="5dp">
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageView
android:id="#+id/profilePic2"
android:layout_width="#dimen/feed_item_profile_pic"
android:layout_height="#dimen/feed_item_profile_pic"
android:scaleType="fitCenter" >
</ImageView>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:paddingLeft="#dimen/feed_item_profile_info_padd" >
<TextView
android:id="#+id/name2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:textSize="#dimen/feed_item_profile_name"
android:textStyle="bold" />
<TextView
android:id="#+id/timestamp2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:textColor="#color/timestamp"
android:textSize="#dimen/feed_item_timestamp" />
<TextView
android:text="TextView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/textCategory2"
android:layout_weight="1"
android:textStyle="normal|bold"/>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="#+id/content2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingBottom="5dp"
android:paddingLeft="#dimen/feed_item_status_pad_left_right"
android:paddingRight="#dimen/feed_item_status_pad_left_right"
android:paddingTop="#dimen/feed_item_status_pad_top"
android:layout_weight="1"/>
<ImageView
android:id="#+id/contentImage2"
android:layout_width="match_parent"
android:background="#color/white"
android:scaleType="fitCenter"
android:visibility="visible"
android:cropToPadding="false"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
app:srcCompat="#drawable/bg_parent_rounded_corner"
android:layout_weight="1"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:isScrollContainer="false"
android:keepScreenOn="false"
android:measureWithLargestChild="false"
android:verticalScrollbarPosition="defaultPosition"
android:paddingBottom="10dp">
<TextView
android:text="#string/yorumlar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/textView"
android:layout_weight="1"/>
<ListView
android:layout_width="match_parent"
android:id="#+id/comList"
android:layout_height="wrap_content"
android:layout_centerHorizontal="false"
android:clipChildren="false"
android:headerDividersEnabled="false"
/>
</LinearLayout>
</LinearLayout>
</LinearLayout>
</ScrollView>
</LinearLayout>
We can see details of the post showing up top of the screen, comments are at the bottom of the screen. Comments doesnt show up entirely despite of scrollview included listview and i have “layout_height:wrap_content”. First comment showing up but else doesnt show up with scroll.
Thanks for the answers
Screenshot

You have to change following things to display the list:
change the height of root linear layout from wrap content to match parent.
android:layout_height="match_parent"
do the same thing to scroll view
android:layout_height="match_parent"
3 now change the height of listview, I have given android:layout_height="500dp" this. You can adjust this with your requirement.
NOTE: List view will not work inside scrollview without giving static height. So you have to give height as 400..500dp or you can remove scrollview.

How to make a text center top and other text center of screen in LinearLayout?

I have two textviews. I want to make a textview center of top which can be used as title of application. And the second textview is center of screen which used to show detail. I am use ScrollView and LinearLayout as below setting. However, it does not work for second textview. Could you see my layout file and give me the way to solve it? I need to use ScrollView and LinearLayout, because I don't want to modify the java code.
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<LinearLayout android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
>
</LinearLayout>
<TextView
android:id="#+id/title_app"
android:layout_width="fill_parent"
android:layout_height="50dp"
android:text="Main title-Center-top"
android:layout_gravity="center"
android:gravity="center_horizontal"
android:textSize="20sp"
android:layout_marginTop="20dp"
/>
<TextView
android:id="#+id/display"
android:layout_width="fill_parent"
android:layout_height="50dp"
android:textSize="20sp"
android:gravity="center"
android:text="I want to center of screen"
/>
</LinearLayout>
</ScrollView>

You can do like this
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0"
android:orientation="horizontal">
<TextView
android:id="#+id/title_app"
android:layout_width="fill_parent"
android:layout_height="50dp"
android:text="Main title-Center-top"
android:layout_gravity="center"
android:gravity="center_horizontal"
android:textSize="20sp"
android:layout_marginTop="20dp"
/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center"
android:orientation="horizontal">
<TextView
android:id="#+id/display"
android:layout_width="fill_parent"
android:layout_height="50dp"
android:textSize="20sp"
android:gravity="center"
android:text="I want to center of screen"
/>
</LinearLayout>
</LinearLayout>
</ScrollView>

This is the full xml code that should do what you want, I just tested it and works:
<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">
<TextView
android:id="#+id/title_app"
android:layout_width="match_parent"
android:layout_height="50dp"
android:text="Main title-Center-top"
android:layout_gravity="center"
android:gravity="center_horizontal"
android:textSize="20sp"
android:layout_marginTop="20dp"
/>
<TextView
android:id="#+id/display"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:textSize="20sp"
android:gravity="center"
android:text="I want to center of screen"
/>
</LinearLayout>

Your code looks okay to me.
Just put android:fillViewport="true" on the ScrollView
Your problem seems like ScrollView is not stretching to its full height.

Android Layout with images and text

I am trying to make a layout with an image on the left side, then a text, and two images on the right side. I show you how it likes now:
I want to put the two right icons on the right side, next to the limit of the screen. Then, if you see, when the text has more than one line, the two icons disappear and when the text is too long the icons are very small. I want a static space for every one of the icons.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:padding="6dip">
<ImageView
android:id="#+id/icon"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_alignParentLeft="true"
android:layout_marginRight="6dip"
android:layout_centerVertical="true"
android:src="#drawable/ic_launcher"
android:focusable="false"
android:focusableInTouchMode="false"
android:contentDescription="#string/cdLogo" />
<LinearLayout
android:id="#+id/lista2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:orientation="vertical"
android:paddingRight="20dip"
android:layout_toRightOf="#id/icon"
android:layout_marginRight="30dip">
<TextView
android:id="#+id/tituloevento"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:gravity="left"
android:textStyle="bold" />
<TextView
android:id="#+id/distritoevento"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:gravity="left"
android:textSize="12sp"/>
<TextView
android:id="#+id/coorp0"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="gone" />
<TextView
android:id="#+id/coorp1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="gone" />
<TextView
android:id="#+id/esgratis"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="gone" />
</LinearLayout>
<LinearLayout
android:id="#+id/caracteristicas"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:orientation="vertical"
android:layout_toRightOf="#id/lista2"
android:layout_alignParentRight="true">
<ImageView
android:id="#+id/iconoMapa"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="#string/cdTieneCoor"
android:layout_weight="0.5"/>
<ImageView
android:id="#+id/iconoGratis"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="#string/cdGratisPago"
android:layout_weight="0.5"/>
</LinearLayout>
</RelativeLayout>

I suggest you to use a LinearLayout as the top container, and distribute the space of the child elements with weight attributes. When using weight, you must set layout_width to 0dp for horizontal layouts or layout_heigth to 0dp for vertical layouts.
For example:
<?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="horizontal" >
<ImageView
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="2" />
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="5" >
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="2" >
</LinearLayout>
</LinearLayout>

Android scrollview overlaps with key layout element

I'm encountering a problem where my scrollbar is overlapping with an element from my layout. I'd like for the scroll bar to appear after the edit box: . When adding the scroll bar to different parts of the xml file, I received error messages which I understand to mean that the scrollview had to be the root element. As a result, my code looks like this (when I feel like the scroll view should come after the first linear layout and/or edit box):
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/ScrollView01"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:fillViewport="true" >
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/db1_root"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<LinearLayout style="#style/TitleBar">
<ImageView style="#style/TitleBarLogo"
android:contentDescription="#string/description_logo"
android:src="#drawable/logo" />
<ImageView style="#style/TitleBarSeparator" />
<TextView style="#style/TitleBarText" />
<ImageButton style="#style/TitleBarAction"
android:contentDescription="#string/description_about"
android:src="#drawable/about"
android:onClick="onClickAbout" />
</LinearLayout>
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<EditText
android:layout_width="match_parent"
android:id="#+id/status"
android:layout_height="wrap_content">
<requestFocus></requestFocus>
</EditText>
<Button android:layout_width="wrap_content" android:text="Ok" android:textColor="#color/title_text" android:layout_gravity="center" android:background="#drawable/custom_button" android:layout_height="wrap_content"></Button>
<LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="vertical">
<TextView android:textAppearance="?android:attr/textAppearanceMedium" android:layout_width="wrap_content" android:text="" android:id="#+id/updates" android:textSize="14dp" android:layout_height="wrap_content"></TextView>
</LinearLayout>
<TextView android:text="" android:id="#+id/test" android:layout_width="wrap_content" android:layout_height="wrap_content"></TextView>
</LinearLayout>
</LinearLayout>
</ScrollView>

This may work for you: android:scrollbarStyle="outsideOverlay", set this inside the <ScrollView>

Give your LinearLayout or your ScrollView some padding.

I figured this out after chatting with the commonsguy (+1). I misunderstood the android error I received about scroll views and root elements. From my understanding, a scroll view can only have one child. My initial thought was that the scroll view needed to be surround the root element (oops). Here's the fix:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/db1_root"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<LinearLayout style="#style/TitleBar">
<ImageView style="#style/TitleBarLogo"
android:contentDescription="#string/description_logo"
android:src="#drawable/logo" />
<ImageView style="#style/TitleBarSeparator" />
<TextView style="#style/TitleBarText" />
<ImageButton style="#style/TitleBarAction"
android:contentDescription="#string/description_about"
android:src="#drawable/about"
android:onClick="onClickAbout" />
</LinearLayout>
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<EditText
android:layout_width="match_parent"
android:id="#+id/status"
android:layout_height="wrap_content">
<requestFocus></requestFocus>
</EditText>
<Button
android:layout_width="wrap_content"
android:text="Go"
android:textColor="#color/title_text"
android:layout_gravity="center"
android:id="#+id/communitysubmit"
android:background="#drawable/custom_button"
android:layout_height="wrap_content">
</Button>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/ScrollView01"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:fillViewport="true" >
<LinearLayout
android:layout_width="match_parent"
android:id="#+id/linearLayoutcommunity"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:textAppearance="?android:attr/textAppearanceMedium"
android:layout_width="wrap_content"
android:text=""
android:id="#+id/updates"
android:textSize="14dp"
android:layout_height="wrap_content">
</TextView>
</LinearLayout>
</ScrollView>
<TextView
android:text=""
android:id="#+id/test"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
</TextView>
</LinearLayout>
</LinearLayout>

Late but I've tried this solution.
Put a Linear layout inside scroll view and then give margin to Linear layout. After that add put your content inside linear layout. Hopefully this will solve issue.
<androidx.core.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scrollbars="vertical"
>
<androidx.appcompat.widget.LinearLayoutCompat
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_marginStart="#dimen/_10sdp"
android:layout_marginEnd="#dimen/_10sdp"
>
//your content here
</androidx.appcompat.widget.LinearLayoutCompat>
</androidx.core.widget.NestedScrollView>