How can we embed an input text with a TextView in Android?
For example, I want to implement this:
"Your Name is ___ , This is the Level ____"
The "___" is the blank space which the user must fill with a specified input and I'll check it for validation.
Please note that it is different from android:hint.
How can I implement this?
You could make a fill in the blanks type format using constant text inside EditText. Do this by creating an EditText in XML.
<EditText
android:id="#+id/editText"
android:layout_height="wrap_content"
android:layout_width="match_parent"/>
In your Java class add the following code:
final EditText edittext = (EditText) findViewById(R.id.editText);
edittext.setText("Something ");
Selection.setSelection(edittext.getText(), edittext.getText().length());
edittext.addTextChangedListener(new TextWatcher() {
#Override
public void onTextChanged(CharSequence s, int start, int before, int count) {
// TODO Auto-generated method stub
}
#Override
public void beforeTextChanged(CharSequence s, int start, int count, int after) {
// TODO Auto-generated method stub
}
#Override
public void afterTextChanged(Editable s) { if(!s.toString().contains("Something ")){
edittext.setText("Something ");
Selection.setSelection(edittext.getText(), edittext.getText().length());
}
}
});
This is output of the code. Here the string Something is static and cannot be removed.
You could hide the underline in Edittext using android:background="#android:color/transparent". I would also recommend you to disable enter in the EditText by using the code:
<EditText
android:id="#+id/editText"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:maxLines="1" <----- add this
android:inputType="text"/> <------ and this to disable enter in edittext
You can try like this
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
android:layout_width="wrap_content"
android:layout_height="30dp"
android:textSize="16sp"
android:textColor="#000000"
android:text="Your Name is"
android:id="#+id/textview1" />
<EditText
android:layout_width="60dp"
android:textSize="16sp"
android:layout_height="40dp"
android:textColor="#000000"
android:id="#+id/edittext1"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="30dp"
android:textSize="16sp"
android:textColor="#000000"
android:text=", This is the Level"
android:id="#+id/textview2" />
<EditText
android:layout_width="60dp"
android:textSize="16sp"
android:layout_height="40dp"
android:textColor="#000000"
android:id="#+id/edittext2"/>
</LinearLayout>
Related
I have a layout where i have 4 circular edittext to enter PIN.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="horizontal">
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/four_pin_background"
android:inputType="number"
android:textAlignment="center"
android:maxLength="1"
android:imeOptions="actionNext"
android:cursorVisible="false"/>
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/four_pin_background"
android:inputType="number"
android:textAlignment="center"
android:maxLength="1"
android:imeOptions="actionNext"
android:cursorVisible="false"/>
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/four_pin_background"
android:inputType="number"
android:textAlignment="center"
android:maxLength="1"
android:imeOptions="actionNext"
android:cursorVisible="false"/>
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/four_pin_background"
android:inputType="number"
android:textAlignment="center"
android:maxLength="1"
android:imeOptions="actionNext"
android:cursorVisible="false"/>
</LinearLayout>
I want like after entering number for first edittext, it should automatically move to next edittext.
Now after tapping on next edittext or after tapping on next button from soft keyboard only i am able to enter number.
Can anyone please help me how to do this?
Follow these steps it will give you your desired result :-
Update your XML with ids in EditTexts like this :-
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="horizontal">
<EditText
android:id ="#+id/firstET"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/four_pin_background"
android:inputType="number"
android:textAlignment="center"
android:maxLength="1"
android:imeOptions="actionNext"
android:cursorVisible="false"/>
<EditText
android:id ="#+id/secondET"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/four_pin_background"
android:inputType="number"
android:textAlignment="center"
android:maxLength="1"
android:imeOptions="actionNext"
android:cursorVisible="false"/>
</LinearLayout>
Then inside your JAVA Code ,
Take Reference of these EditTexts , and add this code inside your onCreate() method of your Activity like :-
EditText firstET , secondET;
firstET = (EditText) findViewByID(R.id.firstET);
secondET = (EditText) findViewByID(R.id. secondET);
firstET.addTextChangedListener(new TextWatcher() {
#Override
public void afterTextChanged(Editable s) {
// TODO Auto-generated method stub
}
#Override
public void beforeTextChanged(CharSequence s, int start, int count, int after) {
// TODO Auto-generated method stub
}
#Override
public void onTextChanged(CharSequence s, int start, int before, int count) {
// add a condition to check length here - you can give here length according to your requirement to go to next EditTexts.
if(firstET.getText().toString().trim().length() >2){
firstET.clearFocus();
firstET.requestFocus();
}
}
});
Attach a TextWatcher
Check for needed length of editText input and focus next.
editText.addTextChangedListener(new TextWatcher() {
#Override
public void afterTextChanged(Editable s) {
if (s.length() == PIN_LENGTH) {
focusNext();
}
}
});
You need to use addTextChangedListener
Adds a TextWatcher to the list of those whose methods are called whenever this EditText's text changes.
Sample Code
editText.addTextChangedListener(new TextWatcher() {
#Override
public void beforeTextChanged(CharSequence charSequence, int i, int i1, int i2) {
// specify length of your editext here to move on next edittext
if(editText.getText().toString().trim().length()>=1){
NexteditText.requestFocus();
}
}
#Override
public void onTextChanged(CharSequence charSequence, int i, int i1, int i2) {
}
#Override
public void afterTextChanged(Editable editable) {
}
});
How to add icon hint edittext in center
I have no idea to set that
and in xml file is not have android:drawbleCenter
How to create it
thanks for your help ;)
Unfortunately you can not set drawable at the center of the EditText like this, Alternatively, you can use background image which includes your hint + image what ever you display and inside,
Try below example.
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="15dp"
android:layout_marginRight="15dp"
android:background="#android:drawable/editbox_background"
android:gravity="center">
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#null"
android:drawableLeft="#android:drawable/ic_menu_search"
android:gravity="center"
android:hint="Search" />
</RelativeLayout>
You can achieve this type of view using above XML code
Add android:gravity="center_horizontal" to EditText
I have a solution
This is xml:
<FrameLayout
android:layout_width="match_parent"
android:layout_height="50dp">
<EditText
android:id="#+id/edt_search"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<TextView
android:id="#+id/text_icon"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:drawableLeft="#android:drawable/ic_menu_search"
android:drawablePadding="8dp"
android:layout_gravity="center_horizontal"
android:gravity="center_vertical"
android:text="Search"
android:textColor="#969696" />
</FrameLayout>
in onCreate()
edtSearch.addTextChangedListener(new TextWatcher() {
#Override
public void beforeTextChanged(CharSequence s, int start, int count, int after) {
}
#Override
public void onTextChanged(CharSequence s, int start, int before, int count) {
textIcon.setVisibility(View.GONE);
}
#Override
public void afterTextChanged(Editable s) {
textIcon.setVisibility(s.length() == 0 ? View.VISIBLE : View.GONE);
}
});
Try it!
I have an EditText used for a description.
Below it, I have a TextView showing the number of characters inputted in the EditText.
Example:
The user should be able to see the live character count during the input, but at this moment the characted counter is hidden by the keyboard:
What can I do to correct that ?
Here is my xml code:
<EditText
android:id="#+id/MyDescription"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#null"
android:maxLength="500"
android:hint="Description" />
<TextView
android:id="#+id/MyDescriptionCharCount"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="0/500"
android:layout_below="#id/MyDescription"
android:layout_marginTop="5dp"
android:layout_marginRight="3dp"
android:layout_marginEnd="3dp"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true" />
The parent is a RelativeLayout.
You have to extend the class with TextWatcher and override afterTextChanged(),beforeTextChanged(), onTextChanged().
EditText MyDescription = (EditText)findViewById(R.id. MyDescription);
MyDescription.addTextChangedListener(new TextWatcher() {
#Override
public void afterTextChanged(Editable s) {
// TODO Auto-generated method stub
}
#Override
public void beforeTextChanged(CharSequence s, int start, int count, int after) {
// TODO Auto-generated method stub
}
#Override
public void onTextChanged(CharSequence s, int start, int before, int count) {
// s.toString().trim().length();
}
});
You can try the following layout.
<RelativeLayout
android:id="#+id/bottom_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true">
<EditText
android:id="#+id/edit_text"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_marginLeft="16dp"
android:background="#android:color/transparent"
android:inputType="textNoSuggestions|textMultiLine"
android:maxLength="200"
android:paddingBottom="8dp"
android:paddingRight="5dp"
android:paddingTop="8dp"
android:textColor="#202020"
android:textColorHint="#979797"
android:textSize="14sp"/>
<TextView
android:id="#+id/charecter_count"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/add_comment_edit_text"
android:layout_gravity="bottom"
android:layout_marginBottom="8dp"
android:layout_marginLeft="16dp"
android:layout_marginTop="8dp"
android:gravity="bottom"
android:text="0/200"
android:textColor="#979797"
android:textSize="14sp"/>
</RelativeLayout>
To see Textview of character counter, add below line in activity tag of manifest file.
android:windowSoftInputMode="adjustResize|stateAlwaysHidden"
This will automatically move your activity layout up to fix in available height after adding soft input keyboard.For more detail about this check here.
I am completely new in android but I thought I at lease learnt how to write simple code to have contents from EditText appear in the TextView. But seems like not. Can anyone help? Thank you in advance. Here is my code.
detailsActivity.java
public class DetailsActivity extends ActionBarActivity {
EditText etTop;
TextView tvTop;
String cTop;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.details_activity);
//imageUri = Uri.parse(extras.getString("imageUri"));
Bitmap bitmap = getIntent().getParcelableExtra("id");
ImageView imageView = (ImageView) findViewById(R.id.image);
imageView.setImageBitmap(bitmap);
etTop = (EditText) findViewById(R.id.etTop);
tvTop = (TextView) findViewById(R.id.tvBottom);
cTop = etTop.getText().toString();
tvTop.setText(cTop);
}
}
details_activity.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:orientation="vertical"
android:background="#b72828">
<ImageView
android:id="#+id/image"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="fitCenter" />
<EditText
android:layout_width="match_parent"
android:layout_height="80dp"
android:id="#+id/etTop"
android:hint="Enter Top Text"
android:textColor="#color/white"
android:clickable="true"
android:gravity="center"
android:inputType="textCapWords"
android:maxLines="2"
android:textColorHint="#fdfdfd"
android:textSize="30dp"
android:textStyle="bold" />
<TextView
android:layout_width="fill_parent"
android:layout_height="30dp"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text=""
android:id="#+id/tvBottom"
android:layout_above="#+id/etBottom"
android:layout_centerHorizontal="true" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Create"
android:id="#+id/cButton"
android:layout_gravity="center_horizontal|bottom"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:clickable="false" />
<EditText
android:layout_width="match_parent"
android:layout_height="80dp"
android:id="#+id/etBottom"
android:hint="Enter Bottom Text"
android:textColor="#color/white"
android:layout_gravity="center_horizontal"
android:clickable="true"
android:gravity="center"
android:inputType="textCapWords"
android:maxLines="2"
android:textColorHint="#fdfdfd"
android:textSize="30dp"
android:textStyle="bold"
android:layout_above="#+id/cButton"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
<TextView
android:layout_width="fill_parent"
android:layout_height="30dp"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text=""
android:id="#+id/tvTop"
android:layout_below="#+id/etTop"
android:layout_centerHorizontal="true" />
</RelativeLayout>
Reason:
cTop = etTop.getText().toString();
tvTop.setText(cTop);
gets executed as soon as activity is created. By this time you don't get any chance to enter any text in EditText. When yo do, this code has been already executed. So you need to get the text from EditText and set it into TextView when you actually enter the text.
Solution:
Remove above mentioned two lines of code and add this
etTop.addTextChangedListener(new TextWatcher() {
public void afterTextChanged(Editable s) {
tvTop.setText(s.toString());
}
public void beforeTextChanged(CharSequence s, int start,int count, int after) {}
public void onTextChanged(CharSequence s, int start,int before, int count) {}
});
Now every time you will change the text in EditText, TextView will be update automatically.
try doing this:
etTop.addTextChangedListener(new TextWatcher() {
#Override
public void beforeTextChanged(CharSequence s, int start, int count, int after) {
}
#Override
public void onTextChanged(CharSequence s, int start, int before, int count) {
tvTop.setText(s);
}
#Override
public void afterTextChanged(Editable s) {
//.. Or set it here if this is desired behavior
}
});
Your code doesn't listen for changes to the EditText instead your code is saying, go get me the text right now, instead of listening for text being added into the edit text.
So having said that drop these lines:
cTop = etTop.getText().toString();
tvTop.setText(cTop);
and add the above snippet of code in its place.
Good Luck and Happy Coding!
I have an EditText with inputType set to textPassword.
I want that the input will be numbers from left to right but I want to align the hint to the right of the EditText.
When I tried gravity=right it looked okay but when a user clicks on the EditText the cursor is at the most left location and he can't delete the text. If he wants to delete the text he needs to place the cursor at the most right location.
Any idea how I can enjoy both worlds?
Use EditText with inputType=textPassword, hint aligned to the right and insert numbers from left to right?
Note: It appears to be a bug in the Android framework, when using android:inputType="textPassword": https://code.google.com/p/android/issues/detail?id=201471
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="textPassword"
android:ems="10"
android:id="#+id/txt_password"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true"
android:hint="סיסמא"
android:gravity="right" />
Thanks
The EditText is built to align the hint text the same as the user-entered text. The way I have accomplished this, by placing both images and text to the right side of an EditText, is just to define another view that is aligned to the right of it.
You need to have the parent view be a RelativeLayout to do this, but it works well:
<EditText android:id="#+id/test"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<TextView android:id="#+id/hint"
android:text="Something"
android:layout_alignRight="#id/test"
android:layout_alignBottom="#id/test"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
I want to complete #Greg Ennis
I hope this can help you
I use a EditText for password and a TextView for it's hint like below:
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<EditText
android:id="#+id/password"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:background="#color/white"
android:inputType="textPassword"
android:padding="10dp"
android:singleLine="true"
android:textColor="#color/input_login"
android:textColorHint="#color/input_login_hint"
/>
<TextView android:id="#+id/hint"
android:hint="#string/hint_password"
android:background="#color/white"
android:textColorHint="#color/input_login_hint"
android:padding="10dp"
android:singleLine="true"
android:layout_alignRight="#id/password"
android:layout_alignTop="#id/password"
android:textSize="17dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/password"
/>
</RelativeLayout>
and I write following code in onCreate method to hide hint TextView when enter password:
EditText edtPassword;
TextView txtHint;
edtPassword = (EditText) findViewById(R.id.password);
txtHint = (TextView) findViewById(R.id.hint);
edtPassword.addTextChangedListener(new TextWatcher() {
#Override
public void beforeTextChanged(CharSequence s, int start, int count, int after) {
}
#Override
public void onTextChanged(CharSequence s, int start, int before, int count) {
String enterPass = edtPassword.getText().toString();
if(start == 0){
txtHint.setHint(R.string.hint_password);
}else {
txtHint.setHint("");
}
}
#Override
public void afterTextChanged(Editable s) {
}
});