Hidden EditText when soft keyboard appears - android

I have this typical issue when soft keyboard appears for user to enter input and covers the EditText where text should appear.
I tried many different "fixes" and solution without success. I guess there is certain combination in my layout that causes this issue.
Right now in AndroidManifest.xml I have this line
<activity
android:screenOrientation="landscape"
android:windowSoftInputMode="adjustPan">
The layout with the EditText is as follows witht he EditText at bottom
<?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"
android:fillViewport="true"
android:scrollbars = "vertical"
android:windowSoftInputMode="adjustPan|adjustResize">
<LinearLayout
android:layout_width="fill_parent" android:layout_height="fill_parent"
android:orientation="vertical" >
<RelativeLayout
android:id="#+id/cargoRoot"
android:layout_width="fill_parent" android:layout_height="wrap_content"
android:numColumns="auto_fit"
android:stretchMode="columnWidth" >
<LinearLayout
android:layout_height="wrap_content" android:layout_width="600dp"
android:orientation="vertical" >
<TextView style="#style/smalltext" />
<TextView
android:id="#+id/arrivalEta"
android:layout_height="wrap_content" android:layout_width="wrap_content" />
<TextView
android:text="#string/cargoComments"
style="#style/smalltext" />
<ScrollView android:id="#+id/scrollEditCargoComments"
android:layout_width="fill_parent" android:layout_height="142dp"
android:scrollbars="vertical">
<EditText
android:id="#+id/editCargoComments"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:textSize="#dimen/text_normal"
android:minLines="5"
android:imeOptions="actionDone"
android:imeActionLabel="#string/send"
android:inputType="textNoSuggestions" />
</ScrollView>
</LinearLayout>
</RelativeLayout>
</LinearLayout>
Other things worth commenting is that I have this EditText with visibility gone until certain points in the app where the user is prompted to enter comments. Then I change visibility to visible and when user taps on the text the soft keyboard appears.
It appears hiding everything behind it. No Resize or Pan operation is done.
The view that holds the EditText is infalted code-behind and inserted inside another view inside a PopupWindow.
So is like MainActivity > PopupWindow > ViewFlipper > EditText
I wonder if either PopupWindow or ViewFlipper add some poison to soft keyboard management.
Thanks in advance

Try this:
android:windowSoftInputMode="adjustResize|adjustPan|stateHidden"

Related

Push only the bottom part up when Soft keyboard appears

The only thing I am trying do that there will be an editText at the top and after that there will be an ImageView.
Now at the bottom line there will be some buttons (ex. emojis) and this bottom part will only be pushed up by the soft keyboard whenever it will appear.
I am making it more clear by attaching this layout of Facebook.
required output
I have gone through all these SO questions and also tried their answers but no luck. May be I am doing something wrong.
Android: Resize only parts of view with soft keyboard on screen
Android: How do I prevent the soft keyboard from pushing my view up?
android : How to prevent resizing the window when displaying the virtual keyboard
My XML code
<ScrollView
android:id="#+id/scrollOnPost"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:isScrollContainer="false"
android:fillViewport="true"
android:layout_below="#+id/header_layout">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:weightSum="4"
android:layout_gravity="bottom"
android:gravity="bottom">
<EditText
android:id="#+id/ed_post"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
<ImageView
android:id="#+id/img_posted_list_row"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="2.7"
android:adjustViewBounds="true"
android:src="#mipmap/ic_launcher"
android:scaleType="fitCenter"
android:background="#color/red"/>
</LinearLayout>
</ScrollView>
<ImageButton
android:id="#+id/imgBtn_Emoji"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_alignParentBottom="true"
android:src="#drawable/smile_face"
android:background="#drawable/button_pressed_white"
/>
All I getting that my soft keyboard always pushing the whole layout up not just the emoji at the bottom. Thanks.
Dude it worked
manifest :
<activity android:name=".TestActivity"
android:windowSoftInputMode="adjustResize"/>
xml :
<?xml version="1.0" encoding="utf-8"?>
<ScrollView android:id="#+id/scrollOnPost"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:isScrollContainer="false"
android:fillViewport="true"
android:layout_below="#+id/header_layout"
xmlns:android="http://schemas.android.com/apk/res/android">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:weightSum="4"
android:layout_gravity="bottom"
android:gravity="bottom">
<EditText
android:id="#+id/ed_post"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
<ImageView
android:id="#+id/img_posted_list_row"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="2.7"
android:adjustViewBounds="true"
android:scaleType="fitCenter"
android:background="#color/colorPrimary"/>
<ImageButton
android:id="#+id/imgBtn_Emoji"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_alignParentBottom="true"
android:src="#mipmap/call"
/>
</LinearLayout>
I guess you want only the editText to push up when keyboard is visible(Correct me if i am wrong) for that i have got an idea i don't know if it will work or not you can try it out if you find it logical
Idea is to first check if keyboard is visible or not and secondly if visible get its height and programatically give your layout a marginBottom which will be equal to the height of keyboard(using layoutParams).
check this links for implementing above idea :
How to capture the "virtual keyboard show/hide" event in Android?
Is there any way in android to get the height of virtual keyboard of device
How to set RelativeLayout layout params in code not in xml

