Develop Reference

Toolbar title not aligned to the center when there's a navigation icon

I have a custom toolbar in which I set the title and other things programatically. The thing is, even though the title has the setting gravity="center", whenever the navigationIcon appears, it is moved a little bit to the side (like in the picture).
I understand that since the icon is not in the xml it must be moving it but is there a way to make the textView stay in the center no matter the icons? Or is there a way to add an ImageView or Button to the xml and then set the navigationIcon to that button so that the icon is contemplated in the code?
This is my xml, I added the buttons but I don't know a way to set the icons programatically.
<?xml version="1.0" encoding="utf-8"?>
<androidx.appcompat.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/toolbar"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/constraintly"
android:layout_width="match_parent"
android:layout_height="41dp"
android:gravity="center"
android:layout_gravity="center">
<Button
android:id="#+id/navigationIcon"
android:layout_width="24dp"
android:layout_height="24dp"
android:scaleType="center"
android:layout_marginStart="12dp"
android:layout_alignParentLeft="true"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toTopOf="parent"
/>
<TextView
android:id="#+id/title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
style="#style/NavBar.Title"
android:singleLine="true"
android:ellipsize="end"
android:layout_gravity="center"
android:gravity="center"
android:layout_marginEnd="12dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
tools:text="Title"/>
<TextView
android:id="#+id/subtitle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:singleLine="true"
android:ellipsize="end"
android:layout_gravity="center"
android:gravity="center"
android:layout_marginEnd="12dp"
style="#style/NavBar.SubTitle"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/centeredTitleTextView"
tools:text="Subtitle"/>
<Button
android:id="#+id/closeIcon"
android:layout_width="24dp"
android:layout_height="24dp"
android:scaleType="center"
android:layout_marginEnd="12dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toTopOf="parent"
/>
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.appcompat.widget.Toolbar>
This is the part where the navigationIcon is set but setNavigationIcon cannot take the view.
public void setNavigationIconArrow() {
super.setNavigationIcon(R.drawable.ic_ui_24dp);
}
public void setNavigationIconClose() {
super.setNavigationIcon(R.drawable.ic_24dp);
}
Thank you.

Because of the icon size, your layout starts after that. So you can't use gravity=center. Also, You can't set static left margin or right margin, Because, Android has so much different screen sizes. So you have to do this programmatically.
1- You have to find the phone's screen width size.
2- Convert that size px to dp.
3- Now you can set the left margin to your layout. Which you want in gravity=center.
I hope, I did help you what you want:)

display Full width textview with look like another textview inside that constraint Layout

I want to display view like above.I know its very simple one but I want to know in constraint layout what would be best approach?
I have added below constraints.If test text string should be long then it should not go beyond the arrow icon.
<?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/container"
android:layout_width="match_parent"
android:layout_height="match_parent">
// test textview
<TextView
android:id="#+id/item_title"
android:layout_width="match_parent"
android:layout_height="60dp"
android:layout_toStartOf="#id/item_accessory"
android:background="#color/error_red"
android:paddingEnd="40dp"
android:text="test"
android:gravity="center"
android:textColor="#android:color/white"
app:layout_constraintTop_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"/>
// Arrow icon
<com.wrx.wazirx.views.custom.TextViewPlus
android:id="#+id/item_accessory"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/icon_arrowhead_right"
android:textColor="?attr/colorLabel"
android:textSize="24sp"
android:layout_marginVertical="#id/item_title"
android:layout_marginEnd="25dp"
android:visibility="visible"
app:layout_constraintTop_toTopOf="#id/item_title"
app:layout_constraintBottom_toBottomOf="#id/item_title"
app:layout_constraintEnd_toEndOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
Let me know what wrong am doing and what is the best approach.

There are a couple of ways to do what you are asking. Take a look at ConstraintLayout chains for a way to place views side-by-side with constraints. In the XML below, I have replaced you custom view with a simple view but the concept works with either.
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="#+id/item_title"
android:layout_width="0dp"
android:layout_height="60dp"
android:layout_toStartOf="#id/item_accessory"
android:background="#color/error_red"
android:gravity="center"
android:paddingEnd="40dp"
android:text="This is some long text for the button This is some long text for the button"
android:textColor="#android:color/white"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent" />
<View
android:id="#+id/item_accessory"
android:layout_width="24dp"
android:layout_height="24dp"
android:layout_marginVertical="#id/item_title"
android:background="#drawable/ic_baseline_arrow_forward_ios_24"
android:layout_marginEnd="16dp"
android:textSize="24sp"
app:layout_constraintBottom_toBottomOf="#+id/item_title"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="#+id/item_title" />
</androidx.constraintlayout.widget.ConstraintLayout>
With short text:
and longer text:

CardCornerRadius is not clipping linear layout within view

