How to place textviews center with near imageview and textview android?

Question

Hi I want to achieve the desired output similar to screenshot attached below. a view line separation where I need to place textview at center and near to the textview an image and text for size and color. How to achieve it?

My code is as follows:

I used a view line at top and bottom and used textview but it doesn't achieve exact output. How to solve the issue? Please help me. Thanks..

    <View
        android:id="@+id/view2"
        android:layout_width="wrap_content"
        android:layout_height="1dp"
        android:layout_below="@+id/offers_price_layout"
        android:layout_centerVertical="true"
        android:layout_marginTop="5dp"
        android:background="#cfcfcf" />
        <RelativeLayout
            android:id="@+id/size_color_layout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_below="@+id/view2"
            android:orientation="horizontal"
            >
            <LinearLayout
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:weightSum="4"
                android:orientation="horizontal">
            <TextView
                    android:layout_width="0dp"
                    android:layout_weight="1.4"
                    android:layout_height="fill_parent"
                    android:text="Size"
                android:paddingRight="10dp"
                android:gravity="center"
                    />
                <TextView
                    android:layout_width="0dp"
                    android:layout_weight="0.3"
                    android:layout_height="fill_parent"
                    android:text="7"
                    android:paddingTop="10dp"
                    android:paddingBottom="10dp"
                    android:layout_marginTop="2dp"
                    />

                <View
                    android:layout_width="1dp"
                    android:layout_height="fill_parent"
                    android:background="#cfcfcf"
                    />
                <TextView
                    android:layout_width="0dp"
                    android:layout_weight="1.7"
                    android:layout_height="fill_parent"
                    android:text="Color"
                    android:gravity="center"
                    />
                <ImageView
                    android:layout_width="0dp"
                    android:layout_weight="0.6"
                    android:layout_height="fill_parent"

                    android:paddingTop="10dp"
                    android:paddingBottom="10dp"
                    android:src="@drawable/product_wish"
                    />
            </LinearLayout>
            </RelativeLayout>

    <View
        android:id="@+id/view3"
        android:layout_width="wrap_content"
        android:layout_height="1dp"
        android:layout_below="@+id/size_color_layout"
        android:layout_centerVertical="true"
        android:background="#cfcfcf" />

Below is the screenshot I want to achieve.

Answer 1

Follow these steps:

1. Create parent Horizontal Linear Layout
2. Put 2 Relative Layouts with equal weight
3. Insert Horizontal Linear Layout in Both with center in parent
4. Put a TextView and an ImageVew both wrapping content

Answer 2

Which textview you want to align center, is it with text 7?