Scroll to the bottom with opened keyboard and adjustPan - android

Is it possible to scroll to a button that aligned to the bottom of the layout when keyboard is overlaying the button when windowSoftInputMode="adjustPan"?
I don't want to use windowSoftInputMode="adjustResize" because I want the button to be under the keyboard, and I want to scroll to the button when keyboard is opened.
Example layout:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ScrollView
android:id="#+id/scrollView"
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:layout_alignParentTop="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<EditText
android:layout_width="match_parent"
android:layout_height="70dp"
android:hint="edit text" />
<EditText
android:layout_width="match_parent"
android:layout_height="70dp"
android:hint="edit text" />
</LinearLayout>
</ScrollView>
<Button
android:layout_width="match_parent"
android:layout_height="40dp"
android:layout_alignParentBottom="true"
android:text="button" />
</RelativeLayout>
I need to scroll to the button that is under the keyboard:

Try this add android.support.v4.widget.NestedScrollView instead of Relativelayout and make android:transcriptMode="alwaysScroll" always Scroll
<android.support.v4.widget.NestedScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
<ScrollView
android:id="#+id/scrollView"
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:layout_alignParentTop="true"
android:transcriptMode="alwaysScroll">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<EditText
android:layout_width="match_parent"
android:layout_height="70dp"
android:hint="edit text" />
<EditText
android:layout_width="match_parent"
android:layout_height="70dp"
android:hint="edit text" />
<Button
android:layout_width="match_parent"
android:layout_height="40dp"
android:layout_alignParentBottom="true"
android:text="button" />
</LinearLayout>
</ScrollView>
</android.support.v4.widget.NestedScrollView>

Related

Put Button at bottom of scrollview or bottom of screen

I have a problem with layout of my Application.
I'm trying to do a layout like Trello (screen of trello layout for example get from google)
But I have a problem with the Button at the Bottom of ScrollView:
Now my app is something like:
So How you can see, the button I always at the bottom of display.
I would like create a Header section, body section with Scrollview and recycler view and Footer with action button.
For now my xml app is:
<android.support.v7.widget.CardView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/card_view"
android:layout_width="320dp"
android:layout_height="wrap_content"
android:orientation="horizontal"
>
<RelativeLayout
android:id="#+id/relativeLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<RelativeLayout
android:id="#+id/header"
android:layout_width="match_parent"
android:layout_alignParentTop="true"
android:layout_height="wrap_content"
>
<TextView
android:id="#+id/header_title"
style="#style/card_header_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:orientation="vertical"
android:text="title"
/>
<TextView
android:id="#+id/header_subtitle"
style="#style/card_header_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_below="#+id/header_title"
android:text="subtitle" />
<ImageButton
android:id="#+id/context_menu"
android:layout_width="80dp"
android:layout_height="24dp"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_gravity="right"
android:background="#android:color/transparent"
android:clickable="true"
android:src="#drawable/ic_more_vert_black_16dp"
/>
</RelativeLayout>
<android.support.v4.widget.NestedScrollView
android:layout_below="#+id/header"
android:layout_above="#+id/button_action"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<android.support.v7.widget.RecyclerView
android:id="#+id/list"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/header"
/>
</android.support.v4.widget.NestedScrollView>
<Button
android:id="#+id/button_action"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:text="#string/button_action"
/>
</RelativeLayout>
</android.support.v7.widget.CardView>
The parent Layout that contain a "list of block" is
<HorizontalScrollView
android:id="#+id/horizontalScrollFather"
android:orientation="horizontal"
android:fillViewport="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<RelativeLayout
android:layout_width="wrap_content"
android:descendantFocusability="blocksDescendants"
android:orientation="horizontal"
android:layout_height="wrap_content">
<android.support.v7.widget.RecyclerView
android:id="#+id/list_blocks"
android:layout_width="wrap_content"
android:layout_height="match_parent"
/>
</RelativeLayout>
</HorizontalScrollView>
EDIT
I have tried to make a modify to my xml with:
<android.support.v4.widget.NestedScrollView
android:id="#+id/myNestedScrollView"
android:layout_below="#+id/header"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<android.support.v7.widget.RecyclerView
android:id="#+id/list"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
</android.support.v4.widget.NestedScrollView>
<Button
android:id="#+id/button_action"
android:layout_below="#+id/myNestedScrollView" <!-- as suggested -->
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/button_action"
/>
But the problem now is the scrollview with recycler hides the Button:
How Can I replicate the layout ?
Use this code
<android.support.v4.widget.NestedScrollView
android:id="#+id/myNestedScrollView"
android:layout_below="#+id/header"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<android.support.v7.widget.RecyclerView
android:id="#+id/list"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</android.support.v4.widget.NestedScrollView>
<Button
android:id="#+id/button_action"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/myNestedScrollView"
android:text="#string/button_action"/>
Changes
Don't do alignParentBottom on Button and don't put NestedScrollView above Button instead put Button below NestedScrollView
And there is no need to use android:layout_below="#id/header" in RecyclerView

