Add item to cart attractive layout :
<?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:background="@color/white"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="@+id/newest_img"
android:layout_width="130dp"
android:layout_height="130dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:scaleType="fitXY"
android:src="@drawable/placeholder"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="@+id/product_name"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_marginStart="4dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="4dp"
android:text="Semi-Automatic Low Temperature Water Chiller, 1000 Litre ,Regular"
android:textColor="@color/black"
android:maxLines="2"
android:textSize="16sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@+id/newest_img"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="@+id/product_price"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:text="₹ 16,000000/-"
android:textColor="#126771"
android:textSize="20sp"
android:textStyle="bold"
app:layout_constraintStart_toStartOf="@+id/product_name"
app:layout_constraintTop_toBottomOf="@+id/product_name" />
<TextView
android:id="@+id/product_spec"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_marginTop="4dp"
android:layout_marginEnd="4dp"
android:ellipsize="end"
android:maxLines="2"
android:textSize="@dimen/font_small"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="@+id/product_price"
app:layout_constraintTop_toBottomOf="@+id/product_price" />
<LinearLayout
android:id="@+id/linearLayout8"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginBottom="12dp"
android:orientation="vertical"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent">
<LinearLayout
android:id="@+id/linear"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:orientation="horizontal"
android:weightSum="2"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent">
<androidx.appcompat.widget.AppCompatButton
android:id="@+id/call_btn"
android:layout_width="0dip"
android:layout_height="35dp"
android:layout_marginBottom="4dp"
android:layout_centerHorizontal="true"
android:layout_marginLeft="8dp"
android:layout_weight="1"
android:background="@drawable/rounded_corner5"
android:drawableLeft="@drawable/phone"
android:drawableTint="#14B1A2"
android:paddingHorizontal="30dp"
android:shadowColor="@color/colorPrimary"
android:text="Call Now"
android:textColor="#14B1A2" />
<androidx.appcompat.widget.AppCompatButton
android:id="@+id/quote_btn"
android:layout_width="0dip"
android:layout_height="35dp"
android:layout_centerHorizontal="true"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp"
android:layout_marginBottom="4dp"
android:layout_weight="1"
android:background="@drawable/rounded_corner5"
android:backgroundTint="#14B1A2"
android:drawableLeft="@drawable/get_quote"
android:drawableTint="#ffffff"
android:paddingHorizontal="30dp"
android:shadowColor="@color/colorPrimary"
android:text="Get Quote"
android:textColor="@color/white" />
</LinearLayout>
<include
layout="@layout/layout_ad"
/>
</LinearLayout>
<TextView
android:id="@+id/location_tv"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_marginStart="4dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="4dp"
android:layout_marginBottom="8dp"
android:maxLines="2"
android:ellipsize="end"
android:textColor="#293DAA"
android:textSize="@dimen/font_small"
app:layout_constraintBottom_toTopOf="@+id/linearLayout8"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@+id/newest_img"
app:layout_constraintTop_toBottomOf="@+id/product_spec" />
<ImageView
android:id="@+id/add_to_wishlist_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="3dp"
app:layout_constraintBottom_toBottomOf="@+id/compare"
app:layout_constraintEnd_toStartOf="@+id/cartt"
app:layout_constraintStart_toEndOf="@+id/compare"
app:layout_constraintTop_toTopOf="@+id/compare"
app:layout_constraintVertical_bias="0.0"
app:rippleColor="@color/colorPrimary"
app:srcCompat="@drawable/my_wishlist"
app:tint="#9e9e9e" />
<ImageView
android:id="@+id/cartt"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="16dp"
android:padding="3dp"
android:src="@drawable/cart"
app:layout_constraintEnd_toEndOf="@+id/newest_img"
app:layout_constraintTop_toTopOf="@+id/compare"
app:tint="#2874F0">
</ImageView>
<ImageView
android:id="@+id/compare"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="4dp"
android:layout_marginBottom="4dp"
android:padding="3dp"
android:src="@drawable/compare"
app:layout_constraintBottom_toTopOf="@+id/linearLayout8"
app:layout_constraintStart_toStartOf="@+id/newest_img"
app:layout_constraintTop_toBottomOf="@+id/newest_img"
app:tint="@color/btnbackground">
</ImageView>
<TextView
android:id="@+id/offer_persentg"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="16% off"
android:textColor="@color/btnbackgroundd"
android:textSize="14dp"
android:textStyle="bold"
app:layout_constraintBottom_toTopOf="@+id/cutted_price"
app:layout_constraintEnd_toEndOf="@+id/cutted_price"
app:layout_constraintStart_toStartOf="@+id/cutted_price" />
<TextView
android:id="@+id/cutted_price"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginEnd="8dp"
android:text="Rs.59999999/-"
app:layout_constraintBottom_toBottomOf="@+id/product_price"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@+id/price_unitttt" />
<TextView
android:id="@+id/price_unitttt"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="@color/black"
android:text=""
android:visibility="gone"
app:layout_constraintBottom_toBottomOf="@+id/product_price"
app:layout_constraintStart_toEndOf="@+id/product_price" />
<View
android:id="@+id/divider"
android:layout_width="0dp"
android:layout_height="3dp"
android:background="#80000000"
app:layout_constraintBottom_toBottomOf="@+id/cutted_price"
app:layout_constraintEnd_toEndOf="@+id/cutted_price"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="@+id/cutted_price"
app:layout_constraintTop_toTopOf="@+id/cutted_price" />
<include
layout="@layout/layout_ad"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
/>
</androidx.constraintlayout.widget.ConstraintLayout>
rounded_corner5 background disigh code :
<?xml version="1.0" encoding="utf-8"?>
<shape
xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<!-- view background color -->
<solid
android:color="#ffffff" >
</solid>
<!-- view border color and width -->
<stroke
android:width="1dp"
android:color="@color/colorPrimary" >
</stroke>
<!-- If you want to add some padding -->
<padding
android:left="4dp"
android:top="4dp"
android:right="4dp"
android:bottom="4dp" >
</padding>
<!-- Here is the corner radius -->
<corners
android:radius="20dp" >
</corners>
</shape>
✅ Tags
Android Layout