I have a specific implementation of error handling in edit texts. Is there any way i could achieve something like shown below.
I managed to achieve almost similar result. Only part remaining is the validator.
Any help would be appretiated
Edit 1: Attaching code for to help.
<android.support.design.widget.TextInputLayout
style="#style/FrameTextLayout"
android:layout_width="match_parent"
app:theme="#style/GreyHighlight">
<android.support.design.widget.TextInputEditText
android:id="#+id/fragment_sign_up_one.text_email"
style="#style/FrameEditText"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:hint="#string/email"
android:inputType="textEmailAddress" />
</android.support.design.widget.TextInputLayout>
Values in values\styles.xml
<style name="GreyHighlight" parent="AppThemeNoAction">
<item name="colorControlNormal">#color/colorHeather</item>
<item name="colorControlActivated">#color/colorHeather</item>
<item name="textColorError">#color/colorHeather</item>
</style>
<style name="FrameTextLayout">
<item name="android:background">#drawable/border_background</item>
<item name="android:paddingTop">8dp</item>
<item name="android:layout_height">53dp</item>
<item name="android:layout_marginTop">16dp</item>
</style>
<style name="FrameEditText">
<item name="android:background">#android:color/transparent</item>
<item name="android:maxLines">1</item>
<item name="android:textSize">16.7sp</item>
<item name="android:textColor">#color/colorDarkIndigo</item>
<item name="android:paddingBottom">8dp</item>
<item name="android:paddingLeft">16dp</item>
<item name="android:paddingRight">16dp</item>
<item name="android:paddingTop">8dp</item>
</style>
Also on the sidenote how do we centre hint inside a TextInputLayout. Example attached.
Currently,
Edit 2: Managed to center hint by disabling hint when not in focus by using app:hintEnabled="false" on TextInputLayout.
So i ended up creating a custom view that fulfilled what i needed.
If anyone is interested I created a library for it.
CustomFormViews
Related
I have one button and letterspacing is not working with it. Please check my following snippet code
<style name="ButtonText_v2" parent="TextAppearance.AppCompat">
<item name="fontFamily">#font/silka_regular</item>
<item name="android:letterSpacing">0.1</item>
<item name="android:textSize">#dimen/dimen_14dp</item>
</style>
<style name="PrimaryButton_v2" parent="Widget.AppCompat.Button">
<item name="android:background">#drawable/button_selector_primary</item>
<item name="android:textColor">#color/white</item>
<item name="textAllCaps">true</item>
<item name="textAppearance">#style/ButtonText_v2</item>
</style>
layout.xml File
<Button
android:text="Button"
android:layout_height="56dp"
android:layout_width="200dp"
style="#style/PrimaryButton_v2"
android:layout_margin="15dp"
/>
You can't apply letter spacing in button/custom button because their is some limitation in button component in which you can't make text appearance and background customization and more limitation
the solution for this is instead of button you can use text view and make custom text view it will also work similar to button and customize it according to requirement.
for example :-
https://stackoverflow.com/questions/9477336/how-to-make-a-custom-textview#:~:text=Create%20a%20Custom%20View%20for%20Textview.%20Make%20the,values%20Make%20entries%20of%20all%20fonts%20in%20strings.xml
Add android:letterSpacing in PrimaryButton_v2 it will work perfectly.
<style name="ButtonText_v2" parent="TextAppearance.AppCompat">
<item name="fontFamily">#font/silka_regular</item>
<item name="android:textSize">#dimen/dimen_14dp</item>
</style>
<style name="PrimaryButton_v2" parent="Widget.AppCompat.Button">
<item name="android:background">#drawable/button_selector_primary</item>
<item name="android:textColor">#color/white</item>
<item name="textAllCaps">true</item>
<item name="textAppearance">#style/ButtonText_v2</item>
<item name="android:letterSpacing">0.1</item>
</style>
layout.xml File
<Button
android:text="Button"
android:layout_height="56dp"
android:layout_width="200dp"
style="#style/PrimaryButton_v2"
android:layout_margin="15dp"
/>
I have Text Field with some styles applyed to change the background aspect.
For some reason the input text when writing is cut off.
One solution i found was to increase the overall height, but i would like to keep the 50dp height
The Text Field:
<com.google.android.material.textfield.TextInputLayout
android:id="#+id/add_description_layout"
style="#style/OutlinedRoundedBox"
android:layout_width="320dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:hint="#string/add_trans_description_title"
android:layout_marginTop="18dp">
<com.google.android.material.textfield.TextInputEditText
android:id="#+id/add_description_input"
android:layout_width="match_parent"
android:layout_height="50dp"
android:inputType="textAutoComplete"
android:textCursorDrawable="#null" />
</com.google.android.material.textfield.TextInputLayout>
The styles i am using on the text field:
<style name="OutlinedRoundedBox" parent="Widget.MaterialComponents.TextInputLayout.OutlinedBox">
<item name="shapeAppearanceOverlay">
#style/ShapeAppearanceOverlay.MyApp.TextInputLayout.Rounded
</item>
<item name="boxBackgroundColor">#color/secondaryColor</item>
<item name="boxStrokeWidth">0dp</item>
<item name="boxStrokeColor">#color/secondaryDarkColor</item>
<item name="android:textColorHint">#color/backgroundText</item>
<item name="android:textColor">#color/backgroundText</item>
<item name="hintTextColor">#color/backgroundText</item>
<item name="hintTextAppearance">#style/TextInputLayoutHintText</item>
<item name="helperTextTextAppearance">#style/TextInputLayoutHelperText</item>
<item name="android:theme">#style/ThemeOverlay.TextInputEditText.OutlinedBox.CustomFont</item>
</style>
<style name="ThemeOverlay.TextInputEditText.OutlinedBox.CustomFont" parent="ThemeOverlay.MaterialComponents.TextInputEditText.OutlinedBox">
<item name="editTextStyle">#style/TextInputEditText.OutlinedBox.CustomFont</item>
</style>
<style name="TextInputEditText.OutlinedBox.CustomFont" parent="Widget.MaterialComponents.TextInputEditText.OutlinedBox">
<item name="android:fontFamily">#font/fira_sans</item>
</style>
<style name="TextInputLayoutHintText" parent="TextAppearance.Design.Hint">
<item name="android:fontFamily">#font/fira_sans</item>
</style>
<style name="TextInputLayoutHelperText" parent="TextAppearance.Design.HelperText">
<item name="android:fontFamily">#font/fira_sans</item>
</style>
<style name="ShapeAppearanceOverlay.MyApp.TextInputLayout.Rounded" parent="">
<item name="cornerFamily">rounded</item>
<item name="cornerSize">32dp</item>
</style>
Current aspect:
Is there a way around this?
Thanks in advance
I think this is to be expected. By default android uses 14sp text size and the height you specified might not be enough for the text size. You can try using small text size with attribute android:textSize for TextInputEditText
I was working on a design that requires all views has an alignment to left.
I'm using TextInputLayout && TextInputEditText there was spaces for hint & text that are solved by setting padding to 0dp for TextInputEditText but, I'm stuck in removing padding/margin start for the bottom line of TextInputEditText.
so, can anyone help me with that simple issues, please?
actual, what I need to do is remove the space at the start of TextInputEditText so bottom line be aligned to left like E
this is my XML
<com.google.android.material.textfield.TextInputLayout
android:id="#+id/email"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="#dimen/_5sdp"
android:paddingBottom="#dimen/_5sdp"
app:endIconDrawable="#mipmap/clear_email"
app:endIconMode="clear_text"
app:endIconTint="#color/grey"
app:errorEnabled="true"
app:hintEnabled="false">
<com.google.android.material.textfield.TextInputEditText
android:id="#+id/test"
style="#style/TILStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fontFamily="#font/opensans_regular"
android:hint="#string/enter_email_address"
android:importantForAutofill="no"
android:inputType="textEmailAddress"
android:theme="#style/Theme.App.Base"
app:hintTextAppearance="#style/TextLabel" />
</com.google.android.material.textfield.TextInputLayout>
for the styles used:
TILStyle
<style name="TILStyle">
<item name="android:lines">1</item>
<item name="android:singleLine">true</item>
<item name="android:gravity">start</item>
<item name="android:textAlignment">viewStart</item>
<item name="android:paddingEnd">0dp</item>
<item name="android:paddingStart">0dp</item>
<item name="android:paddingBottom">#dimen/_12sdp</item>
</style>
Theme.App.Base
<style name="Theme.App.Base" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="colorControlNormal">#color/grey_line</item>
<item name="colorControlActivated">#color/grey_line</item>
<item name="colorControlHighlight">#color/grey_line</item>
</style>
TextLabel
<style name="TextLabel" parent="TextAppearance.Design.Hint">
<item name="android:textSize">16sp</item>
<item name="android:paddingBottom">#dimen/_18sdp</item>
</style>
after long of search and debugging, I found that the issue in these two lines
<item name="android:paddingEnd">0dp</item>
<item name="android:paddingStart">0dp</item>
after deleting them it's solved.
it looks like that there is a default value for it, but I don't know how much are they but, that solved my issue.
if anyone knows the default values please leave a comment.
I am trying to get my time picker to look like this:
The desired outcome
So I am doing what I found on This guide
And this is what I actually get:The true outcome
This is my custom style:
<style name="customTimePicker" parent="#android:style/Widget.Material.TimePicker">
<item name="android:timePickerMode">clock</item>
<item name="android:headerBackground">#0076a3</item>
<item name="android:numbersTextColor">#ffffff</item>
<item name="android:numbersInnerTextColor">#ffffff</item>
<item name="android:numbersSelectorColor">#fbc014</item>
<item name="android:numbersBackgroundColor">#004a80</item>
<item name="android:amPmTextColor">#ffffff</item>
</style>
And this is how I use it in my XML file:
<TimePicker
android:id="#+id/tpAnalog"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:theme="#style/customTimePicker"
style="#style/customTimePicker"
android:visibility="visible"/>
On the preview screen on the android studio, it looks almost like I want preview on Android studio
So why when I ran it on my device this is not working?
Edit: I forgot to use this line of code on my activity theme:
<item name="android:timePickerStyle">#style/customTimePicker</item>
It seems to solve all my issues except that I still can't change the text color of the selected number. This is the text I want to change. Is that possible?
<style name="MyAppTheme" parent="Theme.AppCompat.Light">
<item name="colorAccent">#ff6d00</item>
<item name="colorControlActivated">#33691e</item>
<item name="android:selectableItemBackgroundBorderless">#color/colorPrimaryDark</item>
<item name="colorControlHighlight">#d50000</item>
Use this style it's work for me for the change background color.
<style name="MyTimePickerWidgetStyle" parent="#android:style/Widget.Material.TimePicker">
<item name="android:headerBackground">#0076A3</item>
<item name="android:numbersTextColor">#b71c1c</item>
<item name="android:numbersInnerTextColor">#f44336</item>
<item name="android:numbersSelectorColor">#DCA811</item>
<item name="android:numbersBackgroundColor">#004A80</item>
<item name="android:amPmTextColor">#fff</item>
</style>
<TimePicker
android:id="#+id/timePicker"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:background="#359EF3"
android:theme="#style/MyTimePickerWidgetStyle"
style="#style/MyTimePickerWidgetStyle" />
Dears,
I want to achieve the following design:
Problems:
Unable to set padding for the hint text inside the EditText.
Code:
<EditText
style="#style/txtBoxStyle"
android:id="#+id/txtUsername"
android:drawableLeft="#drawable/ic_username"
android:hint="#string/text_username">
</EditText>
Style:
<style name="txtBoxStyle">
<item name="android:layout_width">match_parent</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:background">#drawable/edittext_rounded_corners</item>
<item name="android:paddingLeft">20dp</item>
<item name="android:ems">10</item>
</style>
Can't add icon for the spinner on the left side.
Code:
<Spinner
style="#style/ddlStyle"
android:id="#+id/lstCountry"/>
Style:
<style name="ddlStyle" parent="#android:style/Widget.Spinner">
<item name="android:layout_width">fill_parent</item>
<item name="android:background">#android:drawable/ic_country</item>
<item name="android:layout_height">32dp</item>
<item name="android:background">#drawable/edittext_rounded_corners</item>
<item name="android:spinnerMode">dialog</item>
<item name="android:drawableLeft">#drawable/ic_country</item>
</style>
Can't align the image and text inside the button to center.
Please Help.
To give padding between your image and hint text you should have to use android property
android:drawablePadding="10dp"