Using Linear Layout with TextInputLayout but facing a problem

Question

The image is a screenshot of the fragment in which I have applied the Linear Layout

The XML file of the layout is below

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_height="match_parent"
    android:layout_width="match_parent"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:orientation="vertical">
    <ImageView
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_gravity="center_horizontal"
        android:layout_marginTop="50dp"
        android:id="@+id/select_product_image"
        android:src="@drawable/ic_image_black_24dp"
        />
    <Spinner
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:layout_marginTop="15dp"
        android:id="@+id/category_spinner"
        android:layout_marginRight="25dp"
        android:layout_marginLeft="25dp"
        android:background="@drawable/input_design"
        />
    <com.google.android.material.textfield.TextInputLayout
        style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
        app:boxStrokeColor="@color/colorPrimary"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="15dp"

        app:shapeAppearance="@style/Rounded"
        app:endIconMode="clear_text"
        >

        <com.google.android.material.textfield.TextInputEditText
            android:id="@+id/product_name"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="@string/product_name"
            android:inputType="text"

            />
    </com.google.android.material.textfield.TextInputLayout>

    <com.google.android.material.textfield.TextInputLayout
        style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
        app:boxStrokeColor="@color/colorPrimary"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="15dp"

        app:shapeAppearance="@style/Rounded"
        app:endIconMode="clear_text"
        >
        <com.google.android.material.textfield.TextInputEditText
            android:id="@+id/product_description"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="@string/product_description"
            android:maxLength="100"
            android:inputType="text"

            />

    </com.google.android.material.textfield.TextInputLayout>
    <com.google.android.material.textfield.TextInputLayout
        style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
        app:boxStrokeColor="@color/colorPrimary"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="15dp"

        app:shapeAppearance="@style/Rounded"
        app:endIconMode="clear_text"
        >

        <com.google.android.material.textfield.TextInputEditText
            android:id="@+id/product_price"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="@string/product_price"
            android:inputType="numberDecimal"

            />

    </com.google.android.material.textfield.TextInputLayout>
    <Button
        android:id="@+id/add_new_product"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginRight="25dp"
        android:layout_marginLeft="25dp"
        android:layout_marginTop="15dp"
        android:background="@color/colorPrimary"
        android:text="@string/add_product"
        android:textSize="19dp"
        android:textColor="@color/colorAccent"
        />



    </LinearLayout>

The layout file in which I am using this is given below

<RelativeLayout
    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=".NavigActivity">


    <androidx.coordinatorlayout.widget.CoordinatorLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@color/colorAccent">
        <com.google.android.material.bottomappbar.BottomAppBar
            android:id="@+id/bottom_app_bar"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom"
            app:backgroundTint="@color/colorAccent"
            app:navigationIcon="@drawable/ic_menu_black_24dp"
            app:menu="@menu/menu"
            app:buttonGravity="center_vertical"
            app:itemIconTint="@drawable/selector"
            />
        <com.google.android.material.floatingactionbutton.FloatingActionButton
            android:id="@+id/fab"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/ic_add_black_24dp"
            app:layout_anchor="@id/bottom_app_bar"
            android:backgroundTint="@color/colorPrimary"

            app:maxImageSize="35dp"/>

    </androidx.coordinatorlayout.widget.CoordinatorLayout>
    <FrameLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/content_frame"
 />

</RelativeLayout>

I have set the orientation of the LinearLayout vertical but it is working not properly..I wanted each of the attributes one below the other and in the center (Horizontally). Any kind of help would be appreciated

Answer 1

Change the frame layout width from wrap_content to match_parent

Use this layout :

<RelativeLayout
    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=".NavigActivity">


    <androidx.coordinatorlayout.widget.CoordinatorLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@color/colorAccent">
        <com.google.android.material.bottomappbar.BottomAppBar
            android:id="@+id/bottom_app_bar"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom"
            app:backgroundTint="@color/colorAccent"
            app:navigationIcon="@drawable/ic_menu_black_24dp"
            app:menu="@menu/menu"
            app:buttonGravity="center_vertical"
            app:itemIconTint="@drawable/selector"
            />
        <com.google.android.material.floatingactionbutton.FloatingActionButton
            android:id="@+id/fab"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/ic_add_black_24dp"
            app:layout_anchor="@id/bottom_app_bar"
            android:backgroundTint="@color/colorPrimary"

            app:maxImageSize="35dp"/>

    </androidx.coordinatorlayout.widget.CoordinatorLayout>

    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/content_frame"
 />

</RelativeLayout>