I am trying to make mandatory field with the use of TextInputLayout. I used Spannable class but display the hint of TextInputLayout in single color.I want my view to look something like in below link.
https://material.io/guidelines/components/text-fields.html#text-fields-search-filter
I have created the following TextInputEditText to look as similar as possible to the Material Design Text Field.
XML Layout
<android.support.design.widget.TextInputLayout
android:id="#+id/etlayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:counterEnabled="true"
app:counterMaxLength="25">
<android.support.design.widget.TextInputEditText
android:id="#+id/et"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="16dp"
android:layout_marginLeft="-4dp"
android:layout_marginStart="-4dp"
android:layout_marginTop="8dp"
android:textSize="16sp"
android:inputType="text|textCapSentences"
android:singleLine="true"
android:hint="#string/title"
android:textColorHint="#color/transparent38"/>
</android.support.design.widget.TextInputLayout>
Color
<color name="transparent38">#66000000</color>
Java
etlayout = (TextInputLayout)findviewbyid(R.id.etlayout);
TextWatcher twTitle = new TextWatcher() { //Analyzes when the view changes
#Override
public void beforeTextChanged(CharSequence s, int start, int count, int after) {
}
#Override
public void onTextChanged(CharSequence s, int start, int before, int count) {
if (true) { //Replace condition with validity test
etlayout.setErrorEnabled(false); //Removes the extra space
etlayout.setError(null); //Removes the error message
} else { //If the text is not valid
etlayout.setErrorEnabled(true); //Makes the space for the error appear
etlayout.setError("Invalid input"); //Shows a message
}
}
#Override
public void afterTextChanged(Editable s) {
}
};
etTitle.addTextChangedListener(twTitle);
Related
I have two TextView side by side in a LinearLayout horizontally
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView
android:id="#+id/Tx1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Message" />
<TextView
android:id="#+id/Tx2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Time" />
</LinearLayout>
i want when Tx1 text length is fill the line Tx2 go to next line
when now we add to length of the Tx1 , Tx2 is going outside of the view.
how i can fix it?
You most likely will have to do something programmatically with the orientation using a TextWatcher:
yourEditText.addTextChangedListener(new TextWatcher() {
public void afterTextChanged(Editable s) {
}
public void beforeTextChanged(CharSequence s, int start, int count, int after) {}
public void onTextChanged(CharSequence s, int start, int before, int count) {
// You would have to define what your max length is.
if(count > maxLength){
myLinearLayout.setOrientation(LinearLayout.VERTICAL);
}
}
});
EditText goalName is set with maxLength 30 by InputFilter (java), android:maxLength="30"(xml declaration).
But after 30th letter, letters are not showing in field but clipboard(keyboard suggestion) is showing all letters. And I am showing below how many characters left where its showing 0 characters left after 30th letter.but i have to delete all those extra chars by pressing backspace.when its coming to 30th letter it starts to show 1 char left ...etc..
final InputFilter ip = new InputFilter.LengthFilter(30);
goalName.setFilters(new InputFilter[]{ip});
/*To find no of Characters Left for Goal Name*/
goalName.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) {
noOfChar.setText((30 - s.length()) + " characters left");
}
#Override
public void afterTextChanged(Editable s) {
}
});
It will be better if you move in new design of android without taking load of edittext.
<android.support.design.widget.TextInputLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:counterEnabled="true"
app:counterMaxLength="30"
app:counterTextAppearance="#style/TextLimitStyle">
<android.support.design.widget.TextInputEditText
android:id="#+id/etMessage"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="top"
android:hint="Say something..."
android:maxLength="30" />
</android.support.design.widget.TextInputLayout>
Try to do this:
#Override
public void onTextChanged(CharSequence s, int start, int before, int count) {
if(s.length() > 30) s = s.subSequence(0,30);
goalName.requestFocus(30);
noOfChar.setText((30 - s.length()) + " characters left");
}
Just test because maybe it should finish in 29 not 30, I'm not sure about this part
And try to remove the filter:
//final InputFilter ip = new InputFilter.LengthFilter(30);
//goalName.setFilters(new InputFilter[]{ip});
let just the Xml declaration:
android:inputType="textPersonName"
android:maxLength="30"
android:maxLines="1"
When I used android:maxLength with android:inputType="textMultiline" I ran into the same issue where my EditText wasn't respecting the character limit. I found that using an InputFilter/LengthFilter helped make this work.
Example usage in Kotlin:
val MAX_CHARS_LENGTH: Int = ...
val myEditText: EditText = ...
myEditText.filters = arrayOf(LengthFilter(MAX_CHARS_LENGTH))
For the character count display, I'd recommend overriding afterTextChanged instead of onTextChanged
android:maxLength="30"
Put this in your EditText in the layout file
Like this
<EditText
android:id="#+id/msg"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="10dip"
android:layout_marginRight="10dip"
android:layout_marginTop="10dip"
android:background="#drawable/edit_textbox_new_background"
android:gravity="top"
android:inputType="textMultiLine"
android:lines="5"
android:maxLength="500"
android:padding="10dip" />
I am trying to build a first simple app for calculating tips and having trouble.
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="number"
android:id="#+id/editCurrent"
android:layout_row="0"
android:layout_column="0"
android:ems="10"
android:gravity="center_horizontal"
android:layout_columnSpan="2"
android:padding="16dp"
android:maxLength="6"
android:hint="Enter the Amount"
/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/showCurrent"
android:padding="16dp"
android:layout_row="0"
android:layout_column="0"
android:layout_columnSpan="2"
android:gravity="center_horizontal"
/>
and for MainActivity
private final TextWatcher editCurrentWatcher = 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) {
try {
bill = Double.parseDouble(s.toString()) / 100;
showCurrent.setText(currencyFormat.format(bill));
calculate();
}
catch (NumberFormatException e){
showCurrent.setText("");
bill = 0.0;
}
calculate();
}
#Override
public void afterTextChanged(Editable s) {
}
};
I have a TextView and a EditText, both overlapping each other. One is for putting a bill amount and the other is for displaying that number in number format.
For example, if I put 100 in edit text, it should display $1.00 and actually it does. But the problem is that since there are two text views, both displays the number and as a result, two views are overlapping each other blocking each view.
How do I hide a number of edit text but still be able to use the edit view?
you can try to set it's color to transparent so it's not visible anymore
You can save the value inside of the edit text in a temp variable and clear the editText and fill the TextView with the value.
Why do you want to use two separate view elements for the same value? If the user enter '1000' you can process it and reset the value to '$1,000.00' (or what you want...)
I have been create an edittext in my xml file.HEre is my code:
<EditText
android:id="#+id/IpAdress"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:inputType="numberDecimal"
android:digits="0123456789.," />
The problem is that in my output project it will work only one of the. Only dot or only comma. What is wrong ? In simulator works fine, only in my release doesnt.
I solved my problem with different android : inputType.
<EditText
android:id="#+id/IpAdress"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:inputType="number"
android:digits="0123456789.-,+" />
It works
You may add a textChangedListener to the editText
<editText variable>.addTextChangedListener(new TextWatcher() {
public void afterTextChanged(Editable s) {}
public void beforeTextChanged(CharSequence s, int start,
int count, int after) {
}
public void onTextChanged(CharSequence s, int start,
int before, int count) {
String s = <editText variable>.getText().toString();
if(/*your rules here*/)
/* modify your string s*/;
<editText variable>.setText(s);
}
});
So I have a fragment with an EditText as well as a floating hint. The thing is when I start the fragment and the EditText already has a value the floating hint covers the text for a brief moment before the hint starts floating. How do I make it so the floating hints starts floating when I start the fragment instead of covering the text?
The picture is what the EditText looks like when the hint is covering the text
Edit:
Okay looks like the way I worded the question is a little confusing.
So I have a RecyclerView that is a list and when a list item is pressed it starts this fragment (First image from http://imgur.com/a/tdjQv Let's call it infoFragment). The user enters a title and details into the infoFragment and the data is saved. Now whenever the user goes back to that same infoFragment the data they entered before should already be there like the second image in the imgur album. The info is saved but when the infoFragment is started for just a second the UI looks like the third image in the imager album for a split second then it looks like like the second image.
Here's my layout xml for the fragment:
mExercise is an object from a class that holds values for title and details
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:focusable="true"
android:focusableInTouchMode="true">
<include
android:id="#+id/toolbar"
layout="#layout/toolbar">
</include>
<android.support.design.widget.TextInputLayout
android:id="#+id/title_textInput"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp">
<EditText
android:id="#+id/exercise_title"
style="#style/Widget.AppCompat.EditText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Title"
/>
</android.support.design.widget.TextInputLayout>
<android.support.design.widget.TextInputLayout
android:id="#+id/details_textInput"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp">
<EditText
android:id="#+id/exercise_details"
style="#style/Widget.AppCompat.EditText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Details"/>
</android.support.design.widget.TextInputLayout>
</LinearLayout>
Here's the onCreateView method of my fragment:
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup parent, Bundle savedInstanceState) {
View v = inflater.inflate(R.layout.fragment_exercise, parent, false);
mToolbar = (Toolbar)v.findViewById(R.id.toolbar);
((AppCompatActivity)getActivity()).setSupportActionBar(mToolbar);
((AppCompatActivity)getActivity()).getSupportActionBar().setTitle(" ");
mTitleField = (EditText)v.findViewById(R.id.exercise_title);
if(mExercise.getTitle() != null) {
mTitleField.setText(mExercise.getTitle());
}
mTitleField.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) {
mExercise.setTitle(s.toString());
}
#Override
public void afterTextChanged(Editable s) {
}
});
mDescriptionField = (EditText)v.findViewById(R.id.exercise_details);
if(mExercise.getDetails() != null) {
mDescriptionField.setText(mExercise.getDetails());
}
mDescriptionField.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) {
mExercise.setDetails(s.toString());
}
#Override
public void afterTextChanged(Editable s) {
}
});
return v;
}
Try setting android:hint on the TextInputLayout rather than the EditText
<android.support.design.widget.TextInputLayout
android:id="#+id/title_textInput"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:hint="Title">
<EditText
android:id="#+id/exercise_title"
style="#style/Widget.AppCompat.EditText"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
</android.support.design.widget.TextInputLayout>
Should be fixed for compile 'com.android.support:design:23.0.1'