Remove space between soft kayboard and button

I'm using scrollview to scroll my view up when soft keyboard open. But it's make more than required space between button and keyboard.
Can we remove this large space.
Here is my xml code block.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/widget32"
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="wrap_content">
<EditText
android:id="#+id/searchText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#+id/searchBtn"
android:layout_centerVertical="true"
android:layout_marginLeft="30dp"
android:layout_marginRight="30dp"
android:layout_marginBottom="20dp"
android:hint="#string/search_hint"
android:inputType="number"
android:maxLength="10" />
<Button
android:id="#+id/searchBtn"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:layout_marginLeft="30dp"
android:layout_marginRight="30dp"
android:background="#339933"
android:padding="20dp"
android:text="#string/search_button_text"
android:textColor="#FFFFFF"
android:textSize="20sp"
android:textStyle="bold" />
</RelativeLayout>
</ScrollView>
</RelativeLayout>
To align the click button with the software keyboard, it should be at the layouts bottom.
You should have the click button within the root layout, which should have the click button aligned to bottom, either with linearlayouts gravity or relativelayouts layout_alignParentBottom
So basically you define the layout as follows:
<RelativeLayout>
<Button
android:layout_alignParentBottom="true">
</Button>
</RelativeLayout>
And ta-da! the button is right on top of the software keyboard!
The real problem..
As it turns out in the comments the real problem here is to align the button to the keyboard only when it is visible, which can simply be achieved by having two invidual buttons that visibilitys are toggled based on the keyboard state
So first we define a layout that has two buttons, one for the software keyboard state and one for the "regular" state
<RelativeLayout>
<ScrollView>
<LinearLayout>
<!-- ...... -->
<Button
android:id="#+id/regular_button">
</Button>
</LinearLayout>
</ScrollView>
<Button
android:id="#+id/keyboard_aligned_button"
android:layout_alignParentBottom="true">
</Button>
</RelativeLayout>
and now we just hook the keyboard state to the visibility of the buttons, so we need in some way to keep track of the keyboard state, which is explained in many places
and when the keyboard is set to be visible we setVisibility of the regular button to be GONE, and keyboard aligned button to VISIBLE.
After a keyboard is gone visibilities are inversed

Blank space at bottom of ListView not filled