I am trying to have images in my recycler view have rounded corners to look better. I looked online and found out I could not set the background to a cardview but I could set a background to a linear layout so that is what I did. In the design tab of Android Studio I can see that the cardview has rounded corners but when I run the app the corners are not rounded. I tried googling the problem for a few hours but I could not find an answer.
Here is the contrast on what I am seeing in Android studio and the emulator
<?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="wrap_content"
android:orientation="vertical"
android:paddingBottom="5dp">
<androidx.cardview.widget.CardView
android:id="#+id/cvPhoto"
android:layout_width="150dp"
android:layout_height="150dp"
android:layout_marginLeft="10dp"
android:layout_marginTop="10dp"
android:elevation="0dp"
app:cardBackgroundColor="#CABCBC"
app:cardCornerRadius="15dp"
app:cardPreventCornerOverlap="false"
app:cardUseCompatPadding="false"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<LinearLayout
android:id="#+id/llPhoto"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/_0443265_10154716579055043_2084238995361491869_o"
android:orientation="horizontal"></LinearLayout>
</androidx.cardview.widget.CardView>
<TextView
android:id="#+id/tvName"
android:layout_width="0dp"
android:layout_height="19dp"
android:layout_marginStart="8dp"
android:layout_marginTop="32dp"
android:layout_marginBottom="8dp"
android:text="name"
android:textSize="14sp"
app:layout_constraintBottom_toTopOf="#+id/tvSurname"
app:layout_constraintStart_toEndOf="#+id/cvPhoto"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="1.0" />
<TextView
android:id="#+id/tvSurname"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginBottom="60dp"
android:text="surname"
android:textColor="#color/gold"
android:textStyle="bold"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toEndOf="#+id/cvPhoto" />
<TextView
android:id="#+id/tvRank"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="24dp"
android:text="Rank"
android:textColor="#color/gold"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="#+id/imageView"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.503" />
<ImageView
android:id="#+id/imageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="8dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/next_arrow" />
</androidx.constraintlayout.widget.ConstraintLayout>

I read some comments that suggest to move your linearlayout to have effects that you would like but I suggest to let your linearlayout and instead do like this:
put some padding between your cardview and your linearlayout:
app:cardUseCompatPadding="true"
android:padding="16dp"
don't miss cardUseCompatPadding flag!
put your corners radius and elevation like this:
app:cardElevation="#dimen/cardview_elevation"
app:cardCornerRadius="#dimen/cardview_corners_radius"
set cardBackground to white color and transparent color for the constraintLayout parent;
app:cardBackgroundColor="#color/white" for cardview
android:background="#color/transparent" for parent layout
and you're all done.

How to properly place multiple TextView over imageView

I have an image that I desire to put textViews on top to my Android Application which is the following:
In order to place textViews on top of the image the only solution I have is to create a FrameLayout, place ImageView first, TextView after and then put padding into the TextView, this is very archaic and time consuming, and I don't know if it will stretch correctly to all android resolutions. This is the way I'm able to do it:
Is this the only way to do it? Does it have any issue relating to different phones resolutions? or since its based on dp it will always stretch correctly?

Instead of using image view, you can use a linear layout and set its background as that image..Then you can add edit text and text views on it.

You could use a ConstraintLayout. If you constrain the Name: TextView's top to the top of the ImageView and create a chain of constraints (ending with the Information EditText having its bottom constrained to the bottom of the ImageView), that will keep all your views in the bounds of the ImageView.
A layout like this:
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools">
<ImageView
android:id="#+id/image"
android:layout_width="0dp"
android:layout_height="300dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
android:src="#color/grey"/>
<TextView
android:id="#+id/name_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Name:"
android:layout_marginStart="16dp"
android:layout_marginTop="16dp"
app:layout_constraintStart_toStartOf="#id/image"
app:layout_constraintTop_toTopOf="#id/image" />
<EditText
android:id="#+id/name_text_entry"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#color/white"
android:layout_marginTop="8dp"
app:layout_constraintStart_toStartOf="#id/name_text"
app:layout_constraintTop_toBottomOf="#id/name_text"
tools:text="Some random text in here"/>
<TextView
android:id="#+id/id_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="ID:"
android:layout_marginTop="16dp"
app:layout_constraintStart_toStartOf="#id/name_text_entry"
app:layout_constraintTop_toBottomOf="#id/name_text_entry"/>
<EditText
android:id="#+id/id_text_entry"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#color/white"
android:layout_marginTop="8dp"
app:layout_constraintStart_toStartOf="#id/id_text"
app:layout_constraintTop_toBottomOf="#id/id_text"
tools:text="Some random text in here"/>
<TextView
android:id="#+id/information_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Information:"
android:layout_marginTop="16dp"
app:layout_constraintStart_toStartOf="#id/id_text_entry"
app:layout_constraintTop_toBottomOf="#id/id_text_entry"/>
<EditText
android:id="#+id/information_text_entry"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="#color/white"
android:layout_marginTop="8dp"
android:layout_marginEnd="16dp"
android:lines="5"
app:layout_constraintStart_toStartOf="#id/information_text"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toBottomOf="#id/information_text"
tools:text="Some random text in here"/>
will produce something like this (the grey background being your ImageView)
Here's a link since I can't embed images

automatic switch textview size by display

Please I have problem with size in textView
I have .xml code, where I use linear/horizontal/frame layout and I have in layout some object (textview) and have same text in textviews.
I need switch text size according to Phone display.
but if I put 130dp is not good for small display.
little of my code
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:baselineAligned="false">
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="2">
<TextView
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="88"
android:id="#+id/hlc"
android:textSize="130dp"
android:textIsSelectable="false"
android:gravity="end"
android:textStyle="bold" />
<LinearLayout
android:orientation="vertical"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:paddingTop="0dp"
android:layout_weight="10">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="°"
android:id="#+id/textView15"
android:textSize="#android:dimen/notification_large_icon_width"
android:textIsSelectable="false"
android:textStyle="bold"
android:layout_weight="9"
android:textAlignment="viewStart" />
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="8"
android:id="#+id/hld"
android:textSize= "#android:dimen/notification_large_icon_width"
android:textStyle="bold"
android:textAlignment="viewStart"
android:layout_weight="1" />
</LinearLayout>
</LinearLayout>
if i use #android:dimen/thumbnail_width it's too big for my formated display
I need to fill in framelayput with text in textview.
I can't put image here :(
... and how are used values-small, values-large, etc ? example please. example declarate and example use in xml.
Thanks.

What you can do is create different dimension folder for different size with different sp (better to use sp than dp for text size).
check this documentation for better understatement
and also check this