<?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="voiceResultViewModel"
            type="com.atmob.voiceai.module.result.VoiceResultViewModel" />

        <import type="com.atmob.common.ui.SizeUtil" />

        <import type="com.atmob.voiceai.utils.DateUtil" />
    </data>

    <androidx.constraintlayout.widget.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:src="@drawable/bg_voice_result_header_background"
            app:layout_constraintDimensionRatio="1080:1254"
            app:layout_constraintTop_toTopOf="parent" />

        <Space
            android:id="@+id/v_status_bar"
            android:layout_width="match_parent"
            android:layout_height="@{SizeUtil.getStatusBarHeight(), default=@dimen/app_status_bar_height}"
            app:layout_constraintTop_toTopOf="parent" />

        <View
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:background="#32333C"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintDimensionRatio="360:200" />

        <ScrollView
            android:layout_width="match_parent"
            android:layout_height="0dp"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/v_status_bar">

            <androidx.constraintlayout.widget.ConstraintLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content">

                <Space
                    android:id="@+id/sapce2"
                    android:layout_width="match_parent"
                    android:layout_height="0dp"
                    app:layout_constraintDimensionRatio="360:60"
                    app:layout_constraintTop_toTopOf="parent" />


                <ImageView
                    android:id="@+id/iv_avatar"
                    imageUrl="@{voiceResultViewModel.resultBean.voiceAvatar}"
                    radius="@{20}"
                    placeholder="@{null}"
                    error="@{null}"
                    android:layout_width="0dp"
                    android:layout_height="0dp"
                    app:layout_constraintDimensionRatio="1:1"
                    app:layout_constraintEnd_toEndOf="parent"
                    app:layout_constraintStart_toStartOf="parent"
                    app:layout_constraintTop_toBottomOf="@+id/sapce2"
                    app:layout_constraintWidth_percent="0.6" />

                <TextView
                    android:id="@+id/tv_name"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="16dp"
                    android:text="@{voiceResultViewModel.resultBean.voiceName}"
                    android:textColor="@color/white80"
                    android:textSize="30sp"
                    android:textStyle="bold"
                    app:layout_constraintEnd_toEndOf="@+id/iv_avatar"
                    app:layout_constraintStart_toStartOf="@+id/iv_avatar"
                    app:layout_constraintTop_toBottomOf="@+id/iv_avatar"
                    tools:text="Taylor Swift" />

                <Space
                    android:id="@+id/sapce3"
                    android:layout_width="match_parent"
                    android:layout_height="0dp"
                    app:layout_constraintDimensionRatio="360:31"
                    app:layout_constraintTop_toBottomOf="@+id/tv_name" />

                <SeekBar
                    android:id="@+id/voice_seek_bar"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginHorizontal="20dp"
                    android:max="@{(int)voiceResultViewModel.totalDuration}"
                    android:maxHeight="2dp"
                    android:minHeight="2dp"
                    android:paddingStart="6dp"
                    android:paddingEnd="6dp"
                    android:progress="@{(int)voiceResultViewModel.currentDuration}"
                    android:progressDrawable="@drawable/shape_preview_audio_seekbar"
                    android:splitTrack="false"
                    android:thumb="@drawable/shape_preview_audio_seekbar_thumb"
                    app:layout_constraintTop_toBottomOf="@id/sapce3"
                    tools:progress="30" />

                <TextView
                    android:id="@+id/tv_current_time"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginStart="6dp"
                    android:layout_marginTop="3dp"
                    android:text="@{DateUtil.formatDuration(voiceResultViewModel.currentDuration)}"
                    android:textColor="@color/white50"
                    android:textSize="12sp"
                    app:layout_constraintLeft_toLeftOf="@+id/voice_seek_bar"
                    app:layout_constraintTop_toBottomOf="@+id/voice_seek_bar"
                    tools:text="00:53" />

                <TextView
                    android:id="@+id/tv_total_time"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginEnd="6dp"
                    android:text="@{DateUtil.formatDuration(voiceResultViewModel.totalDuration)}"
                    android:textColor="@color/white50"
                    android:textSize="12sp"
                    app:layout_constraintEnd_toEndOf="@id/voice_seek_bar"
                    app:layout_constraintTop_toBottomOf="@+id/voice_seek_bar"
                    app:layout_constraintTop_toTopOf="@+id/tv_current_time"
                    tools:text="02:53" />

                <Space
                    android:id="@+id/sapce4"
                    android:layout_width="match_parent"
                    android:layout_height="0dp"
                    app:layout_constraintDimensionRatio="360:16"
                    app:layout_constraintTop_toBottomOf="@+id/tv_current_time" />


                <Space
                    android:id="@+id/space_play"
                    android:layout_width="0dp"
                    android:layout_height="0dp"
                    app:layout_constraintDimensionRatio="216:48"
                    app:layout_constraintEnd_toEndOf="parent"
                    app:layout_constraintStart_toStartOf="parent"
                    app:layout_constraintTop_toBottomOf="@+id/sapce4"
                    app:layout_constraintWidth_percent="0.6" />

                <ImageView
                    android:id="@+id/iv_voice_reduce"
                    android:layout_width="0dp"
                    android:layout_height="0dp"
                    android:src="@drawable/icon_voice_reduce"
                    app:layout_constraintBottom_toBottomOf="@+id/iv_play"
                    app:layout_constraintDimensionRatio="1:1"
                    app:layout_constraintStart_toStartOf="@+id/space_play"
                    app:layout_constraintTop_toTopOf="@+id/iv_play" />

                <ImageView
                    android:id="@+id/iv_play"
                    android:layout_width="0dp"
                    android:layout_height="0dp"
                    android:src="@{voiceResultViewModel.isPlay ? @drawable/icon_voice_playing: @drawable/icon_voice_suspend}"
                    app:layout_constraintBottom_toBottomOf="@+id/space_play"
                    app:layout_constraintDimensionRatio="1:1"
                    app:layout_constraintEnd_toEndOf="@+id/space_play"
                    app:layout_constraintStart_toStartOf="@+id/space_play"
                    app:layout_constraintTop_toTopOf="@+id/space_play"
                    app:layout_constraintWidth_percent="0.1333333333333333"
                    tools:src="@drawable/icon_voice_playing" />

                <ImageView
                    android:id="@+id/iv_voice_speed"
                    android:layout_width="0dp"
                    android:layout_height="0dp"
                    android:src="@drawable/icon_voice_speed_up"
                    app:layout_constraintBottom_toBottomOf="@+id/iv_play"
                    app:layout_constraintDimensionRatio="1:1"
                    app:layout_constraintEnd_toEndOf="@+id/space_play"
                    app:layout_constraintTop_toTopOf="@+id/iv_play" />

                <Space
                    android:id="@+id/sapce5"
                    android:layout_width="match_parent"
                    android:layout_height="0dp"
                    app:layout_constraintDimensionRatio="360:36"
                    app:layout_constraintTop_toBottomOf="@+id/space_play" />

                <View
                    android:id="@+id/view_voice_recommend_container"
                    android:layout_width="match_parent"
                    android:layout_height="0dp"
                    android:background="@drawable/bg_voice_recommend_container"
                    app:layout_constraintBottom_toBottomOf="parent"
                    app:layout_constraintDimensionRatio="360:260"
                    app:layout_constraintTop_toBottomOf="@+id/sapce5" />

                <View
                    android:id="@+id/view_voice_recommend_label"
                    android:layout_width="0dp"
                    android:layout_height="0dp"
                    android:layout_marginTop="12dp"
                    android:background="@drawable/bg_voice_recommend_label"
                    app:layout_constraintDimensionRatio="42:6"
                    app:layout_constraintEnd_toEndOf="@+id/view_voice_recommend_container"
                    app:layout_constraintStart_toStartOf="@+id/view_voice_recommend_container"
                    app:layout_constraintTop_toTopOf="@+id/view_voice_recommend_container"
                    app:layout_constraintWidth_percent="0.1166666666666667" />

                <TextView
                    android:id="@+id/tv_recommend"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginStart="16dp"
                    android:layout_marginTop="22dp"
                    android:text="@string/voice_result_recommend"
                    android:textColor="@color/white"
                    android:textSize="16sp"
                    app:layout_constraintStart_toStartOf="@+id/view_voice_recommend_container"
                    app:layout_constraintTop_toBottomOf="@+id/view_voice_recommend_label" />

                <androidx.recyclerview.widget.RecyclerView
                    android:id="@+id/rv_recommend"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="20dp"
                    android:fadingEdge="horizontal"
                    android:fadingEdgeLength="10dp"
                    android:paddingStart="16dp"
                    android:requiresFadingEdge="horizontal"
                    app:layout_constraintEnd_toEndOf="@+id/view_voice_recommend_container"
                    app:layout_constraintStart_toStartOf="@+id/view_voice_recommend_container"
                    app:layout_constraintTop_toBottomOf="@+id/tv_recommend"
                    tools:layoutManager="androidx.recyclerview.widget.LinearLayoutManager"
                    tools:listitem="@layout/item_voice_ai_result_recommend"
                    tools:orientation="horizontal" />

            </androidx.constraintlayout.widget.ConstraintLayout>

        </ScrollView>

        <Space
            android:id="@+id/sapce1"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            app:layout_constraintDimensionRatio="360:10"
            app:layout_constraintTop_toBottomOf="@+id/v_status_bar" />

        <ImageView
            android:id="@+id/iv_back"
            expandTouchSize="@{5}"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_marginStart="@dimen/app_common_page_horizontal_padding"
            android:src="@drawable/icon_result_back"
            app:layout_constraintDimensionRatio="1:1"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/sapce1"
            app:layout_constraintWidth_percent="0.0666666666666667" />

        <View
            android:background="@drawable/bg_ripple_common_oval_mask"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:onClick="@{()-> voiceResultViewModel.onBackClick()}"
            android:padding="12dp"
            app:layout_constraintBottom_toBottomOf="@id/iv_back"
            app:layout_constraintDimensionRatio="1:1"
            app:layout_constraintEnd_toEndOf="@+id/iv_back"
            app:layout_constraintStart_toStartOf="@+id/iv_back"
            app:layout_constraintTop_toTopOf="@id/iv_back"
            app:layout_constraintWidth_percent="0.1111111111111111" />


        <TextView
            android:id="@+id/tv_save"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_marginStart="16dp"
            android:layout_marginBottom="12dp"
            android:background="@drawable/bg_voice_result_save"
            android:gravity="center"
            android:onClick="@{()-> voiceResultViewModel.onSaveClick()}"
            android:text="@string/voice_result_save"
            android:textColor="@color/white"
            android:textSize="17sp"
            android:textStyle="bold"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintDimensionRatio="158:48"
            app:layout_constraintHorizontal_chainStyle="packed"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintRight_toLeftOf="@+id/tv_share"
            app:layout_constraintWidth_percent="0.4388888888888889" />

        <TextView
            android:id="@+id/tv_share"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_marginStart="12dp"
            android:background="@drawable/bg_voice_ai_btn"
            android:gravity="center"
            android:onClick="@{()-> voiceResultViewModel.onShareClick()}"
            android:text="@string/voice_result_share"
            android:textColor="@color/colorPrimary"
            android:textSize="17sp"
            android:textStyle="bold"
            app:layout_constraintDimensionRatio="158:48"
            app:layout_constraintLeft_toRightOf="@+id/tv_save"
            app:layout_constraintRight_toRightOf="parent"
            app:layout_constraintTop_toTopOf="@id/tv_save"
            app:layout_constraintWidth_percent="0.4388888888888889" />

    </androidx.constraintlayout.widget.ConstraintLayout>
</layout>