Android Text Input Special UI Item - android

I'm creating an IM client/server application for the Android OS, and am currently putting together the user interface. Right now, my interface consists of a EditText element, and a Button element. When I tap on the EditText element, a keyboard pops up and allows you to type.
What I would like to have is something like the text entry area and send button in the default Android SMS app. Something like this:
The text input field and Send button would stay at the bottom of the screen, and when tapped on, the keyboard would push the text field and button up above it.
Is this possible using only EditText and Button elements?
Thank you for any suggestions or advice!

Try setting android:windowSoftInputMode=adjustResize for the activity in AndroidManifest.xml.
You can find details here.

Is this possible using only EditText and Button elements?
Answer-This type of functionality is possible in any type of view
I give just short tutorial on your question
Generally we use only linearlayout in xml file.But at view level android gives many more feature like Relative layout and much more.At this time we just discuss about the relative layout because it can solve your purpose.
In Relative layout it not use the android:orientation feature like linear layout it used another feature.In relative layout take some points in your mind...
we always give id to every view using android:id="#+id/GiveName"
for alignment of any view we used android:layout_toLeftOf="#id/givesname" same for
right,above and below where givesname=id of that view from which this view is align.
Ex. is gives example with screen shot
After this i give the sample xml file in which you get the above type of feature in your question
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/llWriteCommentWall" android:layout_height="fill_parent"
android:layout_width="fill_parent" android:background="#ffffff">
<Button android:id="#+id/btButtonComments"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="Comments"
android:layout_alignParentRight="true"
android:layout_alignParentBottom="true"/>
<EditText android:id="#+id/etEdittext"
android:layout_height="wrap_content" android:layout_width="fill_parent"
android:hint="Write a comment.... "
android:layout_marginLeft="2dip" android:layout_marginRight="2dip"
android:layout_toLeftOf="#id/btButtonComments"
android:layout_alignParentBottom="true"/>
</RelativeLayout>
ScreenShot of above example
In this Example we used android:layout_alignParentBottom="true" - this attribute is the main reason for view like this,it always align any view in bottom even softkeyboard is shown.it contain boolean value,true gives always align bottom and false nothing.
the other relative attribute is android:layout_alignParentRight="true",android:layout_alignParentLeft="true" ,android:layout_alignParentTop="true"-all attribute give feature as written.
Lastly you include this xml file at any java file through setContentView(xmlFileName)

Related

TextView with a single, editable line