How to set this XML Android layout so that the text scrolls but the buttons still show?

I have the following layout consisting of several text boxes which I want to scroll as one object. I then have a linear layout below that which contains navigation buttons - I want this to stick to the bottom of the screen and not scroll.
Right now the bottom linear layout is pushed off the screen - I suspect because of the setting of the height of the scroll view. However I can't see the trick to resolve this. How can I make it so that the buttons in the linear view are always visible and stick to the bottom of the screen (not the bottom of the scrollview)?
<?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"
android:paddingLeft="8dp"
android:paddingRight="8dp"
tools:context="com.QuestionView">
<android.support.v7.widget.Toolbar
android:id="#+id/my_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:elevation="4dp"
android:theme="#style/ThemeOverlay.AppCompat.ActionBar"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light" />
<ScrollView
android:id="#+id/ScrollView"
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:scrollbars="horizontal">
<LinearLayout
android:id="#+id/linearLayout1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_gravity="center_vertical|center_horizontal"
android:orientation="vertical">
<TextView
android:id="#+id/questionText"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:scrollbars="vertical"
android:text="TextView"
android:textSize="24dp" />
<TextView
android:id="#+id/answerA"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:scrollbars="vertical"
android:text="TextView"
android:textSize="24dp" />
<TextView
android:id="#+id/answerB"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:scrollbars="vertical"
android:text="TextView"
android:textSize="24dp" />
<TextView
android:id="#+id/answerC"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:scrollbars="vertical"
android:text="TextView"
android:textSize="24dp" />
<TextView
android:id="#+id/answerD"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:scrollbars="vertical"
android:text="TextView"
android:textSize="24dp" />
</LinearLayout>
</ScrollView>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<Button
android:id="#+id/back"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:backgroundTint="#ff9933"
android:text="Back" />
<Button
android:id="#+id/flip"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:backgroundTint="#1a75ff"
android:text="Flip" />
<Button
android:id="#+id/next"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:backgroundTint="#ff9933"
android:text="Next" />
</LinearLayout>
</LinearLayout>
Use a RelativeLayout for the outer layout. Define the Linear layout with buttons to be layout_alignParentBottom. Make the ScrollView layout_above the button layout and layout_below the toolbar (which should be alignParentTop). Then the buttons will be on the bottom, the toolbar on top, and the scroll view between them.
Best way to do this is to use android.support.design.widget.CoordinatorLayout to get Button Layout at bottom use android:layout_gravity="bottom" like below
Step 1:
Add compile 'com.android.support:design:26.1.0'
step 2:
<android.support.design.widget.CoordinatorLayout
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.QuestionView">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:id="#+id/questionText"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:scrollbars="vertical"
android:text="TextView"
android:textSize="24dp" />
<TextView
android:id="#+id/answerA"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:scrollbars="vertical"
android:text="TextView"
android:textSize="24dp" />
<TextView
android:id="#+id/answerB"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:scrollbars="vertical"
android:text="TextView"
android:textSize="24dp" />
<TextView
android:id="#+id/answerC"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:scrollbars="vertical"
android:text="TextView"
android:textSize="24dp" />
<TextView
android:id="#+id/answerD"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:scrollbars="vertical"
android:text="TextView"
android:textSize="24dp" />
</LinearLayout>
</ScrollView>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:orientation="horizontal">
<Button
android:id="#+id/back"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:backgroundTint="#ff9933"
android:text="Back" />
<Button
android:id="#+id/flip"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:backgroundTint="#1a75ff"
android:text="Flip" />
<Button
android:id="#+id/next"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:backgroundTint="#ff9933"
android:text="Next" />
</LinearLayout>
</android.support.design.widget.CoordinatorLayout>

