How can i hide the elements when my keyboard pops up? - java

I have seen a few similar questions, but they want the things to show up, I want to hide them.
Basically I have a bunch of elements in my RelativeLayout and when the activity shows, the keyboard pops up, since I have an editText, and the elements that are aligned in the Bottom go up along the keyboard, I don't want that, I want them to stay hidden, any idea how can I achieve this?
This is the xml of my Activity:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:background="#drawable/bg"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:orientation="vertical"
android:id="#+id/invoices_layout"
tools:context=".NavManager">
<RelativeLayout
android:id="#+id/mcr_bar_progress"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerInParent="true"
android:visibility="visible">
<TextView
android:id="#+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerInParent="true"
android:layout_marginTop="15dp"
android:text="Agregar Productos"
android:textColor="#android:color/white"
android:textSize="34sp" />
<TextView
android:id="#+id/textGrid2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/textView"
android:layout_centerHorizontal="true"
android:layout_marginTop="0dp"
android:text="Grupo MkTech Solutions"
android:textColor="#android:color/white"
android:textSize="15sp" />
<EditText
android:id="#+id/txtproducto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:layout_alignParentEnd="true"
android:layout_marginStart="0dp"
android:layout_marginTop="92dp"
android:layout_marginEnd="0dp"
android:hint="Ej: Refresco Natural"
android:inputType="text"
android:textColor="#color/white"
android:textSize="15sp"
app:backgroundTint="#color/white" />
<ImageButton
android:id="#+id/btnbuscar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="#+id/txtproducto"
android:layout_alignEnd="#+id/txtproducto"
android:layout_marginTop="4dp"
android:layout_marginEnd="0dp"
android:onClick="onClickSwitch"
app:srcCompat="#drawable/research" />
<TextView
android:id="#+id/txttotal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:padding="10dp"
android:textColor="#color/WhiteBgText"
android:textSize="15sp" />
<ImageButton
android:id="#+id/btnlimpiarcarro"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:onClick="onClickCleanCart"
android:padding="10dp"
app:srcCompat="#drawable/quit" />
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:layout_marginStart="0dp"
android:layout_marginTop="150dp"
android:layout_marginBottom="50dp"
android:fillViewport="true">
<TableLayout
android:id="#+id/tableInvoices"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="0dp"
android:stretchColumns="*"></TableLayout>
</ScrollView>
</RelativeLayout>
</LinearLayout>
The last two elements before the scrollview are the ones that need to stay hidden.

add the following to your activity in the manifest:
android:windowSoftInputMode="adjustPan"
from the API:
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.

By my understanding of your question you do not want the keyboard to push the UI elements at the bottom of your layout.
To achieve this all you need to do is put the following line into your manifest activity tag:
android:windowSoftInputMode="adjustNothing"

Related

ScrollView doesn't work when keyboard shows up