EDIT
I originally thought this issue was related to the search widget and keyboard.
Original Question
I added the search widget to my app recently. Now when I land on MainActivity, the view is cut right where the keyboard would pop up. The content scrolls within that smaller box. When I hit the search widget in the action bar, the keyboard pops up and fills the blank space. When I collapse the keyboard, my view is complete and there is no blank space. Check this photo to see what I mean.
Here are my layouts
activity_main.xml
<?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" >
<ListView
android:id="#+id/list"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:divider="#null" />
</LinearLayout>
feed_item.xml (inflates listview)
<?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:background="#color/feed_bg"
android:orientation="vertical" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginLeft="#dimen/feed_item_margin"
android:layout_marginRight="#dimen/feed_item_margin"
android:layout_marginTop="#dimen/feed_item_margin"
android:background="#drawable/bg_parent_rounded_corner"
android:orientation="vertical"
android:paddingBottom="#dimen/feed_item_padding_top_bottom"
android:paddingTop="#dimen/feed_item_padding_top_bottom" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:paddingLeft="#dimen/feed_item_padding_left_right"
android:paddingRight="#dimen/feed_item_padding_left_right" >
<com.android.volley.toolbox.NetworkImageView
android:id="#+id/vendorPic"
android:layout_width="#dimen/feed_item_vendor_pic_width"
android:layout_height="#dimen/feed_item_vendor_pic_height"
android:scaleType="fitCenter" >
</com.android.volley.toolbox.NetworkImageView>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:paddingLeft="#dimen/feed_item_profile_info_padd" >
<TextView
android:id="#+id/timestamp"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:textColor="#color/timestamp"
android:textSize="#dimen/feed_item_timestamp" />
</LinearLayout>
</LinearLayout>
<TextView
android:id="#+id/txtHeadlineMsg"
android:layout_width="fill_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" />
<com.example.myapp.FeedImageView
android:id="#+id/feedImage1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/white"
android:scaleType="fitXY"
android:visibility="visible" />
</LinearLayout>
</LinearLayout>
Here's my searchable config xml.
<?xml version="1.0" encoding="utf-8"?>
<searchable xmlns:android="http://schemas.android.com/apk/res/android"
android:label="#string/app_name"
android:hint="#string/search_hint" >
</searchable>
Let me know if you need more to go on, thanks!!
P.S. min sdk is 12.
UPDATE
The problem ended up being that the content didn't really fill the whole screen until the images were loaded from the Volley request. The text content was loaded and set the height of the listview, and subsequently loaded content did not dynamically change the listiview height. In production this won't be a problem probably, but is there a way to make sure that the ListView height can change dynamically?
It sounds like the keyboard is trying to expand when you open the activity. It is strange that it stays blank and doesn't show the actual keyboard, but maybe preventing the keyboard from opening in the beginning will help. Try setting
android:windowSoftInputMode="stateHidden"
in your <activity> tag for this Activity in AndroidManfest.xml.
try this in the manifest.
android:windowSoftInputMode="adjustResize"
and to your list view("id"),try adding
android:alignParentBottom:"true"
This ended up having nothing to do with the search widget or keyboard. the sizing was coincidental.
The problem lies in the fact that each item in the ListView had an image that was being loaded from the API via volley. the height of the ListView was being set by the content that was loaded first (i.e. text). Once the image loaded, it expanded each item in the list, but did not change the height of the parent ListView. This left the ugly gap at the bottom of the view.
On advice from #mattgmg1990, I changed the height of the ListView to match_parent in order to allow for late loading images.

space between editText and softkeyboard

i have an activity with an editText field almost at the bottom.
when i focus on that editText field the keyboard shows up and pushes my edittext field up.
when it stops there is no space between editText and my softkeyboard.
is it possible to add some margin?
this is my code:
<?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="wrap_content"
android:background="#color/bg_yellow"
android:orientation="vertical"
>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_gravity="bottom"
android:layout_alignParentBottom="true"
android:paddingTop="25dp"
>
<RelativeLayout
android:layout_width="340dp"
android:layout_height="100dp"
android:layout_centerHorizontal="true"
>
<EditText
android:layout_width="340dp"
android:layout_height="45dp"
android:background="#drawable/edit_text_field"
android:inputType="text"
/>
</RelativeLayout>
</RelativeLayout>
position of editText field before keyboard shows up:
http://postimg.org/image/826fwy18z/
and an image when keyboard is show up, with no space between cursor and keyboard:
http://postimg.org/image/97qlfb4zx/
You can use android:windowSoftInputMode property of Activity in manifest file.
Use android:windowSoftInputMode="adjustResize" in your case. You can check other properties as well.
Hope this helps.
Thanks.
Add margin to the bottom of the edit text field
android:layout_marginBottom="10dp"

Android layout design: image above form above button. When the keyboard appears my layout is screwed

In my application I want to have a layout like this:
I did it with a Relative Layout holding an ImageView, TableLayout and a Button. The problem is that when I open the keyboard to modify a EditText the keyboard is on top of the EditText, so the user can't see what he is writing. I want the layout to be like this when the keyboard is shown:
The user should be able to scroll up the view to see the whole image while the keyboard is shown, even if he doesn't see the EditText then, because he wants to copy some data of the image into the EditTexts. I tried to do it like this:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:baselineAligned="false"
android:orientation="vertical" >
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#+id/buttonEditStop"
android:padding="10dip" >
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<ImageView
android:id="#+id/stopImg"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:clickable="true"
android:contentDescription="#string/entry_img"
android:onClick="ImageClick" />
<TableLayout
android:id="#+id/formLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/stopImg"
android:layout_marginRight="10dp" >
...
</TableLayout>
</RelativeLayout>
</ScrollView>
<ImageButton
android:id="#+id/buttonEditStop"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:contentDescription="#string/edit_stop"
android:onClick="EditButtonClicked"
android:src="#drawable/ic_menu_edit" />
Using this code my whole layout is screwed. I see the form on top of the image, followed by a ImageButton with the image that should be seen in the imageView.
Anyone knows how I can get a layout like the one I want?
Thanks!
To avoid the EditText to be overlapped I had to use
android:windowSoftInputMode="adjustPan"
in my manifest.

Categories

Resources