Android: Views within scroll view are hidden by keyboard

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<VideoView
android:id="#+id/uploadedVideo"
android:layout_width="match_parent"
android:layout_height="224dp" />
<TextView
android:id="#+id/tvPath"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/uploadedVideo"
android:padding="5dp"
android:lines="1"
android:hint="choose video"/>
<EditText
android:id="#+id/etTitle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/tvPath"
android:hint="Your title here"/>
<EditText
android:id="#+id/etDescription"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/etTitle"
android:hint="Your description here"/>
<Button
android:id="#+id/btnUpload"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:text="upload"/>
</RelativeLayout>
</ScrollView>
</LinearLayout>
I created a layout as above. The problem here is, when I click the edit texts and the keyboard comes out, the scroll view is stretched only little so the edit texts are hidden by the keyboard. The button moves above the keyword, but again it's the two edit texts that are hidden by the keyboard.
Keeping Scrollview as parent is making both editText visible when the keyboard is up.
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<VideoView
android:id="#+id/uploadedVideo"
android:layout_width="match_parent"
android:layout_height="224dp" />
<TextView
android:id="#+id/tvPath"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/uploadedVideo"
android:padding="5dp"
android:lines="1"
android:hint="choose video"/>
<EditText
android:id="#+id/etTitle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/tvPath"
android:hint="Your title here"/>
<EditText
android:id="#+id/etDescription"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/etTitle"
android:hint="Your description here"/>
<Button
android:id="#+id/btnUpload"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:text="upload"/>
</LinearLayout>
</ScrollView>

Organizing layouts with edit text at bottom?

