I have a fragment that I need show and gone some XML layout into that with some steps (in this example I have 3 steps) I know simply we can include layout into parent fragment layout and just handle visible/gone layout. but I want to do it with ConstraintSet in ConstraintLayout. as I search for load another XML layout into parent XML layout both root elements in each XML layout must be constraint layout with the same component and same ids. but in my example, I have different XML layout with root element constraint layout but in each XML layout, I have different components and ids. now my question is how I can change part of my XML layout according to the step live data with another XML layout? we care about be smooth this layout and change layout with some animation. these are my files:
PickupFragment:
class PickupFragment : BaseFragment<FragmentPickupBinding, PickupViewModel>
(R.layout.fragment_pickup, PickupViewModel()) {
private val primaryConstraintBody = ConstraintSet()
private val parcelConstraintBody = ConstraintSet()
private val senderConstraintBody = ConstraintSet()
private val receiverConstraintBody = ConstraintSet()
private val body by lazy { binding.body }
private val pickupRequestStepObserver = Observer<Int> { step ->
when (step) {
0 -> parcelConstraintBody.loading(body)
1 -> senderConstraintBody.loading(body)
2 -> receiverConstraintBody.loading(body)
}
}
override fun initVariables() {
binding.viewModel = vModel
}
override fun initObserves() {
vModel.pickupRequestStep.observe(this, pickupRequestStepObserver)
}
override fun initViews() {
vModel.pickupRequestStep.value = 0
primaryConstraintBody.clone(body)
parcelConstraintBody.clone(context, R.layout.fragment_pickup_parcel)
senderConstraintBody.clone(context, R.layout.fragment_pickup_sender)
receiverConstraintBody.clone(context, R.layout.fragment_pickup_receiver)
}
}
fragment_pickup:
<?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">
<data>
<variable
name="viewModel"
type="com.chaparnet.chapar.views.pickup.PickupViewModel" />
</data>
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/body">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/constraintBody"
android:layout_width="match_parent"
android:layout_height="match_parent">
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
</layout>
fragment_pickup_parcel:
<?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">
<data>
<variable
name="viewModel"
type="com.chaparnet.chapar.views.pickup.PickupViewModel" />
</data>
<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/constraintBody"
android:layout_width="match_parent"
android:layout_height="wrap_content"
tools:context=".delivery_pickup.AddCargoFragment">
<TextView
android:id="@+id/txt_text_add_pickup"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="32dp"
android:layout_marginRight="16dp"
android:fontFamily="@font/main_bold"
android:text=" "
android:textColor="@color/colorPrimary"
android:textSize="18sp"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="@+id/txt_text_new_pickup_waybill"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="40dp"
android:layout_marginRight="16dp"
android:fontFamily="@font/main_medium"
android:text=""
android:textColor="@color/lightGray"
android:textSize="14sp"
android:visibility="gone"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="@id/txt_text_add_pickup" />
<EditText
android:id="@+id/et_new_pickup_waybill"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="16dp"
android:layout_marginTop="24dp"
android:layout_marginRight="8dp"
android:background="@android:color/transparent"
android:fontFamily="@font/main_medium"
android:gravity="right"
android:inputType="number"
android:paddingLeft="16dp"
android:paddingTop="16dp"
android:paddingRight="100dp"
android:paddingBottom="16dp"
android:textColor="@color/darkGray"
android:textSize="14sp"
android:visibility="gone"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="@id/txt_text_add_pickup" />
<View
android:id="@+id/view_waybill"
android:layout_width="match_parent"
android:layout_height="@dimen/divider_height"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:background="@color/lighterGray"
android:visibility="gone"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="@id/et_new_pickup_waybill" />
<TextView
android:id="@+id/txt_text_new_pickup_closed_count"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
android:layout_marginRight="16dp"
android:fontFamily="@font/main_medium"
android:text=" "
android:textColor="@color/lightGray"
android:textSize="14sp"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="@id/view_waybill" />
<EditText
android:id="@+id/et_new_pickup_closed_count"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="16dp"
android:layout_marginRight="8dp"
android:background="@android:color/transparent"
android:fontFamily="@font/main_medium"
android:gravity="right"
android:inputType="number"
android:paddingLeft="16dp"
android:paddingTop="16dp"
android:paddingRight="100dp"
android:paddingBottom="16dp"
android:text="@={viewModel.pickupClosedCount}"
android:textColor="@color/darkGray"
android:textSize="14sp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="@id/view_waybill" />
<View
android:id="@+id/view_closed_count"
android:layout_width="match_parent"
android:layout_height="@dimen/divider_height"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:background="@color/lighterGray"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="@id/et_new_pickup_closed_count" />
<TextView
android:id="@+id/txt_text_new_pickup_kind_service"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
android:layout_marginRight="16dp"
android:fontFamily="@font/main_medium"
android:text=" "
android:textColor="@color/lightGray"
android:textSize="14sp"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="@id/view_closed_count" />
<Spinner
android:id="@+id/spinner_new_pickup_kind_service"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="16dp"
android:layout_marginTop="14dp"
android:layout_marginRight="100dp"
android:paddingLeft="16dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="@id/view_closed_count" />
<View
android:id="@+id/view_kind_service"
android:layout_width="match_parent"
android:layout_height="@dimen/divider_height"
android:layout_marginLeft="20dp"
android:layout_marginTop="16dp"
android:layout_marginRight="20dp"
android:background="@color/lighterGray"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="@id/txt_text_new_pickup_kind_service" />
<TextView
android:id="@+id/txt_text_new_pickup_kind_rent"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
android:layout_marginRight="16dp"
android:fontFamily="@font/main_medium"
android:text=""
android:textColor="@color/lightGray"
android:textSize="14sp"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="@id/view_kind_service" />
<!--<androidx.appcompat.widget.AppCompatSpinner
android:id="@+id/spinner_new_pickup_kind_rent"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="16dp"
android:layout_marginTop="16dp"
android:layout_marginRight="100dp"
android:paddingLeft="16dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="@id/view_kind_service" />-->
<RadioGroup
android:id="@+id/spinner_new_pickup_kind_rent"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="16dp"
android:layout_marginTop="10dp"
android:layout_marginRight="100dp"
android:gravity="center"
android:orientation="horizontal"
android:paddingLeft="16dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="@id/view_kind_service">
<RadioButton
android:id="@+id/radio1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="start"
android:layout_marginRight="16dp"
android:button="@null"
android:checked="@={viewModel.radioPasPayment}"
android:drawableRight="?android:attr/listChoiceIndicatorSingle"
android:fontFamily="@font/main_light"
android:layoutDirection="rtl"
android:text=""
android:textAlignment="textStart"
android:textSize="12sp" />
<RadioButton
android:id="@+id/radio2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="start"
android:button="@null"
android:checked="@={viewModel.radioPishPayment}"
android:drawableRight="?android:attr/listChoiceIndicatorSingle"
android:fontFamily="@font/main_light"
android:layoutDirection="rtl"
android:text=""
android:textAlignment="textStart"
android:textSize="12sp" />
</RadioGroup>
<View
android:id="@+id/view_kind_rent"
android:layout_width="match_parent"
android:layout_height="@dimen/divider_height"
android:layout_marginLeft="20dp"
android:layout_marginTop="16dp"
android:layout_marginRight="20dp"
android:background="@color/lighterGray"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="@id/txt_text_new_pickup_kind_rent" />
<!--<TextView
android:id="@+id/txt_text_new_service_percentage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
android:layout_marginRight="16dp"
android:fontFamily="@font/main_medium"
android:tag="check_for_visibility"
android:text="Service percent"
android:textColor="@color/lightGray"
android:textSize="14sp"
android:visibility="gone"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="@id/view_kind_rent" />
<EditText
android:id="@+id/et_new_pickup_service_percentage"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="16dp"
android:layout_marginRight="8dp"
android:background="@android:color/transparent"
android:fontFamily="@font/main_medium"
android:gravity="right"
android:inputType="number"
android:paddingLeft="16dp"
android:paddingTop="16dp"
android:paddingRight="100dp"
android:paddingBottom="16dp"
android:tag="check_for_visibility"
android:textColor="@color/darkGray"
android:textSize="14sp"
android:visibility="gone"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="@id/view_kind_rent" />
<View
android:id="@+id/view_kind_service_percentage"
android:layout_width="match_parent"
android:layout_height="@dimen/divider_height"
android:layout_marginLeft="20dp"
android:layout_marginTop="16dp"
android:layout_marginRight="20dp"
android:background="@color/lighterGray"
android:tag="check_for_visibility"
android:visibility="gone"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="@id/txt_text_new_service_percentage" />-->
<TextView
android:id="@+id/txt_text_new_weight_of_goods"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
android:layout_marginRight="16dp"
android:fontFamily="@font/main_medium"
android:tag="check_for_visibility"
android:text="weight"
android:textColor="@color/lightGray"
android:textSize="14sp"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="@id/view_kind_rent" />
<EditText
android:id="@+id/et_new_pickup_weight_of_goods"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="16dp"
android:layout_marginRight="8dp"
android:background="@android:color/transparent"
android:fontFamily="@font/main_medium"
android:gravity="right"
android:inputType="number"
android:paddingLeft="16dp"
android:paddingTop="16dp"
android:paddingRight="100dp"
android:paddingBottom="16dp"
android:tag="check_for_visibility"
android:text="@={viewModel.weightOfGoods}"
android:textColor="@color/darkGray"
android:textSize="14sp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="@id/view_kind_rent" />
<View
android:id="@+id/view_weight_of_goods"
android:layout_width="match_parent"
android:layout_height="@dimen/divider_height"
android:layout_marginLeft="20dp"
android:layout_marginTop="16dp"
android:layout_marginRight="20dp"
android:background="@color/lighterGray"
android:tag="check_for_visibility"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="@id/txt_text_new_weight_of_goods" />
<TextView
android:id="@+id/txt_text_new_value_of_goods"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
android:layout_marginRight="16dp"
android:fontFamily="@font/main_medium"
android:tag="check_for_visibility"
android:text="Value"
android:textColor="@color/lightGray"
android:textSize="14sp"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="@id/view_weight_of_goods" />
<EditText
android:id="@+id/et_new_pickup_value_of_goods"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="16dp"
android:layout_marginRight="8dp"
android:background="@android:color/transparent"
android:fontFamily="@font/main_medium"
android:gravity="right"
android:inputType="number"
android:paddingLeft="16dp"
android:paddingTop="16dp"
android:paddingRight="100dp"
android:paddingBottom="16dp"
android:tag="check_for_visibility"
android:text="@={viewModel.valueOfGoods}"
android:textColor="@color/darkGray"
android:textSize="14sp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="@id/view_weight_of_goods" />
</androidx.constraintlayout.widget.ConstraintLayout>
</layout>
and two other fragments are like fragment_pickup_sender and fragment_pickup_receiver but with different components and ids. in my fragment_pickup I'll have some button with next step and the previous step for update step live data to switch XML layout. may please guide me on how I must handle this