How to scroll my entire layout when the keyboard appears? - android

This is my layout:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/scroll_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="#dimen/defaut_padding" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="#dimen/defaut_padding"
android:orientation="vertical" >
<FrameLayout
android:id="#+id/photo"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<ImageView
android:id="#+id/picture"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:scaleType="fitXY" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right"
android:layout_margin="10dp"
android:background="#drawable/watermark" />
<ProgressBar
android:id="#+id/bitmap_loading"
style="?android:attr/progressBarStyleLarge"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:visibility="visible" />
</FrameLayout>
<FrameLayout
android:id="#+id/user"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/photo"
android:layout_marginLeft="15dp"
android:layout_marginTop="-30dp"
android:background="#android:color/white"
android:padding="#dimen/smallest_padding" >
<ImageView
android:id="#+id/user_picture"
android:layout_width="50dp"
android:layout_height="50dp"
android:src="#drawable/anonymous_user" />
</FrameLayout>
<TextView
android:id="#+id/user_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#id/user"
android:layout_marginLeft="#dimen/defaut_padding"
android:layout_toRightOf="#id/user"
android:text="#string/anonymous_user"
android:textStyle="bold" />
</RelativeLayout>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<EditText
android:id="#+id/input_description"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="top"
android:padding="5dp"
android:layout_marginBottom="#dimen/defaut_padding"
android:background="#drawable/textfield"
android:hint="#string/description_hint"
android:focusableInTouchMode="true"
android:maxLines="3"
android:scrollbars="vertical" />
<Button
android:id="#+id/publish"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/confirm_button_selector"
android:text="#string/confirm_button"
android:textColor="#android:color/white"
android:textSize="#dimen/big_text_size"
android:textStyle="bold" />
</FrameLayout>
</LinearLayout>
</ScrollView>
I want to scroll it when the soft keyboard appears when I start to digit at the EditText. How can I do this? Currenty the scroll works, but the keyboard appears above the button, and I want the button above the keyboard
I've tried to move the scrool when the user clicks in the EditText, doing something like this:
mSv.scrollTo(0, mSv.getBottom());
where mSv is my ScrollView
But it only works when the user clicks in the EditText at the second time.
Thank you for any help.

Try to change your Keyboard to pan instead of resize. You could do that in your AndroidManifest.xml file, for your particular Activity, add the below to it
android:windowSoftInputMode="adjustPan"
or
If you want to hide then:
EditText editTextSearch = (EditText) findViewById(R.id.editTextSearch);
InputMethodManager imm = (InputMethodManager) getSystemService(Context.INPUT_METHOD_SERVICE);
imm.hideSoftInputFromWindow(editTextSearch.getWindowToken(), 0);
If want to show:
EditText editTextSearch = (EditText) findViewById(R.id.editTextSearch);
editTextSearch.requestFocus();
getWindow().setSoftInputMode(WindowManager.LayoutParams.SOFT_INPUT_STATE_VISIBLE);

Check this SO answer. It should solve the problem "..that the button will appears over the entire layout, and what I want to do is make the entire layout (button and other views scroll)"

If you use a RelativeLayout (outside of ScrollView) being aligned to the bottom, it will stick to the bottom of the available screen—above the keyboard. ScrollView then needs a bottom margin to not overlay the button.
<?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" >
<ScrollView
android:layout_height="match_parent"
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_marginBottom="48dp" >
/* Here your elements ... like EditText */
</ScrollView>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_marginBottom="0px"
android:layout_alignParentBottom="true" >
<Button
android:layout_width="fill_parent"
android:layout_height="48dp"
android:text="ddd" />
</RelativeLayout>
</RelativeLayout>
This works only if you (as far as I could evaluate)
have a RelativeLayout as parent
have a ScrollView as the only child besides the RelativeLayout containing the button OR have another View (e.g. LinearLayout) containing a ScrollView somewhere (for whatever reason)
If you don't want the button to always stick to the bottom, you need to detect if the keyboard is shown or not as explained in Pragnani's link.

Related

How to make a ScrollView in android scrollable?