I'd like to do textual back-and-forth interaction in an Android control. The idea is to have something like this:
This is some text output by the program.
What is your name? |
with the cursor at | (note that editing doesn't start at the beginning of the last line). The user is then free to enter text (using whatever Android input method, keyboard, etc.) but isn't allowed to change any of the output so far. Ideally, the user's input would be styled differently.
Then, as soon as newline is entered, I want the program to be notified and editing to stopped:
This is some text output by the program.
What is your name? Foo Bar
Hello, Foo Bar!
Note that this needs to be a proper control, i.e. one I can compose with other controls to make it just one part of the app's main layout.
Make a TextView and the EditText next to each other then your problem is solved and add the following line of code in EditText.
android:singleLine= 'true';
It allow only one line to be entered to the EditText. let me know whether this is what your expecting.
<?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">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="What is your Name?"
android:id="#+id/textView"
android:layout_alignParentTop="true"
android:layout_alignParentStart="true" />
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:singleLine="true"
android:id="#+id/editText"
android:layout_alignParentTop="true"
android:layout_toEndOf="#+id/textView" />
</RelativeLayout>
This is some text output by the program.
What is your name? |
with the cursor at | (note that editing doesn't start at the beginning
of the last line). The user is then free to enter text (using whatever
Android input method, keyboard, etc.) but isn't allowed to change any
of the output so far. Ideally, the user's input would be styled
differently.
I would strongly recommend to rethink about your design as the same thing can be done with the help of LinearLayout,Editext,TextView with very simple and more manageable way.
I would suggest you to create a new LinearLayout(TextView + EditText) and assign the background of layout like EditText and edittext's no background.
Upon editText done, you could show a new TextView in the bottom
You need a ListView at top, to show your conversation & then below it, needs a horizontal view with a TextView (to show question) and EditText(with background transparent - to ask user to fill an answer).

Android RelativeLayout strange behaviour

I'm learning the relative layout and wrote a little test layout to simulate a login page:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="match_parent"
android:layout_width="match_parent">
<TextView android:id="#+id/labelUsername"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="username:"
android:layout_centerVertical="true"/>
<EditText android:id="#+id/txtUsername"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:hint="input username here"
android:layout_toRightOf="#id/labelUsername"
android:layout_alignBaseline="#id/labelUsername"/>
<TextView android:id="#+id/labelPassword"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="password:"
android:layout_below="#id/txtUsername"
android:layout_alignParentLeft="true"/>
<EditText android:id="#+id/txtPassword"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:hint="input password here"
android:layout_below="#id/txtUsername"
android:layout_alignLeft="#id/txtUsername"
android:layout_alignBaseline="#id/labelPassword"/>
</RelativeLayout>
What I want is putting the Username Label and Textfield above the Password Label and TextField. But the result is reverted, password are above!
I think the problem is the "android:layout_below" property in labelPassword, if I set it to below labelUsername, it works, however because the textfield is much bigger than label, the both textfields are in this case overlayed. So i try to make the labelPassword below the txtUsername, but it performs strange, I don't understand.
By the way, is there any guideline when I build layout with Relative Layout?
What should I put there at first?
What should I put at last?
thanks!
I think what you are trying to achieve here is trying to get both the username and password fields vertically centered, and the password field below the username field. The error in your layout is that you only tell the username textview and edittext to center vertically, and relative layout centeres the layouts after having arranged them. So your username field is centered, while the password is left on top.
What you should do is tell the parent(RelativeLayout) to vertically center all its child elements.
For that simply remove this attribute from the "username" TextView element :
android:layout_centerVertical="true"
And add this attribute to your RelativeLayout element:
android:gravity="center_vertical" //tells RelativeLayout to vertically center all child elements
In this case i would recommend using a LinearLayout but you can continue using RelativeLayout for now. Hope it helps!
To answer your concrete question, it's because android:layout_centerVertical="true" rule you are applying to labelUsername.
It seems that the relative position doesn't work well, when the elements you are refering to, are centered. And it also doesn't make sense, in this case, because you probably want the whole form centered, not only the username fields and then put the password bellow.
You can put the elements in a containing element (another relative layout, or linear layout, or table layout, etc.) and center that element. That works. Or to center all the contents, you can add android:gravity="center" to the containing layout.
As you go through the different Layouts you will find that while Relative layout feels the most "natural" if you're used to positioning things via CSS, for example (with absolute or relative positions) the situation you're describing here calls for either Linear or Table layout. Table layout is probably your best bet for anything "form" related. Your table elements (columns) should have a layout_span attribute that details how many columns to go across (it's sort of analog to colspan in HTML).
I'm not sure what specifically is going wrong in your RelativeLayout above, and I'm sure that with adequate trial and error you could get it to do roughly what you want, but I strongly advise you to use the right tools for the job.
LinearLayout is also a terrific tool (which you should remember can be nested indefinitely). Give your Layout a weightSum and then each item can have a layout_weight (they should add up to be the sum), while their layout_width should be 0dp (it's not intuitive, but that's how it works). That's also a terrific way to make things sit where they ought to.
Lastly the answer to the correct order in RelativeLayout is that the items are Z ordered from bottom to top, so the later an item appears in the sibling order, the higher its Z order is. Otherwise, their order is irrelevant.

How to make sure specific view is visible when keyboard appears?

I have a layout with a graphic at the top, an EditText in the middle and a button some distance below it, like so:
When the user is typing in the EditText, I want to pan the layout so that the "Go" button is still visible, even if that means clipping the image off the top, like so:
I know about windowSoftInputMode="adjustPan" in the manifest, but that doesn't work because it only pans far enough for the EditText to be visible. Is there a way to make sure it pans until the button is visible too?
For comments with K_Anas, this is my layout. It has all the extra margins and spacing removed compared to the first screenshot, to remove any other source of problems.
<?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">
<View
android:layout_width="300dp"
android:layout_height="150dp"
android:layout_alignParentTop="true"
android:background="#999"/>
<EditText
android:layout_width="280dp"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:hint="Sample..."/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:text="Go"/>
</RelativeLayout>
Spoke with the Android developers hangout, and it doesn't seem like there's an easy way to solve this problem. The consensus seems to be reworking the layout rather than having an API to fix the issue.
did you tried:
android:windowSoftInputMode="adjustResize"
in your activity Tag in Manifest
see these docs on android developer blog
I tried your layout with: android:windowSoftInputMode="stateVisible|adjustResize"
and give me these results:
I'm sure it isn't the BEST way, but couldn't you just change the layout attributes for your button (add/change a margin) and redraw when the edittext is clicked? Use an onClickListener & maybe invalidate your button.

Android Layout Issue

Hi I'm having a daft problem with my android application.
Currently it looks like this:
Is there a way of making the button go to the bottom in the middle? I've tried messing around but same effect. Also tried changing the fill_parent/wrap_content, relative/linear layouts and gravities.
This is the screenshot of the .xml file
many thanks.
There are a couple things you can do to get this, with the relative layout you're using this would work. Add these lines to your button section
android:layout_below="#+id/android:empty"
android:layout_alignParentBottom="true"
android:layout_alignParentCenter="true"
Add these two attributes to your Button
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
and these one to your textview:
android:layout_above="#id/insertion"
android:layout_height="fill_parent"
Read the API reference here:
http://developer.android.com/reference/android/widget/RelativeLayout.LayoutParams.html
May be you want to use a linear layout instead of the relative one...
With the LinearLayout you can place your item without thinking on their relative position.
You can place a vertical linear layout and inside it another layout for the list of reminders.
<LinearLayout android:orientation="vertical">
<ListView android:width="fill_parent"android:weight="2" />
<Button android:width="wrap_content" android:weight="1" />
</LinearLayout>
With weight option, you can choose to make the Button to be painted before the ListView.
EDIT: Reading other answers, I'm considering if you really need a RelativeLayout to place a button under a listview. I think you should learn how to handle simple view before to start using something more complex. If LinearLayout solve your problem, why don't use it? This is a personal observation...

Android - customized keyboard key and action

If you own Android phone you are no doubt have noticed how in the certain apps the keyboard layout can change from the standard issue to digits-only or to have .com or .net special buttons based on the text field input type (e.g. phone number). So I have 2 questions:
how to trigger this customization? I suspect it has to do with EditText format
Can this be taken even further if I want to add some custom buttons to inject a specific pattern? Say I would have an AND button which when pressed will add all uppercase " AND " surrounded by spaces to the text field. Can this be done?
What I'm not asking is how to capture some key combination in onKeyPress event and then populate text field with a pattern - I pretty much know how to do that already.
It is controlled by the android:inputType XML attribute (or the setInputType() method).
For info on the available options see the pages for the XML attribute or the object's method.
As an example, the following XML:
<?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" >
<EditText
android:text="example text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:inputType="phone" />
</LinearLayout>
will give you this layout:
whereas changing the inputType to textEmailAddress will give you this:
You can customize the "action" button as explained here, but I don't believe there's any way to do full customization of keyboards at this time, but I could be wrong.
The thing that concerns me is that "inputType" is listed as a deprecated property, meaning it may work for a while, but - eventually - Android will stop supporting it. Is there another alternative?
UPDATED: My bad - I'm confusing with inputMethod.

Categories

Resources