I know there are a few questions about this on SO but I haven't found one to solve my exact issue, nor have I been able to figure it out from other answers.
I have a layout with a few EditText boxes, and the bottom of which is fairly big and stretches from about halfway down the page to the bottom. When I activate the keyboard, this EditText is then shrunk to reach just above where the keyboard stops. This isn't an issue on devices with larger screens, but on some of the older devices I can see that the box is barely visible.
Is there a way that I can wrap my layout into a ScrollView to allow the box to stay the same size, and let the user just scroll the page to see any items hidden by the keyboard (i.e. making the area above the keyboard the "window" but keeping the same sized views inside)?
A good example of what I mean is in the HTC's Mail setup screen where when creating a new account, you can scroll the screen to see the content hidden behind the keyboard when it's active. There are probably others, but that came to mind.
Here is the XML for my page, as you can see it's quite simple (my Strings are placeholders, so nobody point that out :P).
<?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:fillViewport="true" >
<TextView
android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="10dp"
android:text="Contact Us"
android:textAppearance="?android:attr/textAppearanceLarge" />
<View
android:layout_width="fill_parent"
android:layout_height="2dp"
android:layout_alignLeft="#+id/title"
android:layout_alignRight="#+id/title"
android:layout_below="#+id/title"
android:background="#000000" />
<TextView
android:id="#+id/email"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/title"
android:layout_marginLeft="20dp"
android:layout_marginTop="6dp"
android:text="Your Email:"
android:textAppearance="?android:attr/textAppearanceMedium" />
<EditText
android:id="#+id/editTextFrom"
android:layout_width="match_parent"
android:layout_height="30dp"
android:layout_alignLeft="#+id/email"
android:layout_below="#+id/email"
android:layout_marginRight="20dp"
android:layout_marginTop="6dp"
android:background="#drawable/bordered"
android:ems="10"
android:inputType="textPersonName"
android:paddingLeft="3dp"
android:paddingRight="3dp" >
<requestFocus />
</EditText>
<TextView
android:id="#+id/subject"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/editTextFrom"
android:layout_below="#+id/editTextFrom"
android:layout_marginTop="6dp"
android:text="Your Subject:"
android:textAppearance="?android:attr/textAppearanceMedium" />
<EditText
android:id="#+id/editTextSubject"
android:layout_width="match_parent"
android:layout_height="30dp"
android:layout_alignLeft="#+id/subject"
android:layout_below="#+id/subject"
android:layout_marginRight="20dp"
android:layout_marginTop="6dp"
android:background="#drawable/bordered"
android:ems="10"
android:inputType="textCapSentences"
android:paddingLeft="3dp"
android:paddingRight="3dp" >
<requestFocus />
</EditText>
<TextView
android:id="#+id/message"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/editTextSubject"
android:layout_marginLeft="20dp"
android:layout_marginTop="6dp"
android:text="Your Message:"
android:textAppearance="?android:attr/textAppearanceMedium" />
<EditText
android:id="#+id/editTextMessage"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignLeft="#+id/message"
android:layout_below="#+id/message"
android:layout_marginRight="20dp"
android:layout_marginTop="6dp"
android:layout_marginBottom="10dp"
android:layout_alignParentBottom="true"
android:background="#drawable/bordered"
android:ems="10"
android:gravity="top|left"
android:imeOptions="actionDone"
android:inputType="textCapSentences"
android:paddingLeft="3dp"
android:paddingRight="3dp" />
I know there are a few edits to the AndroidManifest.xml which can be made, and I'm pretty sure this is doable, I just can't seem to find the right combo!
Any help is appreciated, if I didn't make it clear enough just say.
This is far beyond what I had in mind originally, so I'm not going to accept this unless nothing better comes up.
What I'm doing now to solve the issue is I added android:windowSoftInputMode="adjustResize" to my activity in the AndroidManifest.xml.
I tested a bunch of screen sizes and figured that 800px height was roughly the limit for when it gets a bit difficult to read due to the keyboard, so I added the following code to my onCreateView():
DisplayMetrics screen = new DisplayMetrics();
getActivity().getWindowManager().getDefaultDisplay().getMetrics(screen);
if(screen.heightPixels < 800){
getActivity().getWindow().setSoftInputMode(WindowManager.LayoutParams.SOFT_INPUT_ADJUST_PAN);
}
It'd make sense to work out roughly which setting is likely to have more devices (>= 800 or < 800 and flip the if statement accordingly, just to make it more efficient (although it won't be noticeable).
As I said this is a workaround rather than an ideal answer to the question, so more answers please! :)
Edit: Didn't account for density, now using if(screen.displayDPI < 160 && screen.heightPixels < 800){
Related
In my app I'm using EditText in a few different places. However, whenever I click any of these EditText's, the soft keyboard appears and then there is a short delay where it seems like everything freezes for about one or two seconds before I can type.
Same thing happens when I am done typing and click the back button, the soft keyboard disappears and then there is a white square instead where it took place and it again freezes for one or two seconds.
I have searched for it and I found this, I tried it but didn't change anything. What can be the cause for this and how can I fix it?
<?xml version="1.0" encoding="utf-8"?>
<TextView
android:id="#+id/weekTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:textColor="#color/PaleBlack"/>
<RelativeLayout
android:id="#+id/desiredHoursContainer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toEndOf="#id/weekTextView"
android:layout_toRightOf="#+id/weekTextView">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toLeftOf="#+id/desiredHoursEditText"
android:layout_toStartOf="#id/desiredHoursEditText"
android:paddingEnd="5dp"
android:paddingRight="5dp"
android:text="#string/desired_hours"
android:textColor="#color/PaleBlack"/>
<EditText
android:id="#+id/desiredHoursEditText"
android:layout_width="wrap_content"
android:layout_height="30dp"
android:layout_toLeftOf="#+id/unitTextView"
android:layout_toStartOf="#+id/unitTextView"
android:background="#drawable/main_border_square"
android:inputType="number"
android:maxLength="2"
android:minWidth="40dp"
android:textAlignment="center"
android:textColor="#color/PaleBlack"/>
<TextView
android:id="#+id/unitTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:paddingLeft="5dp"
android:paddingStart="5dp"
android:text="h"
android:textColor="#color/PaleBlack"/>
</RelativeLayout>
I fixed it by adding the following line to my activity in the manifest, not sure why tho.
android:windowSoftInputMode="adjustNothing"
My app was first developed for Android 2.3, but has been updated many times and currently targets V21. So I was surprised when my Nexus 5 received the Marshmallow update and found that a critical feature of my app was broken. I have a screen with a line at the top where I want two buttons at the far right and an EditText box (for search text) filling up the remainder of the screen to the left. This was my first app and I was unclear about various layout techniques, but from Android 2.3 to 5.1 this code has continued to work:
<RelativeLayout android:layout_width="match_parent"
android:layout_height="wrap_content"
style="#style/upper_detail_section"
android:elevation="#dimen/upper_elevation"
>
<Button android:id="#+id/sort"
style="#style/large_cust_btn"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:text="#string/sort"
/>
<Button android:id="#+id/clear"
style="#style/large_cust_btn"
android:layout_toLeftOf="#+id/sort"
android:layout_alignParentTop="true"
android:layout_alignWithParentIfMissing="true"
android:text="#string/clear"
/>
<EditText android:id="#+id/lookup"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_toLeftOf="#+id/clear"
android:layout_alignBaseline="#+id/clear"
android:singleLine="true"
android:hint="#string/item_search_hint"
android:scrollHorizontally="true"
android:textSize="16sp"
android:inputType="textFilter"
/>
</RelativeLayout>
Bringing this screen up in Android 6.0, the buttons are there but the EditText field completely disappears! Knowing what I know now it turned out to be a simple fix using a LinearLayout and weighting:
<LinearLayout android:layout_width="match_parent"
android:layout_height="wrap_content"
style="#style/upper_detail_section"
android:orientation="horizontal"
android:elevation="#dimen/upper_elevation"
>
<EditText android:id="#+id/lookup"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:singleLine="true"
android:hint="#string/item_search_hint"
android:scrollHorizontally="true"
android:textSize="16sp"
android:inputType="textFilter"
/>
<Button android:id="#+id/clear"
style="#style/large_cust_btn"
android:text="#string/clear"
android:onClick="clearClicked"
/>
<Button android:id="#+id/sort"
style="#style/large_cust_btn"
android:text="#string/sort"
android:onClick="sortClicked"
/>
</LinearLayout>
So all is well now and I'm updating the store with a new APK, but I thought I'd warn people that some layout tricks that used to work may now be broken.
If I'm understanding and reproducing your problem correctly, it's quite simple to fix your issues with RelativeLayout as well. Marshmallow only handles a width of match_parent differently. So just set it to something else like with the LinearLayout and alignParentLeft to true:
<EditText android:id="#+id/lookup"
android:layout_alignParentLeft="true"
android:layout_width="0dp"
[...] />
This yielded the same layout for me like in pre Marshmallow.
I wanted to make an ImageButton to put in my app, but I need a very specific one.
I wanted to make an ImageButton similar to that of the one in QuickPic. Notice on the left screenshot, the Camera. See how there's an image, with a translucent gray bar at the bottom with text in it? I wanted to make something very similar to that, but with one large textview in the gray bar instead of two small ones. I am completely lost on how to do this in XML so if someone could help me, It'd be greatly appreciated. Thanks!
You mean something like this? :
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<ImageButton
android:id="#+id/imageButton1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:src="#drawable/ic_launcher" />
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/imageButton1"
android:layout_alignLeft="#+id/imageButton1"
android:layout_alignRight="#+id/imageButton1"
android:background="#33000000"
android:text="Image Text" />
</RelativeLayout>
Additionally, you can specify the TextView's gravity and textSize to further match your needs:
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/imageButton1"
android:layout_alignLeft="#+id/imageButton1"
android:layout_alignRight="#+id/imageButton1"
android:background="#33000000"
android:gravity="center_horizontal"
android:text="Image Text"
android:textSize="8sp" />
This is my .xml file where I have used two scrollview,in Input Edittext and onether in output TextView. What is wrong here...It is not working in android device.
Another problem is that when I turn my device it only shows the input text area. The output text area goes down.I want to see the half screen of input and half screen of output area.
How to fix it??
Thanks
<?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="vertical" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="35dp"
android:orientation="horizontal" >
<Button
android:id="#+id/test"
android:layout_width="60dp"
android:layout_height="38dp"
android:text="#string/test" />
<Button
android:id="#+id/rdf"
android:layout_width="60dp"
android:layout_height="38dp"
android:text="#string/rdf" />
<Button
android:id="#+id/load"
android:layout_width="75dp"
android:layout_height="38dp"
android:text="#string/load" />
<Button
android:id="#+id/clear"
android:layout_width="60dp"
android:layout_height="38dp"
android:text="#string/clear" />
<Button
android:id="#+id/close"
android:layout_width="fill_parent"
android:layout_height="38dp"
android:text="#string/close" />
</LinearLayout>
<ScrollView
android:id="#+id/scrollView1"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<EditText
android:id="#+id/input"
android:layout_width="0dp"
android:layout_height="175dp"
android:layout_weight="1"
android:background="#fff"
android:ems="10"
android:gravity="top|left"
android:textSize="14dp"
android:inputType="textMultiLine" >
<requestFocus />
</EditText>
</LinearLayout>
</ScrollView>
<Button
android:id="#+id/run"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/run" />
<ScrollView
android:id="#+id/scrollView2"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/output"
android:layout_width="match_parent"
android:layout_height="225dp"
android:background="#fff"
android:text="#string/output"
android:textColor="#1e90ff" />
</LinearLayout>
</ScrollView>
</LinearLayout>
Try setting layout_weight=1 and layout_height=0dp for the two scroll views instead of their
contents.
What is wrong here...It is not working in android device.
That's pretty vague. What were your expectations? What isn't working? In other words, please be a little more specific.
However, based on the layout code given, here are some recommendations:
Avoid hardcoding the size of views. You cannot make assumptions about screen size with the large variety of screen sizes, densities and devices out there. Also, even if you're able to make the layout look nice in portrait mode, it'll probably be not even close to that in landscape.
If you're going to put just a single View in a ScrollView, there's no need to wrap it in a ViewGroup container; just set the View directly, without nesting it again and added an extra layer of complexity to the view hierarchy.
There's no need to wrap a TextView or EditText with a ScrollView, as both views are scrollable by itself.
Regarding your second question: you can prevent Android from extracting all UI components when there's little layout estate left with the keyboard popped up. You'll need to set the IME_FLAG_NO_EXTRACT_UI flag on the EditText, or in xml: android:imeOptions="flagNoExtractUi".
I do like to point out that there's a reason Android has this behaviour by default. In most cases it hardly makes sense to force a tiny part of the UI to be visible, even more as whatever is being typed by the user is probably what really matters.
i am developing an application which has a general text entry form. So
while testing on my moto droid, i am facing a strange issue-- when i
touch an input field ( which is at lower end of the screen) -- the on
screen keyboard pops up and hides the input field. So user have to
enter blindly. So is this a sdk issue OR it is particular for droids
OR am i doing something wrong???
I have tested this same form on G1, Hero..i see no issues at all.
Please help...
Layout xml file -- `
<TextView android:id="#+id/textmsg" android:layout_width="fill_parent"
android:layout_height="wrap_content" android:text="Some text"
android:layout_marginTop="10px" android:textColor="#ffffff"
android:textSize="15px" android:layout_marginLeft="10px"
android:layout_marginRight="10px" />
<EditText android:id="#+id/textstreet1" android:layout_width="fill_parent"
android:layout_height="wrap_content" android:layout_marginTop="15px"
android:layout_below="#+id/textmsg" android:textColor="#000000"
android:textSize="20px" android:gravity="center_vertical"
android:layout_marginLeft="10px" android:paddingLeft="5px"
android:layout_marginRight="10px" />
<EditText android:id="#+id/textstreet2" android:layout_width="fill_parent"
android:layout_height="wrap_content" android:layout_marginTop="2px"
android:layout_below="#+id/textstreet1" android:textColor="#000000"
android:textSize="20px" android:gravity="center_vertical"
android:layout_marginLeft="10px" android:paddingLeft="5px"
android:layout_marginRight="10px" />
<EditText android:id="#+id/textcity" android:layout_width="fill_parent"
android:layout_height="wrap_content" android:layout_marginTop="2px"
android:layout_below="#+id/textstreet2" android:textColor="#000000"
android:textSize="20px" android:gravity="center_vertical"
android:layout_marginLeft="10px" android:paddingLeft="5px"
android:layout_marginRight="10px" />
<EditText android:id="#+id/textstate" android:layout_width="fill_parent"
android:layout_height="wrap_content" android:layout_marginTop="2px"
android:layout_below="#+id/textcity" android:textColor="#000000"
android:textSize="20px" android:gravity="center_vertical"
android:layout_marginLeft="10px" android:paddingLeft="5px"
android:layout_marginRight="10px" />
<EditText android:id="#+id/textzip" android:layout_width="fill_parent"
android:layout_height="wrap_content" android:layout_marginTop="2px"
android:layout_below="#+id/textstate" android:textColor="#000000"
android:textSize="20px" android:gravity="center_vertical"
android:layout_marginLeft="10px" android:paddingLeft="5px"
android:layout_marginRight="10px" />
<EditText android:id="#+id/textcrossstreet"
android:layout_width="fill_parent" android:layout_height="wrap_content"
android:layout_marginTop="2px" android:layout_below="#+id/textzip"
android:textColor="#000000" android:textSize="20px" android:gravity="center_vertical"
android:layout_marginLeft="10px" android:paddingLeft="5px"
android:layout_marginRight="10px" />
<EditText android:id="#+id/textdi" android:layout_width="fill_parent"
android:layout_height="wrap_content" android:layout_marginTop="2px"
android:layout_below="#+id/textcrossstreet" android:textColor="#000000"
android:textSize="20px" android:gravity="center_vertical"
android:layout_marginLeft="10px" android:paddingLeft="5px"
android:layout_marginRight="10px" />
</RelativeLayout>
`
I just want to say that I had the EXACT SAME problem and the solution "for me" was given by synic. I had to update my manifest with the following:
<activity android:name=".MyActName" android:softInputMode="adjustResize" ... />
Prior to this, I had a EditText field anchored to the bottom, but when focus is entered, the keyboard would launch and cover my field. Also, the available view that is scrollable didn't allow me to see either the absolute TOP or absolute BOTTOM of my scrollable view. It just seemed like the view wasn't resizing correctly.
Thanks to synic
Try enclosing your RelativeLayout inside a ScrollView. THen you just scroll up and down to the fields you want to edit. I do have a problem with right now that I'm looking for an answer, the top item is half hidden under the Screen title, but I don't think it's an issue with what I suggested.
The behaviour you're getting is sort of necessary. There may be a phone without a keyboard. I did notice that if you go to landscape, the keyboard goes away. Guess they assume that in Landscape mode, the physical keyboard will be there.
I'm new to this environment, so maybe thre are better ways, but this is working for me.
Have you tried putting adding below to the #+id/textmsg
android:layout_gravity="top"
or
try using a linearlayout instead of a relativelayout. It doesn't seem like you need a relative layout since all of the items are being stacked vertically.
I think you want: https://developer.android.com/guide/topics/manifest/activity-element.html#wsoft
You can specify which softinput method your activity uses in your manifest.
Something like <activity android:softInputMode="adjustPan" android:name... /> will make Android try to pan the currently focused input field into view, or you can use adjustResize to have it try to resize the entire layout to fit the keyboard (this requires that your layout has a ListView or a ScrollView that can be resized.