Android soft keyboard hides controls - android

I know there are lots of questions about this but none of the answers are working for me. Here's a screen in question before opening the keyboard.
Here's the screen after opening the keyboard by tapping on an EditText, and then scrolling as far down as possible.
Note that besides the final edit control being mostly concealed, all the text and the button after it are inaccessible.
Here's the fragment layout:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:validator="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<RelativeLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="#dimen/activity_vertical_margin"
android:paddingBottom="#dimen/activity_vertical_margin"
tools:context=".MainActivity$PlaceholderFragment"
android:background="#color/background">
<TextView android:id="#+id/header"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textColor="#color/primary"
android:text="#string/help_header"
android:textSize="20sp"
android:layout_marginLeft="#dimen/activity_horizontal_margin"
android:layout_marginRight="#dimen/activity_horizontal_margin"
/>
<TextView android:id="#+id/drop"
android:layout_below="#id/header"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/help_sub_header"
android:textSize="16sp"
android:textColor="#color/material_drawer_secondary_text"
android:layout_marginLeft="#dimen/activity_horizontal_margin"
android:layout_marginRight="#dimen/activity_horizontal_margin"
android:layout_marginBottom="#dimen/activity_vertical_margin"
/>
<View android:id="#+id/divider1"
android:layout_below="#id/drop"
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#color/light_gray_background"
android:layout_marginBottom="#dimen/activity_vertical_margin"/>
<LinearLayout android:id="#+id/linear1"
android:layout_below="#id/divider1"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin">
<!-- Several EditTexts and such -->
</LinearLayout>
</RelativeLayout>
</ScrollView>
It was originally in a LinearLayout and I changed it to a RelativeLayout based on a suggestion, but that didn't change anything. I have also played with the layout height (wrap_content / match_parent) of the top two levels of view groups to no effect. Here is the activity declaration in the manifest:
<activity
android:name=".MainActivity"
android:label="#string/application_name"
android:windowSoftInputMode="adjustResize" >
<intent-filter>
<action android:name="android.intent.action.MAIN"/>
<category android:name="android.intent.category.LAUNCHER"/>
</intent-filter>
</activity>
I've also tried adjustPan and it doesn't seem to change. I'm not too concerned about what exactly the UI elements do when the keyboard opens, I just want the whole layout to be accessible by scrolling.
Basically everyone points to the soft input mode, but that doesn't seem to be doing anything. Is there something about fragments that I'm missing? Or maybe this is harder than I'm expecting and I need to make a custom layout class and measure the layout and nasty stuff like that? I can add the activity layout though there's not much to it, or code such as the fragment creation/transaction stuff.

THat's what the keyboard does. It covers the bottom of the screen. If you want it to not cover your app at all, you can use adjustResize. That will scale your app to only draw in the top half. But if your content is too big it still won't fit and it will look as if your app is covered (even though it isn't. Scrolling it via a scroll view should work then (although I've never actually tried it). But the only thing you can do to control the behavior when the keyboard is up is the softInputMode.
If you have lots of adjustable space or whitespace, there are techniques that will shrink you somewhat and may allow your full app to appear in the reduced space. This isn't the case here, you have too much stuff on screen (except for maybe on a tablet in portrait mode). So they aren't going to apply here.

It turns out the problem was with a library, material-drawer (nice library). For anyone else encountering this:
https://github.com/mikepenz/MaterialDrawer/blob/master/README.md#i-have-problems-with-the-softkeyboard-how-can-i-fix-this
Call Drawer.keyboardSupportEnabled(this,true) and the layout will arrange and scroll appropriately.

Related

android questions about poping the soft keyboard

i want the whole layout move up to show while popping the soft keyboard, but the button on the bottom of the view cannot be seen.
the AndroidManifest.xml:
<activity
android:name="cn.duckr.android.plan.PlanConfirmPaymentActivity"
android:windowSoftInputMode="adjustPan"
style="#style/base_activity_style"
android:theme="#style/confirm_payment_anim_theme" />
To ensure that the system resizes your layout to the available space—which ensures that all of your layout content is accessible (even though it probably requires scrolling)—use "adjustResize".
link
android:windowSoftInputMode="adjustResize"
You can put whole layout except the particular button in a ScrollView to achieve this.
like 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">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/scrollView5"
android:fillViewport="true">
//put your contents here..
</ScrollView>
<ImageButton
android:id="#+id/ibSample"
android:layout_width="50dp"
android:layout_height="50dp"
android:adjustViewBounds="true"/>
</RelativeLayout>

Android Full Screen resize when soft input is shown

I am developing an Android app in full screen mode. I want the screen automatically adjusted when a soft input is shown. I am using ScrollView to make my screen can extend larger than the maximum height. You can see the layout XML below:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/RelativeLayout1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context="${packageName}.${activityClass}" >
<VideoView
android:id="#+id/taskdetail_bgvideo"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true" />
<ScrollView
android:id="#+id/taskdetail_scroll"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<!-- Other Widgets -->
</LinearLayout>
</ScrollView>
</RelativeLayout>
The VideoView in the background is placed as intended to create a background video in the overall layout.
I tried the workaround in Android How to adjust layout in Full Screen Mode when softkeyboard is visible but somehow in my case, it doesn't work as expected. When I choose the bottommost TextView, all screen somehow pushed upwards to the top, leaving a very big black area between soft keyboard and the activity screen. Check the screenshot below (Sorry, still low reputation, so cannot post the image directly :( )
Giant blackhole
So do you have any possible idea to tackle this weird behavior? In addition, I also have tried setting the softInputMode to ADJUST_RESIZE or ADJUST_PAN, and both settings did that. When I set it to ADJUST_NOTHING, nothing really adjusted at all.
When I don't use the workaround I mentioned above, I cannot scroll the view to the bottommost widget, but somehow the window view is panned to the focused TextView. I believe that this is actually the major culprit, but I don't know how to fix it.
Thanks in advance :)
If you have the property <item name="windowFullscreen">true</item> in your theme then the android:windowSoftInputMode="adjustResize" doesn't work.
Try change
<ScrollView
android:id="#+id/taskdetail_scroll"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
to
<ScrollView
android:id="#+id/taskdetail_scroll"
android:layout_width="match_parent"
android:layout_height="match_parent" >
you have to write
android:windowSoftInputMode="stateHidden|adjustPan"
in your manifest file
Try to add below properties to your <activity tag declaration in AndroidManifest.xml
android:windowSoftInputMode="stateHidden|adjustPan"

