diff --git a/app/src/main/java/com/hieuwu/groceriesstore/presentation/delivery/DeliveryFragment.kt b/app/src/main/java/com/hieuwu/groceriesstore/presentation/delivery/DeliveryFragment.kt
index c565435a..ee4cbeb0 100644
--- a/app/src/main/java/com/hieuwu/groceriesstore/presentation/delivery/DeliveryFragment.kt
+++ b/app/src/main/java/com/hieuwu/groceriesstore/presentation/delivery/DeliveryFragment.kt
@@ -4,16 +4,13 @@ import android.os.Bundle
 import android.view.LayoutInflater
 import android.view.View
 import android.view.ViewGroup
+import androidx.compose.ui.platform.ComposeView
 import androidx.core.os.bundleOf
-import androidx.databinding.DataBindingUtil
 import androidx.fragment.app.Fragment
 import androidx.navigation.fragment.findNavController
-import com.hieuwu.groceriesstore.R
-import com.hieuwu.groceriesstore.databinding.FragmentDeliveryBinding
 import com.hieuwu.groceriesstore.utilities.KeyData
 
 class DeliveryFragment : Fragment() {
-    lateinit var binding: FragmentDeliveryBinding
 
     override fun onCreateView(
         inflater: LayoutInflater,
@@ -21,30 +18,24 @@ class DeliveryFragment : Fragment() {
         savedInstanceState: Bundle?
     ): View? {
 
-        binding = DataBindingUtil.inflate<FragmentDeliveryBinding>(
-            inflater,
-            R.layout.fragment_delivery,
-            container,
-            false
-        )
-        binding.lifecycleOwner = this
-
-        binding.updateDeliveryBtn.setOnClickListener {
-            parentFragmentManager.setFragmentResult(
-                KeyData.RESULT_KEY, bundleOf(
-                    KeyData.NAME_KEY to binding.receiverName.text.toString(),
-                    KeyData.PHONE_KEY to binding.receiverPhone.text.toString(),
-                    KeyData.STREET_KEY to binding.addressStreet.text.toString(),
-                    KeyData.WARD_KEY to binding.addressWard.text.toString(),
-                    KeyData.CITY_KEY to binding.addressCity.text.toString()
+        return ComposeView(requireContext()).apply {
+            setContent {
+                DeliveryScreen(
+                    onNavigateBack = { findNavController().navigateUp() },
+                    onUpdateClick = { delivery ->
+                        parentFragmentManager.setFragmentResult(
+                            KeyData.RESULT_KEY, bundleOf(
+                                KeyData.NAME_KEY to delivery.name,
+                                KeyData.PHONE_KEY to delivery.phoneNumber,
+                                KeyData.STREET_KEY to delivery.street,
+                                KeyData.WARD_KEY to delivery.district,
+                                KeyData.CITY_KEY to delivery.province
+                            )
+                        )
+                        findNavController().popBackStack()
+                    }
                 )
-            )
-            findNavController().popBackStack()
-        }
-
-        binding.toolbar.setNavigationOnClickListener {
-            findNavController().navigateUp()
+            }
         }
-        return binding.root
     }
 }
diff --git a/app/src/main/java/com/hieuwu/groceriesstore/presentation/delivery/DeliveryModel.kt b/app/src/main/java/com/hieuwu/groceriesstore/presentation/delivery/DeliveryModel.kt
new file mode 100644
index 00000000..34510be6
--- /dev/null
+++ b/app/src/main/java/com/hieuwu/groceriesstore/presentation/delivery/DeliveryModel.kt
@@ -0,0 +1,9 @@
+package com.hieuwu.groceriesstore.presentation.delivery
+
+data class DeliveryModel(
+    val name: String,
+    val phoneNumber: String,
+    val street: String,
+    val district: String,
+    val province: String
+)
\ No newline at end of file
diff --git a/app/src/main/java/com/hieuwu/groceriesstore/presentation/delivery/DeliveryScreen.kt b/app/src/main/java/com/hieuwu/groceriesstore/presentation/delivery/DeliveryScreen.kt
new file mode 100644
index 00000000..206692e3
--- /dev/null
+++ b/app/src/main/java/com/hieuwu/groceriesstore/presentation/delivery/DeliveryScreen.kt
@@ -0,0 +1,145 @@
+package com.hieuwu.groceriesstore.presentation.delivery
+
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.rememberScrollState
+import androidx.compose.foundation.verticalScroll
+import androidx.compose.material.Icon
+import androidx.compose.material.IconButton
+import androidx.compose.material.Text
+import androidx.compose.material.TopAppBar
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.filled.NavigateBefore
+import androidx.compose.material3.Scaffold
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.setValue
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.res.colorResource
+import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.dp
+import com.hieuwu.groceriesstore.R
+import com.hieuwu.groceriesstore.presentation.core.widgets.PrimaryButton
+import com.hieuwu.groceriesstore.presentation.delivery.composables.Header
+import com.hieuwu.groceriesstore.presentation.delivery.composables.Input
+
+@Composable
+fun DeliveryScreen(
+    onNavigateBack: () -> Unit,
+    onUpdateClick: (DeliveryModel) -> Unit
+) {
+
+    var name by remember { mutableStateOf("") }
+    var phoneNumber by remember { mutableStateOf("") }
+    var street by remember { mutableStateOf("") }
+    var district by remember { mutableStateOf("") }
+    var province by remember { mutableStateOf("") }
+
+    Scaffold(
+        topBar = {
+            TopAppBar(
+                title = {
+                    Text(stringResource(id = R.string.delivery))
+                },
+                backgroundColor = colorResource(id = R.color.colorPrimary),
+                contentColor = Color.White,
+                navigationIcon = {
+                    IconButton(onClick = onNavigateBack) {
+                        Icon(
+                            imageVector = Icons.Filled.NavigateBefore,
+                            contentDescription = null
+                        )
+                    }
+                }
+            )
+        }
+    ) { paddingValues ->
+        Column(
+            modifier = Modifier
+                .fillMaxSize()
+                .padding(paddingValues)
+                .padding(16.dp)
+                .verticalScroll(rememberScrollState())
+        ) {
+
+            Header(title = "Receiver")
+
+            Input(
+                value = name,
+                placeholder = stringResource(id = R.string.name),
+                onValueChange = {
+                    name = it
+                }
+            )
+
+            Input(
+                value = phoneNumber,
+                placeholder = stringResource(R.string.phone_number),
+                onValueChange = {
+                    phoneNumber = it
+                }
+            )
+
+            Header(title = "Address")
+
+            Input(
+                value = street,
+                placeholder = "Street",
+                onValueChange = {
+                    street = it
+                }
+            )
+
+            Input(
+                value = district,
+                placeholder = "Ward/District",
+                onValueChange = {
+                    district = it
+                }
+            )
+
+            Input(
+                value = province,
+                placeholder = "Province/City",
+                onValueChange = {
+                    province = it
+                }
+            )
+
+            Spacer(modifier = Modifier.weight(1f))
+
+            PrimaryButton(
+                onClick = {
+                    onUpdateClick(
+                        DeliveryModel(
+                            name,
+                            phoneNumber,
+                            street,
+                            district,
+                            province
+                        )
+                    )
+                },
+                modifier = Modifier.fillMaxWidth()
+            ) {
+                Text(text = stringResource(id = R.string.update), color = Color.White)
+            }
+        }
+    }
+
+}
+
+@Preview(
+    heightDp = 700
+)
+@Composable
+fun DeliveryScreenPreview() {
+    DeliveryScreen(onNavigateBack = { /*TODO*/ }, onUpdateClick = {})
+}
\ No newline at end of file
diff --git a/app/src/main/java/com/hieuwu/groceriesstore/presentation/delivery/composables/Header.kt b/app/src/main/java/com/hieuwu/groceriesstore/presentation/delivery/composables/Header.kt
new file mode 100644
index 00000000..01f5238d
--- /dev/null
+++ b/app/src/main/java/com/hieuwu/groceriesstore/presentation/delivery/composables/Header.kt
@@ -0,0 +1,21 @@
+package com.hieuwu.groceriesstore.presentation.delivery.composables
+
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.padding
+import androidx.compose.material.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.text.font.FontWeight
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.unit.sp
+
+@Composable
+fun Header(
+    modifier: Modifier = Modifier,
+    title: String
+) {
+    Box(modifier = modifier.fillMaxWidth().padding(vertical = 8.dp)) {
+        Text(text = title, fontSize = 16.sp, fontWeight = FontWeight.Bold)
+    }
+}
\ No newline at end of file
diff --git a/app/src/main/java/com/hieuwu/groceriesstore/presentation/delivery/composables/Input.kt b/app/src/main/java/com/hieuwu/groceriesstore/presentation/delivery/composables/Input.kt
new file mode 100644
index 00000000..1c94b5f5
--- /dev/null
+++ b/app/src/main/java/com/hieuwu/groceriesstore/presentation/delivery/composables/Input.kt
@@ -0,0 +1,29 @@
+package com.hieuwu.groceriesstore.presentation.delivery.composables
+
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.material.TextField
+import androidx.compose.material3.Text
+import androidx.compose.material.TextFieldDefaults
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+
+@Composable
+fun Input(
+    modifier: Modifier = Modifier,
+    value: String,
+    placeholder: String,
+    onValueChange: (String) -> Unit
+) {
+    TextField(
+        value = value,
+        onValueChange = onValueChange,
+        placeholder = {
+             Text(text = placeholder)
+        },
+        modifier = modifier.fillMaxWidth(),
+        colors = TextFieldDefaults.textFieldColors(
+            backgroundColor = Color.Transparent
+        )
+    )
+}
\ No newline at end of file
diff --git a/app/src/main/res/layout/fragment_delivery.xml b/app/src/main/res/layout/fragment_delivery.xml
deleted file mode 100644
index 9e89d40a..00000000
--- a/app/src/main/res/layout/fragment_delivery.xml
+++ /dev/null
@@ -1,123 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<layout 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">
-
-    <LinearLayout
-        android:layout_width="match_parent"
-        android:layout_height="match_parent"
-        android:orientation="vertical"
-        tools:context=".presentation.delivery.DeliveryFragment">
-
-        <com.google.android.material.appbar.AppBarLayout
-            android:layout_width="match_parent"
-            android:layout_height="?android:attr/actionBarSize">
-
-            <com.google.android.material.appbar.MaterialToolbar
-                android:id="@+id/toolbar"
-                android:layout_width="match_parent"
-                android:layout_height="?attr/actionBarSize"
-                android:background="@android:color/transparent"
-                app:contentInsetStartWithNavigation="0dp"
-                app:navigationIcon="@drawable/ic_detail_back"
-                app:title="Delivery"
-                app:titleTextColor="@android:color/white"
-                app:toolbarId="@id/toolbar" />
-        </com.google.android.material.appbar.AppBarLayout>
-
-        <LinearLayout
-            android:layout_width="match_parent"
-            android:layout_height="0dp"
-            android:layout_weight="1.0"
-            android:orientation="vertical">
-
-            <TextView
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginVertical="@dimen/margin_small"
-                android:layout_marginLeft="@dimen/margin_medium"
-                android:text="@string/receiver"
-                android:textSize="16sp"
-                android:textStyle="bold" />
-
-            <EditText
-                android:id="@+id/receiver_name"
-                android:layout_width="match_parent"
-                android:layout_height="wrap_content"
-                android:layout_marginHorizontal="@dimen/margin_medium"
-                android:layout_marginBottom="@dimen/margin_small"
-                android:ems="10"
-                android:hint="@string/name"
-                android:inputType="textPersonName"
-                android:textColor="@android:color/darker_gray" />
-
-            <EditText
-                android:id="@+id/receiver_phone"
-                android:layout_width="match_parent"
-                android:layout_height="wrap_content"
-                android:layout_marginHorizontal="@dimen/margin_medium"
-                android:layout_marginBottom="@dimen/margin_small"
-                android:ems="10"
-                android:hint="@string/phone_number"
-                android:inputType="phone"
-                android:textColor="@android:color/darker_gray" />
-
-            <TextView
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginVertical="@dimen/margin_small"
-                android:layout_marginStart="@dimen/margin_medium"
-                android:text="@string/address"
-                android:textColor="@android:color/darker_gray"
-                android:textSize="16sp"
-                android:textStyle="bold" />
-
-            <EditText
-                android:id="@+id/address_street"
-                android:layout_width="match_parent"
-                android:layout_height="wrap_content"
-                android:layout_marginHorizontal="@dimen/margin_medium"
-                android:layout_marginBottom="@dimen/margin_small"
-                android:ems="10"
-                android:hint="Street"
-                android:inputType="textPersonName"
-                android:textColor="@android:color/darker_gray" />
-
-            <EditText
-                android:id="@+id/address_ward"
-                android:layout_width="match_parent"
-                android:layout_height="wrap_content"
-                android:layout_marginHorizontal="@dimen/margin_medium"
-                android:layout_marginBottom="@dimen/margin_small"
-                android:ems="10"
-                android:hint="Ward/District"
-                android:inputType="textPersonName"
-                android:textColor="@android:color/darker_gray" />
-
-            <EditText
-                android:id="@+id/address_city"
-                android:layout_width="match_parent"
-                android:layout_height="wrap_content"
-                android:layout_marginHorizontal="@dimen/margin_medium"
-                android:layout_marginBottom="@dimen/margin_small"
-                android:ems="10"
-                android:hint="Province/City"
-                android:inputType="textPersonName"
-                android:textColor="@android:color/darker_gray" />
-
-
-        </LinearLayout>
-
-        <Button
-            android:id="@+id/update_delivery_btn"
-            android:layout_width="match_parent"
-            android:layout_height="wrap_content"
-            android:layout_marginHorizontal="@dimen/margin_medium"
-            android:background="@drawable/primary_button"
-            android:text="@string/update"
-            android:textAllCaps="false"
-            android:layout_marginBottom="64dp"
-            android:textColor="@android:color/white" />
-
-    </LinearLayout>
-</layout>