ConstraintLayout in Toolbar not applying match_parent for width or height

Question

I have a Toolbar at the top of my app which contains a ConstraintLayout which in turn contains an ImageView, a TextView and another TextView (the title). I want the title to be centered inside the Toolbar so i set the title's constraints to be equal (8 and 8) on both sides. But after running the app and checking the layout preview in Android studio i realized that despite the ConstraintLayout having the android:layout_width="match_parent" and android:layout_height="match_parent" attributes, it does not take up the appropriate space thus causing the centering of the title to be off (see image). Any ideas on what i'm missing?

<?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_height="match_parent"
    android:layout_width="match_parent">

    <androidx.appcompat.widget.Toolbar
        android:id="@+id/home_toolbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/home_toolbar_gradient"
        android:elevation="4dp"
        android:minHeight="70dp"
        android:theme="@style/AppTheme"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:popupTheme="@style/ThemeOverlay.AppCompat.Light">

        <androidx.constraintlayout.widget.ConstraintLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            tools:layout_editor_absoluteX="16dp"
            tools:layout_editor_absoluteY="19dp">

            <ImageView
                android:id="@+id/weatherImg"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginStart="8dp"
                android:layout_marginTop="8dp"
                android:layout_marginBottom="8dp"
                android:contentDescription="weather"
                android:src="@mipmap/weather_placeholder_icon"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toTopOf="parent"
                tools:ignore="HardcodedText" />

            <TextView
                android:id="@+id/weatherTxt"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="start"
                android:layout_marginStart="8dp"
                android:fontFamily="@font/montserrat_bold"
                android:gravity="start"
                android:text="@string/home_weather_text_placeholder"
                android:textAlignment="center"
                android:textColor="@android:color/white"
                android:textSize="15sp"
                app:layout_constraintBottom_toBottomOf="@+id/weatherImg"
                app:layout_constraintStart_toEndOf="@+id/weatherImg"
                app:layout_constraintTop_toTopOf="@+id/weatherImg" />

            <TextView
                android:id="@+id/title_home"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:layout_marginStart="8dp"
                android:layout_marginEnd="8dp"
                android:fontFamily="@font/montserrat_bold"
                android:gravity="center"
                android:text="@string/home"
                android:textAlignment="center"
                android:textColor="@android:color/white"
                android:textSize="18sp"
                app:layout_constraintBottom_toBottomOf="@+id/weatherImg"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toTopOf="@+id/weatherImg" />

        </androidx.constraintlayout.widget.ConstraintLayout>

    </androidx.appcompat.widget.Toolbar>

    <!-- Using a view with a gradient to create a drop navbar_shadow effect for the navbar -->
    <View
        android:layout_width="match_parent"
        android:layout_height="4dp"
        android:layout_above="@id/bottom_nav_bar"
        android:background="@drawable/navbar_shadow"
        app:layout_constraintBottom_toTopOf="@+id/bottom_nav_bar"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent" />

    <com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/bottom_nav_bar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        app:itemBackground="@android:color/white"
        app:itemIconTint="@drawable/nav_selected_item_color"
        app:itemTextColor="@drawable/nav_selected_item_color"
        app:labelVisibilityMode="labeled"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:menu="@menu/bottom_nav_bar">


    </com.google.android.material.bottomnavigation.BottomNavigationView>

</androidx.constraintlayout.widget.ConstraintLayout> 

P.S: I don't know if this matters but i also have a menu for the toolbar which contains an item with the attribute showAsAction="always"

Answer 1

Try this: Your constarint is proper. For Toolbar:

To remove Left space add -> app:contentInsetStart

To remove Right space add -> app:contentInsetEnd

<?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_height="match_parent"
            android:layout_width="match_parent">

    <androidx.appcompat.widget.Toolbar
            android:id="@+id/home_toolbar"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:background="@color/colorPrimary"
            android:elevation="4dp"
            android:minHeight="70dp"
            android:theme="@style/AppTheme"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:contentInsetStart="0dp"
            app:contentInsetEnd="0dp"
            app:layout_constraintTop_toTopOf="parent"
            app:popupTheme="@style/ThemeOverlay.AppCompat.Light">

        <androidx.constraintlayout.widget.ConstraintLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent">

            <ImageView
                    android:id="@+id/weatherImg"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginStart="8dp"
                    android:layout_marginTop="8dp"
                    android:layout_marginBottom="8dp"
                    android:contentDescription="weather"
                    android:src="@drawable/ic_cloud_black"
                    app:layout_constraintBottom_toBottomOf="parent"
                    app:layout_constraintStart_toStartOf="parent"
                    app:layout_constraintTop_toTopOf="parent"
                    tools:ignore="HardcodedText"/>

            <TextView
                    android:id="@+id/weatherTxt"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="start"
                    android:layout_marginStart="8dp"
                    android:gravity="start"
                    android:text="00"
                    android:textAlignment="center"
                    android:textColor="@android:color/white"
                    android:textSize="15sp"
                    app:layout_constraintBottom_toBottomOf="@+id/weatherImg"
                    app:layout_constraintStart_toEndOf="@+id/weatherImg"
                    app:layout_constraintTop_toTopOf="@+id/weatherImg"/>

            <TextView
                    android:id="@+id/title_home"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:layout_marginStart="8dp"
                    android:layout_marginEnd="8dp"
                    android:gravity="center"
                    android:text="home"
                    android:textAlignment="center"
                    android:textColor="@android:color/white"
                    android:textSize="18sp"
                    app:layout_constraintBottom_toBottomOf="@+id/weatherImg"
                    app:layout_constraintEnd_toEndOf="parent"
                    app:layout_constraintStart_toStartOf="parent"
                    app:layout_constraintTop_toTopOf="@+id/weatherImg"/>

        </androidx.constraintlayout.widget.ConstraintLayout>
    </androidx.appcompat.widget.Toolbar>
</androidx.constraintlayout.widget.ConstraintLayout>