I'm trying to implement a simple activity where the user can rate something and put a comment.
My view is this :
with the code :
<?xml version="1.0" encoding="utf-8"?>
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true"
android:background="#color/background_material_light"
xmlns:android="http://schemas.android.com/apk/res/android">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:isScrollContainer="true"
>
<ImageView
android:id="#+id/img_journey"
android:layout_width="wrap_content"
android:layout_height="250dp"
android:src="#drawable/pirate"
android:adjustViewBounds="true"
android:scaleType="centerCrop"
android:layout_alignParentTop="true" />
<LinearLayout
android:id="#+id/ratingLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_below="#+id/img_journey"
android:layout_marginTop="10dp">
<TextView
android:id="#+id/title_journey"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Title"
android:layout_gravity="center"
android:textSize="30sp"
android:textColor="#color/niceblue" />
<RatingBar
android:id="#+id/framework_normal_ratingbar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:minHeight="48dp"
android:maxHeight="48dp"
android:rating="5"
android:layout_gravity="center"
android:layout_marginTop="10dp"/>
</LinearLayout>
<LinearLayout
android:id="#+id/textbox_rate"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/button_layout"
android:layout_below="#+id/ratingLayout"
android:layout_marginLeft="30dp"
android:layout_marginRight="30dp"
android:layout_marginTop="25dp"
android:layout_marginBottom="25dp">
<EditText
android:padding="10dp"
android:gravity="start"
android:background="#drawable/textbox"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:hint="#string/hint_comment"
android:inputType="text"
android:autofillHints="" />
</LinearLayout>
<LinearLayout
android:id="#+id/button_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_alignParentBottom="true"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center|bottom"
android:orientation="horizontal"
android:weightSum="8"
android:layout_marginBottom="40dp">
<Button
android:id="#+id/btn_launch"
android:text="SEND RATE"
style="#style/button_classic"/>
</LinearLayout>
</LinearLayout>
</RelativeLayout>
</ScrollView>
The fact is, when I show the keyboard on clicking in the editText, the view is not scrollable and the result is this :
I search like 3 hours on the internet but I found nothing, the only result that I found was to put this on the onCreate of my activity
getWindow().setSoftInputMode(WindowManager.LayoutParams.SOFT_INPUT_STATE_HIDDEN|WindowManager.LayoutParams.SOFT_INPUT_ADJUST_PAN|WindowManager.LayoutParams.SOFT_INPUT_ADJUST_RESIZE);
But it doesn't work either. (I've tried with and without each flag)
The second thing I've tried was to put the ScrollView into the RelativeLayout, but sameresult, doesn't work.
The thing I would like is that the keyboard appears below the edit text and that we do not see the button SEND RATE (except if the user scroll) and, finally, the user should be able to scroll even when the keyboard is displayed.
Am I doing something wrong or what ?
Thanks in advance !!

Align button at the bottom 1/3 of the screen

I'm trying to align a button not right at the bottom of the screen but at a slight distance above the bottom line. How can I do that? I've tried centering the button vertically and horizontally and it works, but I need to either move the button a little below the center or a little above the bottom line.
I need to move the "PLAY" button a little lower on the screen. Additionally, I also need to scale the button down a bit, to like 80% of its current size. How can I do that?
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="acevix.gladiators3.MainActivity">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:srcCompat="#drawable/splash"
android:id="#+id/imageView"
android:scaleType="centerCrop"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:adjustViewBounds="true" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:layout_marginBottom="50dp"
android:id="#+id/button3"
android:background="#drawable/play" />
</RelativeLayout>
Use this codes,
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="30dp"
Try this;
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="30dp"/>
</RelativeLayout>
Update Code
Use this : android:layout_below
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/logo"
android:layout_width="200dp"
android:layout_height="80dp"
android:layout_centerInParent="true" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/logo"
android:layout_centerInParent="true"
android:layout_marginTop="30dp" />
</RelativeLayout>
For different screen resolutions you can use
intuit/sdp
add this line to your gradle file
compile 'com.intuit.sdp:sdp-android:1.0.3'

Android Soft Keyboard Disrupt's My Layout

