when i put 2 or 3 TextInputLayout, label seams link graphically to previous editText instead of next. i need to put much marginTop to TextInputLayout. there is any possibility to approach label with EditText?
<android.support.design.widget.TextInputLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<EditText
android:id="#+id/name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="#string/name"
android:inputType="textCapWords" />
</android.support.design.widget.TextInputLayout>
in this example we can see margin from hint and edittext
Changing the paddingTop of the EditText should fix it, for example:
<android.support.design.widget.TextInputLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<EditText
android:id="#+id/name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="0dp"
android:hint="#string/name"
android:inputType="textCapWords" />
</android.support.design.widget.TextInputLayout>
You can definitely add properties to TextInputLayout however you want it to be. Following will help you to add marginTop from exactly above Viewof TextInputLayout
<android.support.design.widget.TextInputLayout
android:layout_width="match_parent"
android:layout_marginTop="20dp"
android:layout_height="wrap_content" >
<EditText
android:id="#+id/name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="#string/name"
android:inputType="textCapWords" />
</android.support.design.widget.TextInputLayout>
Related
I am trying to make AutoCompleteTextView look like this image https://ibb.co/ZJxmgK5 but unable to do the same. The outlined box is not visible in the result
Below is my current code. Earlier I tried adding an EditText in TextInputLayout but now I want to add Autocomplete in this.
<com.google.android.material.textfield.TextInputLayout
android:id="#+id/input_layout_holiday_destination"
style="#style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="#string/lbl_destination_big">
<AutoCompleteTextView
android:id="#+id/edittext_holiday_destination"
style="#style/Base.Widget.AppCompat.EditText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="10"
android:background="#android:color/transparent"
android:hint="#string/lbl_destination"
android:layout_marginLeft="#dimen/margin8"
android:singleLine="true"
android:lines="1"
android:textSize="25sp"
android:nextFocusDown="#+id/txv_holiday_num_of_nights"
android:imeOptions="actionNext"
android:textCursorDrawable="#drawable/edittext_cursor_drawable"/>
/>
</com.google.android.material.textfield.TextInputLayout>
The expected result is the image for which the URL has been given above.
If you would like to have a TextInputLayout in conjuction with an AutoCompleteTextView you should use this style for the TextInputLayout Widget.MaterialComponents.TextInputLayout.*.ExposedDropdownMenu.
In your case:
style="#style/Widget.MaterialComponents.TextInputLayout.OutlinedBox.ExposedDropdownMenu"
Use something like:
<com.google.android.material.textfield.TextInputLayout
android:id="#+id/name_text_input"
style="#style/Widget.MaterialComponents.TextInputLayout.OutlinedBox.ExposedDropdownMenu"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="HINT TEXT">
<AutoCompleteTextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#null"/>
</com.google.android.material.textfield.TextInputLayout>
Check also the doc:
Note: When using an outlined text field with an EditText child that is not a TextInputEditText, make sure to set the EditText's android:background to #null. This allows TextInputLayout to set an outline background on the EditText.
If you would like to avoid the dropdown icon just use the app:endIconMode attribute.
<com.google.android.material.textfield.TextInputLayout
app:endIconMode="none"
...>
Below code solves the problem:
<com.google.android.material.textfield.TextInputLayout
android:id="#+id/input_layout_holiday_destination"
style="#style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="#string/lbl_destination_big">
<androidx.appcompat.widget.AppCompatAutoCompleteTextView
android:id="#+id/edittext_holiday_destination"
style="#style/Widget.MaterialComponents.AutoCompleteTextView.OutlinedBox"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:singleLine="true"
android:lines="1"
android:nextFocusDown="#+id/txv_holiday_num_of_nights"
android:imeOptions="actionNext"
android:textCursorDrawable="#drawable/edittext_cursor_drawable"
/>
</com.google.android.material.textfield.TextInputLayout>
<com.google.android.material.textfield.TextInputLayout
android:id="#+id/input_layout_holiday_destination"
style="#style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<AutoCompleteTextView
android:id="#+id/edittext_holiday_destination"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Destination"
android:layout_weight="10"
android:singleLine="true"
android:lines="1"
android:textSize="25sp"
android:layout_gravity="center_vertical"
android:layout_marginLeft="8dp"
tools:text="Hello" />
/>
</com.google.android.material.textfield.TextInputLayout>
This works. The problem was with the background color that you were setting to the AutoCompleteTextView.
finally my answer is this
<com.google.android.material.textfield.TextInputLayout
android:id="#+id/uomLay"
android:layout_width="0dp"
app:layout_constraintTop_toBottomOf="#id/quantity_lay"
app:layout_constraintStart_toStartOf="#id/start2"
app:layout_constraintEnd_toEndOf="#id/end2"
style="#style/OutlineBoxDropDown"
app:endIconDrawable="#drawable/ic_path_16692"
app:shapeAppearance="#style/Rounded"
app:hintTextAppearance="#style/hintTextAppearence"
android:layout_marginTop="#dimen/_13sdp"
android:layout_height="wrap_content">
<AutoCompleteTextView
android:id="#+id/uom"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fontFamily="#font/graphikregular"
android:hint="UOM"
style="#style/Widget.MaterialComponents.AutoCompleteTextView.OutlinedBox"
android:background="#null"
android:paddingVertical="#dimen/_7sdp"
android:textColor="#color/desc_color"
android:textSize="#dimen/_11ssp"
tools:text="kg" />
</com.google.android.material.textfield.TextInputLayout>
I am currently learning some design on XML. I have a scroll view and I have Several widgets. However, I want to remove space between my Log In and my password, how can I combine them together yet be able to input email and password?
What I want :
enter image description here
what I currently have
enter image description here
Thanks for the help.
So below is my simple code. How can I remove space and have them come together?
<android.support.design.widget.TextInputLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:layout_marginBottom="0dp">
<EditText
android:id="#+id/email"
android:layout_width="match_parent"
android:layout_height="48dp"
android:background="#color/white"
android:hint="Email"
android:inputType="textEmailAddress" />
</android.support.design.widget.TextInputLayout>
<!-- Password Label -->
<android.support.design.widget.TextInputLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="0dp"
android:layout_marginBottom="8dp">
<EditText
android:id="#+id/password"
android:layout_width="match_parent"
android:layout_height="38dp"
android:background="#color/white"
android:hint="Password"
android:inputType="textPassword"
android:textColorHint="#color/black" />
</android.support.design.widget.TextInputLayout>
You can remove extra top spacing by setting app:hintEnabled="false" to TextInputLayout:
<android.support.design.widget.TextInputLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
app:hintEnabled="false"
android:layout_marginBottom="0dp">
.....
It is space left for hint
Try changing the top/bottom margins of the EditText widgets. Like so:
<android.support.design.widget.TextInputLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:layout_marginBottom="0dp">
<EditText
android:id="#+id/email"
android:layout_width="match_parent"
android:layout_height="48dp"
android:background="#color/white"
android:hint="Email"
android:inputType="textEmailAddress"
android:layout_marginBottom="0dp"
/>
</android.support.design.widget.TextInputLayout>
<!-- Password Label -->
<android.support.design.widget.TextInputLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="0dp"
android:layout_marginBottom="8dp">
<EditText
android:id="#+id/password"
android:layout_width="match_parent"
android:layout_height="38dp"
android:background="#color/white"
android:hint="Password"
android:inputType="textPassword"
android:textColorHint="#color/black"
android:layout_marginTop="0dp"
/>
</android.support.design.widget.TextInputLayout>
I would also experiment with the android:padding attribute.
More info: Difference between a View's Padding and Margin
You can put login view and password view into linear layout, and margin_top and margin_bottom = 0
It's not about space between views, it's about view style. So search for style you need your EditText appears
Something like this tutorial
Here's my Activity.xml file. I put the AppCompatEditText inside TextInputLayout. I want the hint to be shown in the html form with superscript text but it just won't happen. All the text is shown as just normal text. Is there a way around?
<android.support.design.widget.TextInputLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="8dp">
<android.support.v7.widget.AppCompatEditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="#string/acceleration_unit_ms2"
android:inputType="numberDecimal"
android:id="#+id/acceleration_unit_ms2"/>
</android.support.design.widget.TextInputLayout>
Strings.xml
<string name="acceleration_unit_ms2">Meter/Second Square (m/s<sup><small>2</small></sup>)</string>
According to efficient performance use TextInputEditText inside TextInputLayout.
<android.support.design.widget.TextInputLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/input_layout_email"
android:layout_marginTop="#dimen/dp_10"
app:hintEnabled="true"
app:hintAnimationEnabled="false">
<android.support.design.widget.TextInputEditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/edit_email"
android:inputType="textEmailAddress"
android:hint="#string/email"
android:textSize="16sp"/>
</android.support.design.widget.TextInputLayout>
I have an Edittext wrapped inside a TextInputLayout. I tried using android:nextFocusForward="#+id/spinnerLanguage" so that i could gain the focus of the spinner. This doesn't work. I even tried using android:nextFocusUp and this method does not seem to work
<android.support.design.widget.TextInputLayout
android:id="#+id/txtEmailAddressWrapper"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text=""
android:hint="EMAIL ADDRESS"
android:padding="5dp"
android:id="#+id/txtEmailAddress"
android:nextFocusForward="#+id/spinnerLanguage"
android:inputType="text"
android:maxLength="40" />
</android.support.design.widget.TextInputLayout>
<fr.ganfra.materialspinner.MaterialSpinner
android:id="#+id/spinnerLanguage"
android:layout_width="match_parent"
app:ms_floatingLabelColor="#color/colorAccent"
android:layout_height="wrap_content"
app:ms_enableFloatingLabel="true"
app:ms_hint="LANGUAGE" />
try with this
txtEmailAddress.setFocusableInTouchMode(true);
or
txtEmailAddress.setFocusable(false);
and use this to clear focous
txtEmailAddress.clearFocus();
or use this in xml
android:focusable="true"
android:focusableInTouchMode="true"
may be this will help you
I'm using Support Design Library. I created EditText but when I'm writting something there is some blue underline of edit text like in the picture below
Here is my code:
<android.support.design.widget.TextInputLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Test"
android:inputType="none"
android:singleLine="true" />
</android.support.design.widget.TextInputLayout>
How to fix that?
It seems autocomplete/suggestions are open. Try this:
<android.support.design.widget.TextInputLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Test"
android:inputType="textNoSuggestions"
android:singleLine="true" />
</android.support.design.widget.TextInputLayout>