Strange layout rendering when edit text gains focus - android

I have a fragment with a listview and an edittext.
When the edittext gains focus all the layout except the edittext turns black for one second.
If I hold the edittext clicked then the surrounding layout stays black until I scroll the list, or touch the screen, it only happens on Jelly Bean 4.1.2.
Here is my xml:
<?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="#null"
android:orientation="vertical" >
<RelativeLayout
android:id="#+id/search_layout"
android:layout_width="fill_parent"
android:layout_height="49.33dp"
android:background="#color/grey">
<EditText
android:id="#+id/search_box"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:layout_gravity="center"
android:layout_marginRight="5dp"
android:background="#drawable/searchbox"
android:drawableLeft="#drawable/search_icon"
android:ems="8"
android:hint="#string/search_hint"
android:maxLines="1"
android:padding="3dp"
android:paddingLeft="15dp"
android:paddingRight="25dp"
android:singleLine="true" />
</RelativeLayout>
<com.emilsjolander.components.stickylistheaders.StickyListHeadersListView
android:id="#+id/list"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#id/search_layout"
android:divider="#color/light_blue"
android:dividerHeight="0.67dp" />
</RelativeLayout>
What can be the causes for that behavior ?

Add the following line to your listview(in xml) and try..
android:cacheColorHint="#00000000"
Hope it works!!

Related

Prevent from changing editText on keyboard open

In my Android application, I have ListView, with header contains 2 editText. When I try to focus on lower editText, the keyboard shows up, and changes focus to upper editText. Header layout xml:
<?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">
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/name"
android:hint="Title"
android:layout_alignParentTop="true"/>
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:nextFocusUp="#id/name"
android:inputType="text"
android:hint="Wordpack description"
android:id="#+id/description"
android:layout_below="#+id/name" />
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/description"
android:inputType="text"
android:id="#+id/locale"
android:text="Select language"/>
</RelativeLayout>
Seems like ListView is taking focus and giving it to the first child when you tap on it. Check out this answer. From the gist of it, you need to add the following in your activity on the manifest:
android:windowSoftInputMode="adjustPan"
And add this to your ListView:
android:descendantFocusability="beforeDescendants"

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.

Soft Keyboard hides ListView elements in Fragment [duplicate]

This question already has answers here:
Android soft keyboard covers EditText field
(15 answers)
Closed 7 years ago.
I have a Fragment that contains a ListView to which I add three EditText's to and one Spinner when I select the second EditText the keyboard shows as expected but I cannot scroll the list view to the last two remaining elements in the list view while the keyboard is visible.
It's almost as though the list view is not recognizing that the soft-keyboard is visible the last two remaining elements are still behind the soft-keyboard.
Below is screenshots and XML of the views in question.
AndroidManifest:
<activity
android:name=".MainActivity"
android:label="#string/app_name"
android:windowSoftInputMode="adjustPan">
List view:
<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$PlaceholderFragment"
android:background="#color/generic_grey">
<ListView
android:id="#+id/form_base_listview"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:divider="#null"
android:dividerHeight="0dp"
android:descendantFocusability="afterDescendants"
/>
</RelativeLayout>
Multiline View:
<?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/white"
android:paddingBottom="5dp">
<TextView
android:id="#+id/form_multi_txt"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/testing"
android:padding="10dp"/>
<EditText
android:id="#+id/form_multi_edit"
android:layout_width="fill_parent"
android:layout_height="100dp"
android:layout_below="#+id/form_multi_txt"
android:layout_marginLeft="5dp"
android:paddingLeft="5dp"
android:paddingRight="5dp"
android:background="#drawable/edit_text_background"
android:layout_toLeftOf="#+id/form_multi_info_btn"
android:layout_toStartOf="#+id/form_multi_info_btn"
android:inputType="textMultiLine"/>
<ImageButton
android:id="#+id/form_multi_info_btn"
android:layout_width="30dp"
android:layout_height="30dp"
android:scaleType="fitStart"
android:src="#drawable/form_row_info"
android:background="#android:color/transparent"
android:layout_below="#+id/form_multi_txt"
android:layout_alignParentRight="true"
android:layout_marginRight="10dp"/>
</RelativeLayout>
Spinner:
<?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/white"
android:paddingBottom="5dp">
<TextView
android:id="#+id/form_select_txt"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/testing"
android:padding="10dp"/>
<Spinner
android:id="#+id/form_select_spinner"
android:layout_width="fill_parent"
android:layout_height="44dp"
android:layout_below="#+id/form_select_txt"
android:layout_marginLeft="5dp"
android:spinnerMode="dialog"
android:layout_toLeftOf="#+id/form_select_info_btn"
android:layout_toStartOf="#+id/form_select_info_btn"
android:background="#android:drawable/btn_dropdown"
/>
<ImageButton
android:id="#+id/form_select_info_btn"
android:layout_width="30dp"
android:layout_height="30dp"
android:scaleType="fitStart"
android:src="#drawable/form_row_info"
android:background="#android:color/transparent"
android:layout_below="#+id/form_select_txt"
android:layout_alignParentRight="true"
android:layout_marginRight="10dp"/>
</RelativeLayout>
The view within the spinner:
<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/textViewSpinnerItem"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/hello_world"
style="#style/SpinnerTextViewItem"
/>
Complete View:
View with Keyboard: (cannot scroll to view last two elements)
Put the all Tags in a Realtive Layout and the Relative Layout in ScrollView. As ScrollView takes Only One Child.
<?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/white"
android:paddingBottom="5dp">
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:id="#+id/form_multi_txt"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/testing"
android:padding="10dp"/>
<EditText
android:id="#+id/form_multi_edit"
android:layout_width="fill_parent"
android:layout_height="100dp"
android:layout_below="#+id/form_multi_txt"
android:layout_marginLeft="5dp"
android:paddingLeft="5dp"
android:paddingRight="5dp"
android:background="#drawable/edit_text_background"
android:layout_toLeftOf="#+id/form_multi_info_btn"
android:layout_toStartOf="#+id/form_multi_info_btn"
android:inputType="textMultiLine"/>
<ImageButton
android:id="#+id/form_multi_info_btn"
android:layout_width="30dp"
android:layout_height="30dp"
android:scaleType="fitStart"
android:src="#drawable/form_row_info"
android:background="#android:color/transparent"
android:layout_below="#+id/form_multi_txt"
android:layout_alignParentRight="true"
android:layout_marginRight="10dp"/>
</RelativeLayout>
</ScrollView>
</RelativeLayout>
It's because your activity layout needs to be adjusted once soft keyboard opens and you got this not set. What you need to do is to edit your Manifest and add
android:windowSoftInputMode="adjustResize"
to right <activity> tag. Here's Handling Input Method Visibility chapter in the docs, you may want to read to see what behaviours can you set with windowSoftInputMode

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