I have the following layout, probably with many many errors:
<FrameLayout
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:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#cccccc"
android:layout_marginBottom = "0dp">
<ScrollView android:id="#+id/ScrollView2"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<GridLayout
android:id="#+id/grid"
android:layout_margin="30dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_above="#+id/new_cancel"
android:alignmentMode="alignBounds"
android:columnCount="10"
android:columnOrderPreserved="false"
android:useDefaultMargins="true">
<TextView
// TextViews and EditText etc...
// ...
</GridLayout>
</ScrollView>
<Button
android:id="#+id/new_cancel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentStart="true"
android:background="#color/colorPrimaryDark"
android:text="Cancel"
android:layout_margin="5dp"
/>
<Button
android:id="#+id/new_ok"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentEnd="true"
android:background="#color/colorPrimaryLight"
android:text="Ok"
android:layout_margin="5dp"
/>
</RelativeLayout>
</FrameLayout>
The main part (GridLayout) contains several input fields to input text, numbers etc. But when I click on such an input field the touch-keypad opens and overlaps part of my input fields! Although this ViewGroup is placed inside a ScrollView, I am not able to scroll it!
How to change the layout so I can scroll the stuff inside the GridLayout...?
In AndroidManifest write
<activity
android:name="<yourpackage>.MainActivity"
...
android:windowSoftInputMode="adjustResize" />
This will resize your activity when keyboard opens
Remove scrollViewand add this to the onCreate of your activity
getWindow().setSoftInputMode(WindowManager.LayoutParams.SOFT_INPUT_ADJUST_RESIZE);
This will resize the activity's on keyboard open

How to make a "subLayout" fixed in Android

I'm creating an app that gets some values, you click in a button and it returns some other values and this views are distributed in 2 subLayouts of a bigger vertical LinearLayout like this:
<?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"
android:padding="10dp">
<RelativeLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center_horizontal"
android:layout_weight="0.4">
<EditText
android:layout_width="70dp"
android:layout_height="wrap_content"
android:inputType="number"
android:id="#+id/number1" />
<EditText
android:layout_width="70dp"
android:layout_height="wrap_content"
android:inputType="number"
android:id="#+id/number2"
android:layout_below="#+id/number1" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Calc!"
android:id="#+id/calcButton"
android:layout_below="#+id/number2"/>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center_horizontal"
android:layout_weight="0.6"
android:layout_alignParentBottom="true">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Answer"
android:id="#+id/Answer" />
</RelativeLayout>
</LinearLayout>
My problem is that when I click on my EditText and the keyboard appears the answer's TextView goes up with the keyboard and "overrides" my button (the entire RelativeLayout follows the keyboard), there's a way of setting the RelativeLayout fixed so that it stays where it is mean to be?
Here what is happening:
There's a way of fixing that RelativeLayout?
Try setting android:windowSoftInputMode="adjustPan" for the activity in Android Manifest file.

Scrollview does not scroll when keyboard appears