I wanted to make a layout with 3 LinearLayouts. In the 2nd LinearLayout I would have a ListView and the 3rd LinearLayout I would have an EditText and Button at the bottom. This was my attempt:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:fresco="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="#+id/view_post"
android:layout_width="fill_parent"
android:layout_height="200dp"
android:background="#color/com_facebook_blue">
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/view_status"/>
</LinearLayout>
<LinearLayout
android:id="#+id/view_comments"
android:layout_below="#+id/view_post"
android:layout_width="match_parent"
android:layout_height="250dp">
<ListView
android:id="#+id/lv_comments_feed"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
</ListView>
</LinearLayout>
<LinearLayout
android:layout_below="#+id/view_comments"
android:id="#+id/send_message"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_alignParentBottom="true"
android:orientation="horizontal" >
<EditText
android:id="#+id/write_comment"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical|center_horizontal"
android:layout_weight="5"
android:gravity="top|left"
android:inputType="textMultiLine"
android:scrollHorizontally="false" />
<Button
android:id="#+id/send_comment"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical|center_horizontal"
android:gravity="center"
android:text="send"
android:textAppearance="?android:attr/textAppearanceMedium" />
</LinearLayout>
</RelativeLayout>
Now the design looks great but when I load the app on my phone, I have 2 problems:
I don't want to hardcode the LinearLayout heights. I have looked into layout_weight but I can't seem to have these layout_weights work without running into the 2nd problem below:
When I click the EditText, the EditText is hidden even though I have declared android:windowSoftInputMode="adjustResize|stateHidden" in my activity and I'm not sure why that's happening. Also, the EditText and Button are not directly at the bottom of the screen which is what I would want. Any help is appreciated, thanks!
you don't need to add listview as child of linear layout. and avoid fill_parent & use match_parent. if first linear layout is only for textview then don't use it inside of linearlayout. or only use wrap_content instead of a specific layout_height
Here i made some changes hope it will work
<?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">
<LinearLayout
android:id="#+id/view_post"
android:layout_width="match_parent"
android:layout_height="200dp"
android:background="#222dc9">
<TextView
android:id="#+id/view_status"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
<ListView
android:id="#+id/listView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/send_message"
android:layout_below="#id/view_post"
></ListView>
<LinearLayout
android:id="#+id/send_message"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="5dp"
android:layout_alignParentBottom="true"
android:orientation="horizontal">
<EditText
android:id="#+id/write_comment"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical|center_horizontal"
android:layout_weight="5"
android:gravity="top|left"
android:inputType="textMultiLine"
android:scrollHorizontally="false" />
<Button
android:id="#+id/send_comment"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical|center_horizontal"
android:gravity="center"
android:text="send"
android:textAppearance="?android:attr/textAppearanceMedium" />
</LinearLayout>
</RelativeLayout>
and use in Manifest with activity name is
android:windowSoftInputMode="adjustPan"
<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=".MainActivity">
<RelativeLayout
android:id="#+id/view_post"
android:layout_width="match_parent"
android:background="#color/material_grey_300"
android:padding="5dp"
android:layout_height="wrap_content">
<TextView
android:id="#+id/view_status"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="hello" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/view_comments"
android:layout_above="#+id/send_message"
android:layout_below="#+id/view_post"
android:layout_width="match_parent"
android:background="#color/material_deep_teal_200"
android:padding="10dp"
android:layout_height="match_parent">
<ListView
android:id="#+id/lv_comments_feed"
android:layout_width="match_parent"
android:layout_height="wrap_content">
</ListView>
</RelativeLayout>
<LinearLayout
android:id="#+id/send_message"
android:background="#color/material_blue_grey_800"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_alignParentBottom="true">
<EditText
android:id="#+id/write_comment"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:inputType="textMultiLine"
android:scrollHorizontally="false" />
<Button
android:id="#+id/send_comment"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="3dp"
android:layout_weight="1"
android:text="send" />
</LinearLayout>
</RelativeLayout>

How to make a view not to scroll with soft input keyboard?

I have 2 layouts
Options layout: should scroll up with keyboard
Layout(linear2) shouldn’t scroll up with keyboard. (Keyboard should hide the particular layout , while scrolling it should be reachable)
'Options' layout working as expected. But the problem is with the layout(linear2) which also scrolls up with keyboard. How to fix it?
Attached the xml file below:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<ScrollView
android:id="#+id/scroll"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/options"
android:clipChildren="true"
android:fillViewport="true"
>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#ffffff" >
<LinearLayout
android:id="#+id/linear1
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:orientation="vertical"
>
<EditText
android:id="#+id/edittext1
android:layout_width="match_parent"
android:layout_height="wrap_content"
/>
<EditText
android:id="#+id/edittext2
android:layout_width="match_parent"
android:layout_height="wrap_content"
/>
</LinearLayout>
<!-- shouldnot scroll up with keyboard -->
<LinearLayout
android:id="#+id/linear2
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:orientation="vertical"
>
<TextView
android:id="#+id/txtview1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#+id/linear3"
android:paddingBottom="10dp"
android:visibility="gone" />
<LinearLayout
android:id="#+id/linear3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:visibility="gone" />
</LinearLayout>
</RelativeLayout>
</ScrollView>
<!-- scrolls up with soft input keyboard -->
<RelativeLayout
android:id="#+id/options"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:background="#f8f8f8"
>
<Button
android:id="#+id/save"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
/>
<Button
android:id="#+id/cancel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
/>
</RelativeLayout>
</RelativeLayout>

Categories

Resources