EditText field is too large or overwritten

How can I format a header, a list, and an EditText so that the EditText is a fixed single line and always visible?
Here is my layout with only one list entry - EditText fills the rest of the screen which looks bad.
Here is the layout with several list entries - the soft keyboard hides the text being typed. I was typing in Wayne.
I have tried a various Linear and Relative layouts. Here is my current Layout:
<?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:orientation="vertical" >
<TextView
android:id="#+id/select_child_header"
style="#style/headerStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:background="#color/start_blue"
android:text="Which child did you take a picture of?" />
<fragment
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/modchild_fragment"
android:name="com.chex.control.ChildList"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/select_child_header"
android:focusable="true"
android:focusableInTouchMode="true" >
</fragment>
<EditText
android:id="#+id/new_child"
style="#style/editTextStyle"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_below="#id/modchild_fragment"
android:hint="new child name"
android:inputType="text"
android:singleLine="true" />
</RelativeLayout>
I appreciate any advice on how to format this screen.
For this you have a two options one is In textview there is a tag called android:singleLine="true" if you do like this the text comes in a single line and it miss the some text and show some dots..
And another way is you have to decrease the fontsize.. by using this tag..android:textSize="3sp"
Try this way
<?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" >
<TextView
android:id="#+id/select_child_header"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:text="Which child did you take a picture of?" />
<fragment
android:id="#+id/modchild_fragment"
android:name="com.chex.control.ChildList"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:focusable="true"
android:focusableInTouchMode="true" >
</fragment>
<EditText
android:id="#+id/new_child"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_below="#id/modchild_fragment"
android:hint="new child name"
android:inputType="text"
android:singleLine="true" />
</LinearLayout>
Set
android:ellipsize=end
android:singleLine="true"
Change the order and positioning of your elements:
add first the header on top
add the bottom edittext
add the fragment in-between
Something like:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<TextView
android:id="#+id/select_child_header"
style="#style/headerStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:background="#color/start_blue"
android:text="Which child did you take a picture of?" />
<EditText
android:id="#+id/new_child"
style="#style/editTextStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:hint="new child name"
android:inputType="text"
android:singleLine="true" />
<fragment
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/modchild_fragment"
android:name="com.chex.control.ChildList"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#+id/new_child"
android:layout_below="#id/select_child_header"
android:focusable="true"
android:focusableInTouchMode="true" >
</fragment>
</RelativeLayout>
Add
android:maxLines="1"
to your EditText, to get desired number of lines .
You can set the static height to the Fragment. So that if your list item say for example, one or more than 5 also, your edit text constitutes the bottom layer of fragment.
Also, you can set android:singleLine="true" property to edittext.

Categories

Resources