I know a ton of questions on this topic have been asked but none seem to work for me. I have a linear layout with an an edit text and icons below but when the keyboard pops up it covers the icons and half the edit text.
My Manifest File:
<activity
android:name="com.social.pages.Post"
android:windowSoftInputMode="stateVisible|adjustResize"
android:screenOrientation="portrait" >
</activity>
My Layout File:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/feed_bg" >
<LinearLayout
android:id="#+id/stories_post_entire"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/story_post"
android:layout_centerHorizontal="true"
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:id="#+id/stories_post_text"
android:layout_width="fill_parent"
android:layout_height="300dp"
android:layout_marginTop="15dp"
android:orientation="horizontal"
android:paddingBottom="#dimen/feed_item_padding_top_bottom"
android:paddingLeft="#dimen/feed_item_padding_left_right"
android:paddingRight="#dimen/feed_item_padding_left_right" >
-->
<EditText
android:id="#+id/stories_post_story"
android:layout_width="fill_parent"
android:layout_height="300dp"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_marginTop="10dp"
android:background="#drawable/bg_parent_rounded_corner"
android:ems="10"
android:gravity="top"
android:hint="Tell Your Story..."
android:padding="10dp"
android:paddingLeft="10dp"
android:scrollbars="vertical"
android:typeface="serif" />
<LinearLayout
android:id="#+id/stories_post_bar"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_marginTop="10dp"
android:paddingLeft="#dimen/feed_item_padding_left_right"
android:paddingRight="#dimen/feed_item_padding_left_right" >
<ImageView
android:id="#+id/stories_post_tag"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scaleType="fitCenter"
android:src="#drawable/tag" />
<ImageView
android:id="#+id/stories_post_take_pic"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="30dp"
android:scaleType="fitCenter"
android:src="#drawable/take_pic" />
</LinearLayout>
</LinearLayout>
<!-- </LinearLayout> -->
<Button
android:id="#+id/story_post"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:text="Post" />
</RelativeLayout>
No Java code has been written yet.
You're setting the EditText element to 300dp height which prevents anything from moving up. I was able to fix this by wrapping the EditText and following LinearLayout (that houses your images) in a RelativeLayout. By doing this, you can set the image-housing LinearLayout to alignParentBottom="true". I believe this is your desired effect.
<?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" >
<LinearLayout
android:id="#+id/stories_post_entire"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/story_post"
android:layout_centerHorizontal="true"
android:orientation="vertical" >
<!-- ADDITION -->
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<EditText
android:id="#+id/stories_post_story"
android:layout_width="fill_parent"
android:layout_height="300dp"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_marginTop="10dp"
android:ems="10"
android:gravity="top"
android:hint="Tell Your Story..."
android:padding="10dp"
android:paddingLeft="10dp"
android:scrollbars="vertical"
android:typeface="serif" />
<LinearLayout
android:id="#+id/stories_post_bar"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_alignParentBottom="true"
android:layout_marginTop="10dp" >
<!-- ADDITION ^^^ alignParentBottom-->
<ImageView
android:id="#+id/stories_post_tag"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scaleType="fitCenter"
android:src="#drawable/osumu_blur"/>
<ImageView
android:id="#+id/stories_post_take_pic"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="30dp"
android:scaleType="fitCenter"
android:src="#drawable/osumu_blur"/>
</LinearLayout>
<!-- ADDITION -->
</RelativeLayout>
</LinearLayout>
<!-- </LinearLayout> -->
<Button
android:id="#+id/story_post"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:text="Post" />
</RelativeLayout>
NOTE: I replaced your drawable src with "dummy_image"
THe only thing you can do about the soft keyboard is to set the android:windowSoftInputMode in the manifest (or to change it on the fly programatically). The allowed modes are basically nothing (just let the keyboard pop up and cover whatever), pan (scrolls the app such that the cursor is on the screen), and resize (resizes your app to lay out completely above the keyboard).
You obviously want resize. However to make that work, your layout needs to be resizable- there needs to be some element that can be shrunk and still fit your app in the smaller size, or there needs to be empty space that can be shrunk. If you have to much on screen, that won't work. And in that case Android will still ensure that the cursor is on screen, but will not do anything else.
Looking at your layout- I don't see anything that can shrink. You may be able to refactor it to make the edit text use fill_parent so it can be shrunk, but that would require making it (or its direct parent) layout_above and layout_below two other elements so it is sized to be the remaining space between them. That's about all I can see for you to do, other than remove elements.

Android listview overlaps edit text field

