I wanted to make a button always set at the bottom of the page but will move so it is always shown. The main reason I want this is because when you click into an edit text field the keyboard will pop-up and hide the button. I would like the button to move so it sits above the keyboard when in a field and then will return to the bottom when the keyboard is hidden. Currently I am using a relative layout:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent" android:layout_height="fill_parent"
android:orientation="vertical" android:background="#FFFFF0">
<RelativeLayout android:orientation="vertical"
android:id="#+id/titlebar1" android:background="#082386"
android:layout_width="fill_parent" android:layout_height="50dip"
android:gravity="center">
<ImageView android:src="#drawable/banner"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:scaleType="fitXY">
</ImageView>
</RelativeLayout>
<Spinner android:layout_height="wrap_content"
android:layout_below="#+id/titlebar1" android:layout_width="wrap_content"
android:id="#+id/NewUsedSpinner" android:prompt="#string/NewUsed_prompt"
android:layout_marginTop="15dip">
</Spinner>
<Spinner android:layout_height="wrap_content"
android:layout_below="#+id/NewUsedSpinner" android:layout_width="wrap_content"
android:id="#+id/MakeSpinner" android:prompt="#string/Make_prompt">
</Spinner>
<Spinner android:layout_height="wrap_content"
android:layout_below="#+id/MakeSpinner" android:layout_width="wrap_content"
android:id="#+id/ModelSpinner" android:prompt="#string/Model_prompt"></Spinner>
<Spinner android:layout_height="wrap_content"
android:layout_below="#+id/NewUsedSpinner" android:layout_width="wrap_content"
android:id="#+id/TrimSpinner" android:prompt="#string/Trim_prompt"></Spinner>
<Spinner android:layout_height="wrap_content"
android:layout_width="wrap_content" android:id="#+id/PriceSpinner"
android:layout_below="#+id/TrimSpinner" android:prompt="#string/Price_prompt"
android:layout_marginBottom="5dip"></Spinner>
<TextView android:text="Search within the radius of:"
android:layout_below="#+id/PriceSpinner" android:id="#+id/textView1"
android:layout_width="wrap_content" android:layout_alignLeft="#+id/FilterZip"
android:layout_height="wrap_content" android:textColor="#000"
android:layout_marginTop="5dip"></TextView>
<Spinner android:id="#+id/ZipSpinner" android:layout_width="120dip"
android:layout_below="#+id/textView1" android:layout_height="wrap_content"
android:prompt="#string/Zip_prompt"></Spinner>
<EditText android:layout_width="fill_parent"
android:layout_below="#+id/textView1" android:layout_toRightOf="#+id/ZipSpinner"
android:layout_height="wrap_content" android:text="Zip" android:id="#+id/FilterZip"
android:maxLength="5" android:numeric="integer"></EditText>
<Button android:layout_height="50dip" android:id="#+id/FilterSearchbtn"
android:layout_alignParentBottom="true" android:layout_width="fill_parent"
android:text="Search" android:layout_below="#+id/ZipSpinner"
android:background="#drawable/yellow_btn" android:textStyle="bold"></Button>
</RelativeLayout>
In your Android manifest you would add this to your activity:
<activity android:name=".YourActivity"
android:windowSoftInputMode="adjustResize"
Here's the official documentation: http://developer.android.com/resources/articles/on-screen-inputs.html
Maybe try alignParentBottom="true" on the button so that it will always be on the bottom, you'll have to fiddle with your layout.
(1) If we want to only adjust the screen without view which has (alignParentBottom="true") in relative layout then set below line in activity tag in manifest.xml
android:windowSoftInputMode="adjustPan"
(2) If we want to adjust the whole relative layout with the view which has (alignParentBottom="true") in relative layout then set below line in activity tag in manifest.xml
android:windowSoftInputMode="adjustResize"
(3) If we don't want to adjust the whole relative layout without the view which has (alignParentBottom="true") in relative layout then set below line in activity tag in manifest.xml
android:windowSoftInputMode="adjustPan|adjustResize"
(4) If we remove line android:windowSoftInputMode from the manifest.xml then it will behave like (2) option
Related
I do set resize in my manifest so the screen does move up when I tap on the EditText, however It looks like this:
And I would like it to look like this:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/white_three"
android:orientation="vertical">
<RelativeLayout
android:id="#+id/enter_bio"
android:layout_width="match_parent"
android:layout_alignParentBottom="true"
android:layout_height="130dp"
android:layout_marginBottom="10dp"
android:layout_marginTop="10dp"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:paddingTop="5dp">
<EditText
android:id="#+id/user_biography"
android:layout_width="match_parent"
android:layout_height="100dp"
android:hint="#string/biography_placeholder"
android:textAppearance="#style/TextAppearance.Font.Volkswagen"
android:textColor="#color/black_87"
android:textSize="16sp"
android:maxLength="160"
android:imeOptions="actionDone|flagNoFullscreen"
android:inputType="textAutoCorrect|textCapSentences"
/>
<TextView
android:id="#+id/user_biography_counter"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_marginEnd="18dp"
android:paddingBottom="5dp"
android:textAppearance="#style/TextAppearance.Font.Volkswagen"
android:textColor="#color/black_87"
android:textSize="14sp"
tools:text="60" />
</RelativeLayout>
</LinearLayout>
enter_bio is the element I would like the keyboard to appear under
put the entire view inside a ScrollView and set the android:windowSoftInputMode = adjustPan it will do the trick.
you just need to add this piece of code.
or
Try this
getActivity().getWindow().setSoftInputMode(WindowManager.LayoutParams.SOFT_INPUT_STATE_VISIBLE |WindowManager.LayoutParams.SOFT_INPUT_ADJUST_RESIZE);
However, instead of doing this at runtime, you can set it in the manifest as an Activity (parent) attribute. This will also be handled in your fragment (child):
android:windowSoftInputMode="stateAlwaysHidden|adjustResize"
I am having an activity in android where there is an editbox and 3 buttons below the editbox. Please see attachment. When this activity is launched, the default state is STATE1.(Please see image). The keyboard is visible by default. Now when I press the back button or dispose the keyboard, I wish to have the edittext resized and occupy the whole screen as shown in STATE2.
I am not sure how to accomplish this. I have the height of the edittext hardcoded to some dp based on the target device. I believe this has to be changed. Can anyone help me in how to accomplish this.
The XML of the layout file is below as well as the screencap
<?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="fill_parent"
android:background="#FFFFFF" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<EditText
android:id="#+id/EditMessage"
android:layout_width="fill_parent"
android:layout_height="150dp"
android:background="#drawable/newback"
android:gravity="top"
android:imeOptions="actionDone"
android:inputType="textMultiLine|textFilter|textVisiblePassword|textNoSuggestions"
android:maxLength="200"
android:padding="5dp"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textColor="#000000"
/>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="horizontal" >
<Button
android:id="#+id/PostMessage"
android:layout_width="0dp"
android:layout_height="45dp"
android:layout_weight="1"
android:layout_marginRight="0.2dp"
android:background="#drawable/newbutton_corner"
android:text="#string/SubmitMessage"
android:textColor="#FFFFFF"
android:textStyle="bold" />
<Button
android:id="#+id/CancelMessage"
android:layout_width="0dp"
android:layout_height="45dp"
android:layout_weight="1"
android:layout_marginRight="0.2dp"
android:background="#drawable/newbutton_corner"
android:text="#string/CancelMessage"
android:textColor="#FFFFFF"
android:textStyle="bold" />
<Button
android:id="#+id/DeleteMessage"
android:layout_width="0dp"
android:layout_height="45dp"
android:layout_weight="1"
android:background="#drawable/newbutton_corner"
android:text="#string/DeleteMessage"
android:textColor="#FFFFFF"
android:textStyle="bold" />
</LinearLayout>
</LinearLayout>
</RelativeLayout>
Change your EditText as follows:
<EditText
android:id="#+id/EditMessage"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="top"
android:imeOptions="actionDone"
android:inputType="textMultiLine|textFilter|textVisiblePassword|textNoSuggestions"
android:maxLength="200"
android:padding="5dp"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textColor="#000000"
/>
Add layout_weight = 1
In my opinion you do not need adjustPan. I will leave it upon you to decide. The behaviour will be different and you can try it out. Here is what the documentation says about adjustPan:
The activity's main window is not resized to make room for the soft
keyboard. Rather, the contents of the window are automatically panned
so that the current focus is never obscured by the keyboard and users
can always see what they are typing. This is generally less desirable
than resizing, because the user may need to close the soft keyboard to
get at and interact with obscured parts of the window.
Your buttons at the bottom may get hidden if using this. Instead use adjustResize:
Put this line in the activity inside AndroidManifest
android:windowSoftInputMode="stateVisible|adjustResize"
Try this.. in your manifest.
<activity
android:name="Activity"
android:windowSoftInputMode="adjustPan"/>
and your edittext use <requestFocus /> for from that start itself it'll focus
and android:layout_weight="1" it will automatically fill the screen.
<EditText
android:id="#+id/EditMessage"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#696969"
android:gravity="top"
android:imeOptions="actionDone"
android:inputType="textMultiLine|textFilter|textVisiblePassword|textNoSuggestions"
android:maxLength="200"
android:padding="5dp"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textColor="#000000"
>
<requestFocus />
</EditText>
Yes you can do that, its simple.
android:windowSoftInputMode="adjustResize" ,, add this attribute to you manifiest under required activity
Set width and height of your text view to match_parent
Done.
add android:windowSoftInputMode="adjustPan" and change android:layout_height="150dp" to android:layout_height="fill_parent"
When I click in my edit text and my keyboard shows up, everything seems to be ok as in the picture bellow:
But when it has to shrink a little bit more my image is resized extending a invisible area, and my TextView still as big as in the begining, then my layout doesn't work anymore:
I've tried to create new images and dimensions for xhdpi resolution, but it didn't any effect
How can I fix it? How can I resize everything proportionaly. (I've tried to put a scrollview but i have a ListView inside my layout, as you can see in the code below)
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#drawable/login_background"
android:descendantFocusability="beforeDescendants"
android:clickable="true"
android:focusableInTouchMode="true"
tools:context=".LoginActivity"
android:id="#+id/fundoLogin" >
<RelativeLayout
android:id="#+id/relativeLayout2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true" >
<ImageView
android:id="#+id/image_login_fields"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/image_logo"
android:layout_centerHorizontal="true"
android:contentDescription="#string/img_login_fields_desc"
android:src="#drawable/login_fields">
</ImageView>
<ImageView
android:id="#+id/image_logo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="#dimen/margin_logo_to_fields"
android:contentDescription="#string/img_logo_desc"
android:src="#drawable/logo" />
<TextView
android:id="#+id/labelLogin"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="#id/image_login_fields"
android:layout_alignLeft="#id/image_login_fields"
android:layout_marginTop="#dimen/margin_top_label_login"
android:layout_marginLeft="#dimen/margin_left_label_login"
android:text="#string/login"
android:textSize="#dimen/login_txt_size"
/>
<EditText
android:id="#+id/txtFieldLogin"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="#dimen/margin_left_txt_field_login"
android:layout_alignTop="#id/image_login_fields"
android:layout_toRightOf="#id/labelLogin"
android:layout_alignRight="#id/image_login_fields"
android:layout_marginRight="#dimen/margin_right_txt_field_login"
android:layout_marginTop="#dimen/margin_top_txt_field_login"
android:ems="10"
android:textSize="#dimen/login_txt_size"
android:hint="#string/txtFieldLoginHint"
android:singleLine="true" >
</EditText>
<TextView
android:id="#+id/labelSenha"
android:layout_below="#id/labelLogin"
android:layout_alignLeft="#id/image_login_fields"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/margin_top_label_senha"
android:layout_marginLeft="#dimen/margin_left_label_senha"
android:text="#string/senha"
android:textSize="#dimen/senha_txt_size" />
<EditText
android:id="#+id/txtFieldSenha"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/txtFieldLogin"
android:layout_alignLeft="#id/txtFieldLogin"
android:layout_alignRight="#id/txtFieldLogin"
android:layout_marginTop="#dimen/margin_top_txt_field_senha"
android:ems="10"
android:hint="#string/txtFieldSenhaHint"
android:singleLine="true"
android:textSize="#dimen/senha_txt_size"></EditText>
<ImageButton
android:id="#+id/btnEntrar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignRight="#id/image_login_fields"
android:layout_alignBottom="#id/image_login_fields"
android:layout_marginRight="#dimen/margin_right_btn_entrar"
android:layout_marginBottom="#dimen/margin_bottom_btn_entrar"
android:background="#drawable/btn_entrar_clicked"
android:contentDescription="#string/btn_entrar_desc"
/>
<ListView
android:id="#+id/listEmails"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#id/image_login_fields"
android:layout_alignRight="#id/image_login_fields"
android:layout_alignLeft="#id/txtFieldLogin"
android:background="#drawable/rounded_corner"
android:visibility="invisible" >
</ListView>
</RelativeLayout>
<Button
android:id="#+id/btnTeste"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:textSize="#dimen/btn_teste_txt_size"
android:layout_marginRight="#dimen/margin_right_btn_teste"
android:layout_marginBottom="#dimen/margin_bottom_btn_teste"
android:text="#string/btnCredenciaisDeTesteTxt"
android:textColor="#color/white" />
</RelativeLayout>
What you are looking for is the android:windowSoftInputMode attribute in the AndroidManifest. This controls how your screen will respond to the keyboard being shown. Right now it appears that it is using adjustResize and you want adjustPan so in your Activity declaration in the manifest add:
<activity android:windowSoftInputMode="adjustPan"
You can read more about your options here:
http://developer.android.com/guide/topics/manifest/activity-element.html#wsoft
If you want the screen to resize you need to rethink your layout.
First, its bad form to have the login background as a separate ImageView. Since you want it to resize you should create a 9 patch for the image at its smallest necessary size. This makes the container define the size of the image, not the image itself.
Second, wrap your TextViews and EditText in a RelativeLayout alone then apply the 9 patch you created as the background of the RelativeLayout. Now you will always have a login box that wraps your Views the way you designed it even when resized.
I would like to align two buttons on the bottom of a relative layout that is wrapped inside of a linear layout.
I am unable to get the view favorites button to be on top of the search button. There is a big space as you can see in this image:
Here is my code:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView
android:text="#string/SearchRestaurantsCity"
android:textAppearance="?android:attr/textAppearanceMedium"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/tvRestaurantSearchCity" />
<EditText
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/etRestaurantSearchCity" />
<TextView
android:text="#string/SearchRestaurantsState"
android:textAppearance="?android:attr/textAppearanceMedium"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/tvRestaurantSearchState" />
<EditText
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/etRestaurantSearchState" />
<TextView
android:text="#string/SearchRestaurantsCategories"
android:textAppearance="?android:attr/textAppearanceMedium"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/tvRestaurantSearchCategories" />
<Spinner
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/spRestaurantSearchCategories" />
<RelativeLayout
android:id="#+id/InnerRelativeLayout"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_alignParentBottom="true">
<Button
android:text="#string/btnViewFavoriteRestaurants"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/btnViewFavoriteRestaurants"
style="#style/ButtonText"
android:padding="5dp"
android:layout_below="btnSearchRestaurants" />
<Button
android:text="#string/btnSearchRestaurants"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/btnSearchRestaurants"
style="#style/ButtonText"
android:layout_alignParentBottom="true"
android:padding="5dp" />
</RelativeLayout>
There are 2 things wrong with the XML.
For starters, you can't refer to the button btnSearchRestaurants before it's defined.
Secondly, you've defined btnSearchRestaurants to align-parent-bottom, and then tried to define that btnViewFavoriteRestaurants would be below that button. It should be above it (as per your description).
If you're trying to put the first button I can see inside RelativeLayout, I'd try to change the following line:
android:layout_below="btnSearchRestaurants" />
for this one:
android:layout_above="#+id/btnSearchRestaurants" />
Part of the space is reserved for all the elements of the layout I can see inside the LinearLayout,and the + is because the button btnSearchRestaurants is below so it is not created yet
I think the problem is at
android:layout_below="btnSearchRestaurants"
It should be
android:layout_below="#id/btnSearchRestaurants"
In your xml code I think you should correct this line
android:layout_below="btnSearchRestaurants"
as you want it to be above the Search Restaurants button it should be
android:layout_above="#id/btnSearchRestaurants"
I changed below to above for obvious reasons (you want it above the other button not below it) and added #id/ because you will be searching for the button id.
In one of my views, I have three EditText fields. The first two are single-line, and the third is multi-line. I'm using android:windowSoftInputMode="stateVisible|adjustResize". however the third field collapses far too small in portrait mode when the IME comes up and it has focus.
Is there an option to set a minimum height that would force the window to scroll down to accommodate the third field?
I have tried setting android:minHeight="20dip" in the xml file, but this has no effect.
The EditText in question looks like:
<EditText
android:id="#+id/msgreplyarea"
android:layout_width="fill_parent"
android:layout_height="wrap_content" android:gravity="top"
android:layout_weight="1"
android:layout_marginLeft="10dip" android:layout_marginRight="10dip"
android:layout_marginTop="10px"
android:inputType="textCapSentences|textMultiLine"
android:imeOptions="flagNoEnterAction">
Thanks.
android:minHeight does work, but the parent view needs to be wrapped in a ScollView
<ScrollView
android:layout_width="fill_parent"
android:layout_height="0dip"
android:layout_weight="1"
android:scrollbarStyle="outsideInset"
android:fillViewport="true">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<EditText
android:id="#+id/replyarea"
android:layout_width="fill_parent"
android:layout_height="wrap_content" android:gravity="top"
android:singleLine="false" android:layout_weight="1"
android:layout_marginLeft="10dip" android:layout_marginRight="10dip"
android:layout_marginTop="10px"
android:minHeight="120dp"
android:inputType="textAutoCorrect|textCapSentences|textMultiLine"
android:imeOptions="flagNoEnterAction" />
</LinearLayout>
</ScrollView>
Android documentation might help you with this. Or you can use a quick fix:
<activity name="EditContactActivity"
android:windowSoftInputMode="stateVisible|adjustResize">
...
</activity>
OR
android:windowSoftInputMode="adjustPan"