I have a few EditTexts in my RelativeLayout, and a button aligned at the bottom of it. When the keyboard pops up, I want my layout to resize (therefore, I'm using android:windowSoftInputMode="adjustResize") and also want it to be scrollable, because in smaller screens resizing it isn't enough.
The problem is I can't get it to scroll at all!
I do need the Button to stay at the bottom of the screen.
<?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:background="#FFF">
<!-- some hidden RelativeLayouts, filling the whole screen -->
<RelativeLayout
android:id="#+id/form_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ScrollView
android:layout_width="match_parent" android:layout_height="match_parent"
android:fillViewport="true" android:layout_above="#+id/ok_btn">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent" android:background="#99000000" android:visibility="visible">
<View
android:id="#+id/shade"
android:layout_width="wrap_content"
android:layout_height="wrap_content" android:layout_alignTop="#+id/logradouro1"
android:background="#FFF" android:layout_marginTop="-30dp"/>
<!-- some visible EditTexts and TextViews here -->
</RelativeLayout>
</ScrollView>
<Button android:id="#+id/ok_btn"
android:layout_width="match_parent"
android:layout_height="50dp" android:background="#color/verdeBotao" android:text="Cadastrar"
android:textColor="#FFF" android:layout_alignParentBottom="true"/>
</RelativeLayout>
</RelativeLayout>
Below are 2 screenshots to illustrate what is happening. Please notice that I can't scroll when the keyboard is up.
Thanks!
i am posting something similar to your ui. take a RelativeLayout for the button at the bottom. set gravity to bottom and your button view should android:layout_alignParentBottom="true"
<ScrollView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_above="#+id/m_table_menu" >
<LinearLayout
android:id="#+id/layuserdetails"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:orientation="horizontal"
android:padding="5dp" >
Yourviewss......i guess edittexts
</LinearLayout>
</ScrollView>
//scrollable Button layout
<RelativeLayout
android:id="#+id/m_table_menu"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="bottom"
android:padding="0dp" >
<LinearLayout
android:id="#+id/laysharepost"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:gravity="bottom"
android:orientation="vertical"
android:padding="5dp" >
//replace textview with buttonview..
<TextView
android:id="#+id/share_tvcommentdone"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:background="#drawable/button_selector"
android:padding="10dp"
android:text="POST"
android:textColor="#android:color/white" />
</LinearLayout>
</RelativeLayout>

Adapting component when virtual keyboard appears

I'm designing a simple login activity. I've used the following xml layout:
<?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="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:orientation="vertical"
android:layout_gravity="center_vertical|center_horizontal"
android:gravity="center_vertical|center_horizontal"
android:layout_margin="15dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="My application title"
android:textSize="30sp"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="2"
android:orientation="vertical"
android:layout_gravity="center_vertical|center_horizontal"
android:gravity="center_vertical"
android:layout_margin="15dp">
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Username"/>
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Password"
android:layout_marginTop="15dp"/>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="15dp"
android:text="Login"/>
</LinearLayout>
</LinearLayout>
And I've obtained this result:
But If the focus is on the first EditText I obtain this:
and If the focus is on the second EdiText the result is the follwoing:
Considering I've used the following line in the Manifest, for my activity:
android:windowSoftInputMode="adjustPan|adjustResize"
I want that when the virtual keyboard appears, the two edittext, the button and the textview are visible and correctly centered in the available screen.
What I have to change in my code?
NOTE: I've the same result If I remove the line in the manifest:
android:windowSoftInputMode="adjustPan|adjustResize"
You can replace the parent LinearLayout to a ScrollView :
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<LinearLayout ...>
....
....
</LinearLayout>
</ScrollView>
try this, it works for some of my apk !
Edit : sorry didn't see about center the text automaticaly, so with this you can adjust manually your editext to center with swipe your finger.. hope that will help

Scroll vertically through the whole view when the soft keyboard is shown

I'm working on a screen that has a LinearLayout with a TableLayout inside, in order to show texts, some EditTexts and some buttons.
The problem is that on the smartphone, when I click on a EditText that is on the top of the layout, a button that is on the bottom hides behind the soft keyboard. The only way to make the button appear again is to hide the soft keyboard.
Is it possible to make my layout on top of the soft keyboard to scroll to the button of my view, so the user can see the soft keyboard and the bottom on the button?
I tried to use a ScrollView around the TableLayout, but it does not scroll to the button of my layout, so the user can not see to bottom.
This is my layout:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal">
<ScrollView
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<LinearLayout
android:id="#+id/linearLayoutMain"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:orientation="vertical" >
<include layout="#layout/login_container"/>
<LinearLayout
android:orientation="horizontal"
android:background="#drawable/_grey_rounded_bottom"
android:layout_width="match_parent"
android:layout_height="30dp"/>
</LinearLayout>
</ScrollView>
</LinearLayout>
Thanks in advance.
I have a similar view and it runs for me. See my code:
<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="wrap_content"
tools:context=".MainActivity"
android:orientation="vertical" >
<LinearLayout ... /> <!--Have an image that I want to stay on the top -->
<ScrollView
android:layout_width="fill_parent"
android:layout_height="wrap_content" ... >
<RelativeLayout ... >
<!-- EditText of username and EditText of password and a CheckBox -->
<LinearLayout
android:id="#+id/linearLayoutEntrar"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/checkBoxRecordarDatos"
android:gravity="center"
android:layout_marginTop="7dp"
android:weightSum="1.0">
<Button
android:id="#+id/buttonEntrar"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.5"
android:text="#string/login_entrar"
android:textColor="#android:color/white"
android:textStyle="bold"
android:textSize="#dimen/textSize"
android:onClick="entrar" />
</LinearLayout>
<LinearLayout
android:id="#+id/linearLayoutJugar"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/linearLayoutEntrar"
android:layout_marginTop="7dp"
android:gravity="center"
android:weightSum="1.0" >
<Button
android:id="#+id/buttonJugar"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.5"
android:onClick="jugar"
android:text="#string/login_jugar"
android:textColor="#android:color/white"
android:textSize="#dimen/textSize"
android:textStyle="bold" />
</LinearLayout>
</RelativeLayout>
</ScrollView>
</LinearLayout>
Try changing height as I put on each layout. And if not success, I think the problem is TableLayout, try not using it as I do.
Adding android:windowSoftInputMode="stateVisible|adjustPan" to your activity tag in manifest should do the work.
try android:windowSoftInputMode="adjustResize"
if the scrollView has sibling view element, try this on ScrollView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"

Categories

Resources