Im having some layout issues, what I want to happen
1. My discussions_edit_text_wrap should be at the bottom of the view, when keyboard slides up it must be visible above the keyboard
2. The discussions_list_view should be just above the discussions_edit_text_wrap, also when keyboard slides up this should scroll to enable the user to view content. When the keyboard is closed this listview should not occupy the whole screen even if it has alot of items.
What happens
1. As the code is currently the list view shows but occupies the whole screen and runs underneath the edit text which sits at the top of the screen.
Help would be much appreciated, Thanks!
Here is the code:
<RelativeLayout
android:id="#+id/create_discussions_layout"
android:background="?attr/drawer_background"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:visibility="gone"
android:padding="10dp">
<!-- list of discussions -->
<LinearLayout
android:id="#+id/discussions_list_wrap"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:orientation="vertical">
<ListView
android:id="#+id/discussions_list_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:divider="#color/divider_light"
android:dividerHeight="1dp"/>
<TextView
android:id="#+id/discussions_empty"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?text_small"
android:paddingTop="10dp"
android:paddingBottom="10dp"
android:paddingLeft="30dp"
android:paddingRight="10dp"
android:text="#string/no_notes_available"
android:layout_gravity="left|center_vertical"
android:visibility="gone"/>
<View
android:layout_height="1dp"
android:layout_width="match_parent"
android:background="?divider_light"
android:layout_marginBottom="10dp"/>
</LinearLayout>
<!-- edittext areas for discussions content -->
<LinearLayout
android:id="#+id/discussions_edit_text_wrap"
android:layout_height="50dp"
android:layout_width="match_parent"
android:orientation="horizontal"
android:weightSum="10">
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="8"
android:layout_marginTop="8dp"
android:gravity="left">
<EditText
android:id="#+id/discussions_edit"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textColor="?attr/text_color_light"
android:imeOptions="actionNext"
android:hint="#string/add_new_comment"
android:focusable="true"
android:layout_marginRight="20dp"
android:focusableInTouchMode="true"/>
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="2"
android:gravity="right"
android:minWidth="200dp">
<Button
android:id="#+id/discussions_comment_button"
style="?main_button"
android:text="#string/comment"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>
</LinearLayout>
</RelativeLayout>
Update
After adding android:layout_above="#+id/discussions_edit_text_wrap" and android:layout_alignParentBottom="true"

Android hide and show components

I am making a sqlite android application which is to list some data , show graphs , visit a web site by starting default browser(not in application by using webview) , send emails by using a form . I will have a couple of forms . So what I was thinking is that instead of using several activities and xml layouts I put it all in one xml layout and simply on button click show and hide components as it is done with javascript
These are my components for now ...
<ScrollView 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">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="432dp"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context=".MainActivity" >
<TextView
android:id="#+id/textView1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="32dp"
android:text="ENTER COMPANY NAME " />
<EditText
android:id="#+id/editText1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/textView1"
android:layout_centerHorizontal="true"
android:ems="10">
<requestFocus />
</EditText>
<Spinner
android:id="#+id/spinner1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/editText1"
android:layout_centerHorizontal="true"
android:layout_marginTop="17dp"
android:entries="#array/country_arrays"
android:prompt="#string/country_prompt"
/>
<Spinner
android:id="#+id/spinner2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/spinner1"
android:layout_below="#+id/spinner1"
android:entries="#array/limit_arrays"
android:prompt="#string/limit_prompt"
/>
<Button
android:id="#+id/button1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/spinner2"
android:layout_centerHorizontal="true"
android:text="Hide" />
<Button
android:id="#+id/button2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/button1"
android:layout_centerHorizontal="true"
android:text="Show" />
</RelativeLayout>
</ScrollView>
Then I am to show or hide components by using for example
spinner1.setVisibility(View.VISIBLE);
spinner1.setVisibility(View.GONE);
This seams to be working fine , but I am getting a kind of low on space on my xml screen. How do I put more components in the bottom and make my View scroll down although I have put
<ScrollView 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">
on the top of my xml layout . And is this a good idea for a menu organisation ?

Categories

Resources