I have this Drawable aiming to make my round button:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="rectangle">
<solid android:color="#color/colorPrimary"/>
<corners android:radius="150dp"/>
</shape>
</item>
</selector>
I call him in the background of my button normally ...
<Button
android:id="#+id/btnPhoto"
android:background="#drawable/bg_btn_rounded"
android:layout_width="150dp"
android:layout_height="150dp"
android:layout_marginStart="8dp"
android:layout_marginTop="42dp"
android:layout_marginEnd="8dp"
android:text="#string/btnphoto"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
But no changes are applied to the component, I tried to use Drawable on other components and it doesn't apply ... I have no idea why this happens.
My complete screen:
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.misael.appchat.RegisterActivity">
<com.google.android.material.textfield.TextInputLayout
android:id="#+id/tUsername"
style="#style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
android:layout_width="0dp"
android:layout_height="80dp"
android:layout_marginStart="16dp"
android:layout_marginTop="32dp"
android:layout_marginEnd="16dp"
android:hint="#string/usernameHint"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/btnPhoto">
<com.google.android.material.textfield.TextInputEditText
android:id="#+id/editUsername"
android:layout_width="match_parent"
android:layout_height="68dp" />
</com.google.android.material.textfield.TextInputLayout>
<com.google.android.material.textfield.TextInputLayout
android:id="#+id/tEmail"
style="#style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
android:layout_width="0dp"
android:layout_height="80dp"
android:layout_marginTop="24dp"
android:hint="#string/loginHint"
app:layout_constraintEnd_toEndOf="#+id/tUsername"
app:layout_constraintStart_toStartOf="#+id/tUsername"
app:layout_constraintTop_toBottomOf="#+id/tUsername">
<com.google.android.material.textfield.TextInputEditText
android:id="#+id/editEmail"
android:layout_width="match_parent"
android:layout_height="68dp" />
</com.google.android.material.textfield.TextInputLayout>
<com.google.android.material.textfield.TextInputLayout
android:id="#+id/tSenha"
style="#style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
android:layout_width="0dp"
android:layout_height="80dp"
android:layout_marginTop="24dp"
android:hint="#string/passwordHint"
app:layout_constraintEnd_toEndOf="#+id/tEmail"
app:layout_constraintStart_toStartOf="#+id/tEmail"
app:layout_constraintTop_toBottomOf="#+id/tEmail">
<com.google.android.material.textfield.TextInputEditText
android:id="#+id/editPassword"
android:layout_width="match_parent"
android:layout_height="68dp"
android:inputType="textPassword" />
</com.google.android.material.textfield.TextInputLayout>
<com.google.android.material.button.MaterialButton
android:id="#+id/btnRegister"
style="#style/Widget.MaterialComponents.Button.OutlinedButton"
android:layout_width="0dp"
android:layout_height="58dp"
android:layout_marginTop="32dp"
android:text="#string/signinButton"
android:textColor="#7517bd"
app:layout_constraintEnd_toEndOf="#+id/tSenha"
app:layout_constraintStart_toStartOf="#+id/tSenha"
app:layout_constraintTop_toBottomOf="#+id/tSenha" />
<Button
android:id="#+id/btnPhoto"
android:background="#drawable/bg_btn_rounded"
android:layout_width="150dp"
android:layout_height="150dp"
android:layout_marginStart="8dp"
android:layout_marginTop="42dp"
android:layout_marginEnd="8dp"
android:text="#string/btnphoto"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
If you are using a Material Theme there is an auto-inflation enabled which will replace <Button> with <com.google.android.material.button.MaterialButton> at runtime.
Check also this question.
Just use the app:backgroundTint attibute to define the background color and the app:cornerRadius to define the corner radius.
Something like:
<com.google.android.material.button.MaterialButton
android:id="#+id/btnPhoto"
app:backgroundTint="#color/primaryLightColor"
app:cornerRadius="150dp"
android:layout_width="150dp"
android:layout_height="150dp"/>
Are you using a Material Components theme? If so, your <Button> tag will be inflated as a com.google.android.material.button.MaterialButton. The documentation for this widget states:
Do not use the android:background attribute. MaterialButton manages its own background drawable, and setting a new background means MaterialButton can no longer guarantee that the new attributes it introduces will function properly.
If you don't want special MaterialButton behavior, you can explicitly specify a different button class to use. Change your <Button> tag to this instead:
<androidx.appcompat.widget.AppCompatButton
android:id="#+id/btnPhoto"
android:background="#drawable/bg_btn_rounded"
android:layout_width="150dp"
android:layout_height="150dp"
android:layout_marginStart="8dp"
android:layout_marginTop="42dp"
android:layout_marginEnd="8dp"
android:text="#string/btnphoto"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" /
Related
What the title says when I design the button on XML it shows like this
But in the actual application, it looks like this
I expect that when running the app it looks like the XML design at first I though it was because the style wasn't being recognized but that's not the case in other button works just fine
Here's the XML for a better look
<layout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/color_white"
android:padding="20dp"
tools:context="com.fia2.presentation.tos.application.item.six.fragments.PreSignNotificationFragment">
<ImageView
android:id="#+id/iv_ic_confirmation"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_confirmation"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/tv_description"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginVertical="20dp"
android:text="#string/signature_welcome_title"
android:textColor="#color/color_black"
android:textSize="24sp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/iv_ic_confirmation" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginVertical="20dp"
android:text="#string/signature_welcome_subtitle"
android:textColor="#color/colorMediumGrey"
android:textSize="16sp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/tv_description" />
<Button
android:id="#+id/btn_start_sign"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/test_background"
android:drawableStart="#drawable/ic_arrow_right"
android:drawableTint="#color/color_white"
android:gravity="center"
android:minWidth="328dp"
android:minHeight="50dp"
android:paddingHorizontal="10dp"
android:text="#string/sign_in_log_in"
android:textAlignment="center"
android:textAllCaps="true"
android:textColor="#color/colorWhite"
android:textSize="12sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
</layout>
You may try to create a drawable with the content like below
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<corners android:radius="100dp" />
<solid android:color="#color/your_color" />
</shape>
and set it as the background of your Button.
PS. In case the Button doesn't change the color when you set a new background, you may try to replace it with the androidx.appcompat.widget.AppCompatButton
I have created a login page which has two editText fields for username and password. I have included an ImageView in the activity also.
I have made an XML file to make rounded white background for the editText fields. However, that did not work and was still transparent. On changing the background from the created XML file to simple white colour, I could still not see the editText fields.
Below is the code I have used for the following:
Login.XML
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/constraintLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clipToPadding="false"
android:onClick="Clicked"
android:padding="10dp"
android:paddingBottom="10dp"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:paddingTop="10dp"
tools:context=".MainActivity">
<Button
android:id="#+id/button"
android:layout_width="307dp"
android:layout_height="63dp"
android:layout_marginBottom="17dp"
android:layout_marginEnd="327dp"
android:layout_marginStart="84dp"
android:foreground="#drawable/emailsignup"
android:text="#string/button"
app:layout_constraintBottom_toTopOf="#+id/editTextTextPersonName"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.104"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/button2"
app:layout_constraintVertical_bias="1.0" />
<Button
android:id="#+id/button2"
android:layout_width="293dp"
android:layout_height="57dp"
android:layout_marginEnd="146dp"
android:layout_marginStart="63dp"
android:layout_marginTop="200dp"
android:foreground="#drawable/gmailsignup"
android:text="#string/button2"
app:layout_constraintBottom_toTopOf="#+id/button"
app:layout_constraintEnd_toStartOf="#+id/imageView"
app:layout_constraintHorizontal_bias="0.006"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<Button
android:id="#+id/button3"
android:layout_width="88dp"
android:layout_height="48dp"
android:layout_marginBottom="269dp"
android:layout_marginEnd="253dp"
android:layout_marginStart="150dp"
android:layout_marginTop="43dp"
android:background="#drawable/loginbg"
android:fontFamily="monospace"
android:text="#string/LoginText"
android:textSize="18sp"
android:textStyle="bold"
app:layout_constraintBottom_toTopOf="#+id/imageView"
app:layout_constraintEnd_toStartOf="#+id/imageView"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/editTextTextPassword"
app:layout_constraintVertical_bias="0.0" />
<EditText
android:id="#+id/editTextTextPassword"
android:layout_width="228dp"
android:layout_height="51dp"
android:layout_marginBottom="132dp"
android:layout_marginEnd="95dp"
android:layout_marginStart="179dp"
android:layout_marginTop="430dp"
android:autofillHints=""
android:background="#drawable/edittextround"
android:ems="10"
android:fontFamily="sans-serif-medium"
android:hint="#string/PasswordHint"
android:inputType="textPassword"
android:textSize="24sp"
app:layout_constraintBottom_toTopOf="#+id/imageView"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.978"
app:layout_constraintStart_toEndOf="#+id/imageView"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.0" />
<EditText
android:id="#+id/editTextTextPersonName"
android:layout_width="281dp"
android:layout_height="54dp"
android:layout_marginBottom="320dp"
android:layout_marginEnd="153dp"
android:layout_marginStart="58dp"
android:layout_marginTop="88dp"
android:autofillHints=""
android:ems="10"
android:background="#drawable/edittextround"
android:hint="#string/LoginTextHint"
android:inputType="textPersonName"
android:textSize="24sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="#+id/imageView"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/imageView"
app:layout_constraintVertical_bias="0.962" />
<ImageView
android:id="#+id/imageView"
android:layout_width="566dp"
android:layout_height="972dp"
android:adjustViewBounds="false"
android:contentDescription="#string/todo"
android:cropToPadding="false"
android:foreground="?android:attr/selectableItemBackgroundBorderless"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.503"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.344"
app:srcCompat="#drawable/picture1_2" />
</androidx.constraintlayout.widget.ConstraintLayout>
edittextround.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" android:padding="10dp">
<solid android:color="#FFFFFF"/>
<gradient
android:centerY="0.2"
android:startColor="#D3D3D3"
android:centerColor="#65FFFFFF"
android:endColor="#00FFFFFF"
android:angle="270"
/>
<stroke
android:width="0.7dp"
android:color="#BDBDBD" />
<corners
android:radius="15dp" />
</shape>
I tried putting the edittextbackground.xml on the login button and it worked perfectly.
The images related to this activity are below:
Image of the design
Please help me figure out why my editText fields do not show their backgrounds
ok got it
so the problem is below
app:layout_constraintBottom_toTopOf="#+id/imageView"
app:layout_constraintTop_toBottomOf="#+id/imageView"
you are setting the constraints to imageView and that imageView also renders in the area of Editext but not in the background because it is at same elevation as of Editexts so if you just increase the elevation of of editexts they will show up , i tried it , it works
just add android:elevation="1dp" in both edittexts the imageview is at 0dp so editext will show above it.
Although it works but your constraints are confusing use parent instead
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toBottomOf="#id/button" will also do
also i want to say if you use constraint layout correctly you will not need to set layout_width and layout_height in most cases you can set them to 0 the constraints will determine the correct width and height also you don't need to use margins your constraint will handle them if you use bias, chains, groups ,barrier, guidelines etc correctly , please learn more about constraint layout and you can reduce the lines in above layout file to half.
this tutorial will give you good start, also watch other videos in that series
have a good day
I would like to achieve the following layout
The bottom layover TextView has a rounded rectangle drawable as a background. I would like to align the text inside the TextView with the top text. Currently what happens is that the rounded edges align with the text and not the actual text.
Any ideas on how to implement this with ConstraintLayout? I tried setting layout_constraintStart_toStartOf the text above and set negative padding but I guess constraints have priority here and ignores the padding.
Here is the full xml layout:
<androidx.constraintlayout.widget.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<androidx.appcompat.widget.AppCompatImageView
android:id="#+id/trip_type_icon"
android:layout_width="24dp"
android:layout_height="24dp"
android:tint="#color/oslo_gray"
app:layout_constraintBottom_toBottomOf="#+id/trip_month"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="#+id/trip_date"
app:srcCompat="#drawable/ic_car_pickup" />
<View
android:id="#+id/divider"
android:layout_width="1dp"
android:layout_height="0dp"
android:layout_marginStart="12dp"
android:layout_marginTop="12dp"
android:background="#color/oslo_gray"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/trip_type_icon" />
<TextView
android:id="#+id/trip_date"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:textColor="#color/shark"
app:layout_constraintEnd_toEndOf="#+id/trip_month"
app:layout_constraintStart_toEndOf="#+id/trip_type_icon"
app:layout_constraintTop_toTopOf="parent"
tools:text="5" />
<TextView
android:id="#+id/trip_month"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="4dp"
android:textColor="#color/emperor"
app:layout_constraintBottom_toBottomOf="#+id/trip_timeline_subtitle"
app:layout_constraintStart_toEndOf="#+id/trip_type_icon"
app:layout_constraintTop_toBottomOf="#+id/trip_date"
tools:text="Sep" />
<TextView
android:id="#+id/trip_timeline_title"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:textColor="#color/shark"
app:layout_constraintEnd_toStartOf="#+id/navigate_arrow"
app:layout_constraintStart_toEndOf="#+id/trip_date"
app:layout_constraintTop_toTopOf="parent"
tools:text="PVG -> PEK" />
<TextView
android:id="#+id/trip_timeline_subtitle"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginBottom="48dp"
android:textColor="#color/emperor"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="#+id/trip_timeline_title"
app:layout_constraintStart_toEndOf="#+id/trip_date"
app:layout_constraintTop_toBottomOf="#+id/trip_timeline_title"
tools:text="2:10pm - 4:45pm" />
<androidx.appcompat.widget.AppCompatImageView
android:id="#+id/navigate_arrow"
android:layout_width="20dp"
android:layout_height="20dp"
android:layout_marginStart="24dp"
app:layout_constraintBottom_toBottomOf="#+id/trip_timeline_subtitle"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="#+id/trip_timeline_title"
app:layout_constraintTop_toTopOf="#+id/trip_timeline_title"
app:srcCompat="#drawable/ic_arrow_right_vector" />
<TextView
android:id="#+id/trip_timeline_flight_layover"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="#drawable/rounded_rectangle_radius_12dp"
android:textColor="#color/emperor"
android:visibility="gone"
app:layout_constraintEnd_toEndOf="#id/navigate_arrow"
app:layout_constraintStart_toStartOf="#+id/trip_timeline_subtitle"
app:layout_constraintTop_toBottomOf="#id/trip_timeline_subtitle"
tools:background="#drawable/rounded_rectangle_radius_12dp"
tools:text="2h 25m Layover at PEK"
tools:visibility="visible" />
</androidx.constraintlayout.widget.ConstraintLayout>
Rounded rectangle drawable rounded_rectangle_radius_12dp:
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle"
android:tint="#color/porcelain">
<corners android:radius="12dp" />
<padding android:left="12dp"
android:right="12dp"
android:top="2dp"
android:bottom="2dp"/>
</shape>
I would define padding inside your trip_timeline_flight_layover TextView instead of your drawable:
<TextView
android:id="#+id/trip_timeline_flight_layover"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:paddingTop="2dp"
android:paddingBottom="2dp"
android:paddingStart="12dp"
android:paddingEnd="12dp"
android:background="#drawable/rounded_rectangle_radius_12dp"
android:textColor="#color/emperor"
android:visibility="gone"
app:layout_constraintEnd_toEndOf="#id/navigate_arrow"
app:layout_constraintStart_toStartOf="#+id/trip_timeline_subtitle"
app:layout_constraintTop_toBottomOf="#id/trip_timeline_subtitle"
tools:background="#drawable/rounded_rectangle_radius_12dp"
tools:text="2h 25m Layover at PEK"
tools:visibility="visible" />
And then set layout_marginStart of trip_timeline_title equal to the padding of your layover``TextView, in this case, 12dp.
EDIT:
I actually don't think you have to define padding inside your TextView, just making margin of your title equal to the side padding should work.
I'm creating an app which has google's material text input layout and I want to add country code dropdown in the app. I liked Country Code Picker Library but I want to make it look like the outlined box like other text fields. Please help me.
Thanks in advance
Check Screenshots :
How Country Code looks:
How I want it to look:
You can override a library UI by making an exact layout name used in the library. For example, if the library have the following layout:
layout_code_picker.xml
You need to create the same layout in your project with the same views id in the layout.
Or the last option, fork the library.
Yes. You can hide components of CCP if you need. Here is what I could achieve:
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/countryHolder"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_margin="16dp"
android:background="#drawable/rounded_corner"
android:padding="8dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent">
<com.hbb20.CountryCodePicker
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:ccp_showArrow="false"
app:ccp_showFlag="false"
app:ccp_showNameCode="false"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<ImageView
android:id="#+id/imgClear"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:layout_marginEnd="8dp"
android:layout_marginBottom="8dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/ic_cancel_black_24dp" />
</androidx.constraintlayout.widget.ConstraintLayout>
<TextView
android:id="#+id/countryLabelTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="12dp"
android:layout_marginTop="8dp"
android:background="#android:color/white"
android:paddingStart="4dp"
android:paddingEnd="4dp"
android:text="Country"
app:layout_constraintBottom_toTopOf="#+id/countryHolder"
app:layout_constraintStart_toStartOf="#+id/countryHolder"
app:layout_constraintTop_toTopOf="#+id/countryHolder" />
</androidx.constraintlayout.widget.ConstraintLayout>
and here is used rounded_corner.xml drawable
<?xml version="1.0" encoding="utf-8"?>
<shape android:shape="rectangle" xmlns:android="http://schemas.android.com/apk/res/android">
<corners android:radius="8dp"/>
<stroke android:color="#555555" android:width="1dp"/>
</shape>
**here is my code **
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:orientation="vertical">
<!--<com.google.android.material.textfield.TextInputLayout
android:id="#+id/sign_mob_no"
android:layout_width="match_parent"
android:layout_height="40dp"
android:hint="Mobile Number"
android:inputType="phone">-->
<RelativeLayout
android:id="#+id/relativeLayout3"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:layout_editor_absoluteY="21dp">
<com.google.android.material.textfield.TextInputLayout
android:id="#+id/mobile_no"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="start"
android:hint="Mobile Number"
android:orientation="horizontal"
android:paddingLeft="0dp"
app:counterMaxLength="5">
<com.google.android.material.textfield.TextInputEditText
style="#style/loginfield"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:imeOptions="actionNext"
android:inputType="phone"
android:maxEms="11"
android:maxLength="12"
android:maxLines="1"
android:singleLine="true"
android:textSize="16sp" />
</com.google.android.material.textfield.TextInputLayout>
</RelativeLayout>
<com.hbb20.CountryCodePicker
android:id="#+id/ccp"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_alignParentBottom="true"
android:layout_gravity="center_vertical"
android:layout_marginBottom="0dp"
android:gravity="center|start"
android:paddingTop="10dp"
app:ccpDialog_backgroundColor="#color/white"
app:ccp_contentColor="#color/black"
app:ccp_countryAutoDetectionPref="SIM_NETWORK_LOCALE"
app:ccp_defaultPhoneCode="91"
app:ccp_hintExampleNumber="true"
app:ccp_showFlag="true"
app:ccp_showNameCode="false"
app:ccp_textSize="14dp">
</com.hbb20.CountryCodePicker>
<!--</com.google.android.material.textfield.TextInputLayout>-->
</RelativeLayout>
**and add dependency. this worked for me **
I'm using ConstraintLayout for the layout of a dialog fragment. It's all good except on the device with Android Lollipop. There, the layout adds up a textView(id/title) automatically on the top which is not even declared in the layout. When I run Layout Inspector, I get following results:
on Android L
on emulator with Android P
Here I fail to understand why it's happening. Here is my layout's xml code. Appreciate your help.
<androidx.constraintlayout.widget.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:background="#color/black_overlay"
android:layout_width="325dp"
android:layout_height="wrap_content">
<TextView
android:id="#+id/tvTitle"
style="#style/TextAppearance.Black"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="24dp"
android:layout_marginTop="24dp"
android:layout_marginEnd="25dp"
android:maxLines="2"
android:text="#string/signup_alert_title"
app:layout_constraintEnd_toStartOf="#+id/ivDismissDialog"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<ImageView
android:id="#+id/ivDismissDialog"
android:layout_width="18dp"
android:layout_height="18dp"
android:layout_marginTop="19dp"
android:layout_marginEnd="19dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/ic_cancel_deselected" />
<TextView
android:id="#+id/tvSignupDetails"
style="#style/TextAppearance.Regular"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="24dp"
android:layout_marginTop="16dp"
android:layout_marginEnd="24dp"
android:text="#string/signup_alert_details"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/tvTitle" />
<Button
android:id="#+id/signupButton"
style="#style/Button.FilledButton"
android:layout_width="208dp"
android:layout_height="wrap_content"
android:layout_marginStart="62dp"
android:layout_marginTop="24dp"
android:layout_marginEnd="55dp"
android:text="#string/signup"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/tvSignupDetails" />
<Button
android:id="#+id/loginButton"
style="#style/Button.FlatButton"
android:layout_width="208dp"
android:layout_height="wrap_content"
android:layout_marginStart="62dp"
android:layout_marginTop="10dp"
android:layout_marginEnd="55dp"
android:layout_marginBottom="24dp"
android:text="#string/login"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/signupButton" />
</androidx.constraintlayout.widget.ConstraintLayout>
This is basically theme related. In android the root view in most cases is a FrameLayout and using a theme like Theme.AppCompat.Light.DarkActionBar can add an extra view to the ViewGroup to display an actionbar with title.
The typical default actionBar code looks like below:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:id="#+id/title"
android:text="YOUR ACTIVITY TITLE"
android:textColor="#ffffff"
android:textSize="24sp" />
</LinearLayout>
This simply means we can access the predefined textview using a reference like below if it exists:
View decor = getWindow().getDecorView();
TextView title = (TextView) decor.findViewById(getResources().getIdentifier("title", "id", "android"));
In other to get read of the action bar or textview overall we use a different app theme that requires no action bar or we add the below options to app's parent/base theme under style:
<item name="android:windowNoTitle">true</item>
<item name="windowActionBar">false</item>