Resizable Scrolling layout with softKeyboard

I'm creating an Android application which requires a (1) static 40px tall Container (linear layout at the moment), (2) a scrollable-dynamically loaded content layout (ScrollView wrapped LinearLayout at the moment), (3) and an entry/answer field.
The Idea is (2) the scrollable-dynamically loaded content should be resized so that no matter what the (1) answer field and (3) container are visible. Also, I need every bit of content-within the dynamically loaded portion-able to be viewed.
The problem is that when the soft keyboard is shown I am getting a pan upward which hides the 40px container as well as a portion of my scrollable region (I can scroll all the way up and indeed the top few lines of my scrollable portion cannot be reached).
The activities entry in manifest:
<activity
android:name="com.xxxxx.xxxxx.xxxxxx.paid.activities.GamePlayActivity"
android:windowSoftInputMode="stateAlwaysVisible|adjustResize"
android:label="#string/app_name" >
</activity>
The layout:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/game_play_main_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="#color/activity_home_screen">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="40sp"
android:background="#FF000000"/>
<ScrollView
android:layout_width="match_parent"
android:layout_height="0dip"
android:layout_weight="1"
android:fillViewport="true"
android:scrollbars="none">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/game_play_table"/>
</ScrollView>
<EditText
android:id="#+id/game_play_answer"
android:layout_width="match_parent"
android:layout_height="40sp"
android:layout_margin="3sp"
android:inputType="textAutoComplete"/>
</LinearLayout>
Any ideas would be greatly appreciated-I've been searching and trying different implementations found on stackoverflow however I have not met my requirement yet.

Android: Webview does not resize on rotation (ICS)

I have a simple WebView in my layout, with the following setup
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/rootView"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#drawable/baserepeat"
android:gravity="top|center_horizontal"
android:orientation="vertical"
android:paddingBottom="20dp"
android:paddingLeft="20dp"
android:paddingRight="20dp" >
<WebView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/productDetailContentWebview"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="top"
android:background="#drawable/baserepeat" />
//other items...
Inside my manifest I have the containing activity set to
<activity
android:name=".Products.ProductDetailActivity"
android:configChanges="keyboardHidden|orientation|screenSize"
android:screenOrientation="sensor"
android:theme="#style/Theme.CPS" >
</activity>
My Webview is populated with a simple HTML file on the device, which works nicely. The problem is that when I rotate the device from portrait to landscale, the webview becomes a good deal taller, pushing whatever was below it further down in my layout. The amount of content doesn't change - it is all set in OnCreate().
I'm using the Webview to render the content with it's own special stylesheet, and it must stay within the ScrollView.
I can provide more information if required :)
I had the similar issue when working on 2.3/4.0...
I tried several things but the solution which helped me in getting rid of the core issue was:
removing screenSize from android:configChanges in AndroidManifest.xml
Hope it helps !!!
Try including your webview inside a FrameLayout.
<LinearLayout>
<FrameLayout>
<WebView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/productDetailContentWebview"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="top"
android:background="#drawable/baserepeat" />
</FrameLayout>

Android Design Layout

I like the Android market apps design, very bright and catchy layout. How it has been done? i tried to put such green semi-circle bar on top with transparency on circle, but my listview is not going behind, where in market apps listview scrolls behind the green bar.
Many thanks in advance.
Rgds
Balaji
I don't know exactly you want this or not but it may help you.
xml layout
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<ListView
android:id="#+id/list"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
<android.support.v7.widget.Toolbar
android:id="#+id/my_awesome_toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/transparent">
</android.support.v7.widget.Toolbar>
in Manifest file
<activity
android:name=".MainActivity"
android:label="#string/app_name"
android:theme="#style/Theme.AppCompat.NoActionBar" >
Color.xml
<color name="transparent">#64000000</color>
As a way I can suggest something like this:
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<View
android:id="#+id/top_place_holder"
android:layout_width="fill_parent"
android:layout_height="100dip"
/>
<ListView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_below="#id/top_place_holder"
/>
<View
android:id="#+id/your_top_panel"
android:layout_width="fill_parent"
android:layout_height="130dip"
androis:background="#drawable/your_transparent_semi_circle_here"
/>
So it goes like this:
#id/top_place_holder is used to take some space and push the ListView down a bit, so it won't take the whole screen.
#id/your_top_panel is a top panel (the one that will hold your transparent semi circle stuff). It must be a little bigger (in height) than place_holder since it'll cover it and a bit of it will be hovering over the list view, so it would look, like the list view is below.
To not make the actual list elements hide below the top panel - set a header view for your ListView (ListView.addHeaderView()) that will take some space and won't let the first row of data to hide below the top panel.
That above is, of course, a hack way. The best way is to layout components yourself programmatically, so you won't be needing any place_holders and your sizes wouldn't be so hardcoded.

Categories

Resources