Search code examples
androidlayoutbackgroundbackground-color

set layout background and heigh

I have two question first, I have a child layout and I wanna set its background to green but when I set I've got this layout that its color is not stretched, below pic enter image description here

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_below="@+id/image_Dead_Load"
    android:layout_centerHorizontal="true"
    android:layout_marginBottom="6dp"
    android:layout_marginLeft="6dp"
    android:layout_marginRight="6dp"
    android:background="@drawable/layout_border"
    android:paddingLeft="6dp"
    android:paddingRight="6dp">

    <RelativeLayout
        android:id="@+id/material_info"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:background="@color/green">

        <TextView
            android:id="@+id/wall_material"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentEnd="true"
            android:layout_alignParentRight="true"
            android:layout_alignTop="@+id/material_thickness"
            android:layout_gravity="center_horizontal"
            android:layout_marginEnd="91dp"
            android:layout_marginRight="110dp"
            android:paddingLeft="5sp"
            android:text="جنس مصالح"
            android:textColor="@color/black"
            android:textSize="15sp" />

        <TextView
            android:id="@+id/material_thickness"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_horizontal"
            android:layout_marginBottom="3dp"
            android:paddingLeft="5sp"
            android:text="ضخامت mm"
            android:textColor="@color/black"
            android:textSize="15sp" />
    </RelativeLayout>

    <RelativeLayout
        android:id="@+id/brick_layout"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/material_info"
        android:layout_marginTop="5dp">

        <EditText
            android:id="@+id/editText_wall_width"
            android:layout_width="100dp"
            android:layout_height="30dp"
            android:layout_alignBottom="@+id/wall_material_spinner"
            android:layout_alignTop="@+id/wall_material_spinner"
            android:layout_marginRight="3dp"
            android:background="@drawable/textinputborder"
            android:inputType="numberDecimal"
            android:paddingLeft="5sp"
            android:textColor="@color/black" />

        <Spinner
            android:id="@+id/wall_material_spinner"
            android:layout_width="wrap_content"
            android:layout_height="25dp"
            android:layout_toLeftOf="@+id/brick_material"
            android:layout_toRightOf="@+id/editText_wall_width"
            android:layout_toStartOf="@+id/brick_material"
            android:background="@drawable/spinner_background"
            android:spinnerMode="dropdown" />

        <TextView
            android:id="@+id/brick_material"
            android:layout_width="60dp"
            android:layout_height="wrap_content"
            android:layout_alignBaseline="@+id/wall_material_spinner"
            android:layout_alignParentRight="true"
            android:text="نوع آجر"
            android:textColor="@color/gray_heavy"
            android:textSize="15sp" />
    </RelativeLayout>

    <RelativeLayout
        android:id="@+id/plastering_layout"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/brick_layout">

        <EditText
            android:id="@+id/editText_plastering_material"
            android:layout_width="100dp"
            android:layout_height="30dp"
            android:layout_alignBottom="@+id/plastering_material_spinner"
            android:layout_alignTop="@+id/plastering_material_spinner"
            android:layout_marginRight="3dp"
            android:background="@drawable/textinputborder"
            android:inputType="numberDecimal"
            android:paddingLeft="5sp"
            android:textColor="@color/black" />

        <Spinner
            android:id="@+id/plastering_material_spinner"
            android:layout_width="wrap_content"
            android:layout_height="25dp"
            android:layout_marginTop="7dp"
            android:layout_toLeftOf="@+id/plastering_material"
            android:layout_toRightOf="@+id/editText_plastering_material"
            android:layout_toStartOf="@+id/plastering_material"
            android:background="@drawable/spinner_background"
            android:gravity="center_vertical"
            android:spinnerMode="dropdown" />

        <TextView
            android:id="@+id/plastering_material"
            android:layout_width="60dp"
            android:layout_height="wrap_content"
            android:layout_alignBaseline="@+id/plastering_material_spinner"
            android:layout_alignParentRight="true"
            android:text="نوع اندود"
            android:textColor="@color/gray_heavy"
            android:textSize="15sp" />

    </RelativeLayout>

    <RelativeLayout
        android:id="@+id/esther_layout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/plastering_layout">

        <TextView
            android:id="@+id/esther_material"
            android:layout_width="60dp"
            android:layout_height="wrap_content"
            android:layout_alignBaseline="@+id/esther_material_spinner"
            android:layout_alignParentRight="true"
            android:text="نوع آستر"
            android:textColor="@color/gray_heavy"
            android:textSize="15sp" />

        <Spinner
            android:id="@+id/esther_material_spinner"
            android:layout_width="wrap_content"
            android:layout_height="25dp"
            android:layout_marginTop="7dp"
            android:layout_toLeftOf="@+id/esther_material"
            android:layout_toRightOf="@+id/editText_esther_material"
            android:layout_toStartOf="@+id/esther_material"
            android:background="@drawable/spinner_background"
            android:gravity="center_vertical"
            android:spinnerMode="dropdown" />

        <EditText
            android:id="@+id/editText_esther_material"
            android:layout_width="100dp"
            android:layout_height="30dp"
            android:layout_alignBottom="@+id/esther_material_spinner"
            android:layout_alignTop="@+id/esther_material_spinner"
            android:layout_marginRight="3dp"
            android:background="@drawable/textinputborder"
            android:inputType="numberDecimal"
            android:paddingLeft="5sp"
            android:textColor="@color/black" />
    </RelativeLayout>

    <RelativeLayout
        android:id="@+id/exterior_mortar_layout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/esther_layout">

        <TextView
            android:id="@+id/exterior_mortar_material"
            android:layout_width="60dp"
            android:layout_height="wrap_content"
            android:layout_alignBaseline="@+id/exterior_mortar_material_spinner"
            android:layout_alignParentRight="true"
            android:text="ملات بیرونی"
            android:textColor="@color/gray_heavy"
            android:textSize="12sp" />

        <Spinner
            android:id="@+id/exterior_mortar_material_spinner"
            android:layout_width="wrap_content"
            android:layout_height="25dp"
            android:layout_marginTop="7dp"
            android:layout_toEndOf="@+id/editText_exterior_mortar_material"
            android:layout_toLeftOf="@+id/exterior_mortar_material"
            android:layout_toRightOf="@+id/editText_exterior_mortar_material"
            android:background="@drawable/spinner_background"
            android:gravity="center_vertical"
            android:spinnerMode="dropdown" />

        <EditText
            android:id="@+id/editText_exterior_mortar_material"
            android:layout_width="100dp"
            android:layout_height="30dp"
                                                                                         android:layout_alignBottom="@+id/exterior_mortar_material_spinner"                                                                                             android:layout_alignTop="@+id/exterior_mortar_material_spinner"
            android:layout_marginRight="3dp"
            android:background="@drawable/textinputborder"
            android:inputType="numberDecimal"
            android:paddingLeft="5sp"
            android:textColor="@color/black" />
    </RelativeLayout>

    <RelativeLayout
        android:id="@+id/facing_layout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/exterior_mortar_layout">

        <TextView
            android:id="@+id/facing_material"
            android:layout_width="60dp"
            android:layout_height="wrap_content"
            android:layout_alignBaseline="@+id/facing_material_spinner"
            android:layout_alignParentRight="true"
            android:text="نوع نما"
            android:textColor="@color/gray_heavy"
            android:textSize="15sp" />

        <Spinner
            android:id="@+id/facing_material_spinner"
            android:layout_width="wrap_content"
            android:layout_height="25dp"
            android:layout_marginTop="7dp"
            android:layout_toEndOf="@+id/editText_facing_material"
            android:layout_toLeftOf="@+id/facing_material"
            android:layout_toRightOf="@+id/editText_facing_material"
            android:background="@drawable/spinner_background"
            android:gravity="center_vertical"
            android:spinnerMode="dropdown" />

        <EditText
            android:id="@+id/editText_facing_material"
            android:layout_width="100dp"
            android:layout_height="30dp"
            android:layout_alignBottom="@+id/facing_material_spinner"
            android:layout_alignTop="@+id/facing_material_spinner"
            android:layout_marginRight="3dp"
            android:background="@drawable/textinputborder"
            android:inputType="numberDecimal"
            android:paddingLeft="5sp"
            android:textColor="@color/black" />
    </RelativeLayout>

    <Button
        android:id="@+id/wall_loading_btn"
        android:layout_width="150dp"
        android:layout_height="36dp"
        android:layout_alignParentBottom="true"
        android:layout_alignParentRight="true"
        android:layout_marginTop="5dp"
        android:background="@drawable/buttonshape"
        android:gravity="center"
        android:onClick="wallLoading"
        android:text="محاسبه"
        android:textColor="@color/white"
        android:textSize="18sp"
        android:textStyle="bold"></Button>


</RelativeLayout>

Second, also as you see, I use sliding tab that its height is not shown in android studio preview: enter image description here

and I couldn't set the layout height and my blue button is on the last spinner in a real device.(see the first picture) how can I solve them?

Solution

  • The background fills the whole "material_info" layout, but this layout doesn't fill the whole width. If you want the layout to fit the whole width remove the paddings and margins of the top level layout and set it individually for each child.

    To achieve the rounded corner effect you need to set a custom background drawable. You can create a custom shape like this:

    <?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http//schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <solid android:color="@color/yourGreen" />
    <corners
        android:bottomLeftRadius="0dp"
        android:bottomRightRadius="0dp"
        android:topLeftRadius="@dimen/yourRadius"
        android:topRightRadius="@dimen/yourRadius" />
</shape>

    Concerning the second question: You won't see the tab in your preview, because it's probably in another Fragment/Activity the current Fragment is inflated in. The preview shows only the current View not everything that is visible in the app