Submission Contact Fragment & StepView Custom View (#102)

* - submission-contact fragment added
- StepEntry custom view added to unify various step entry views
- SimpleStepEntry as a simple implementation of a StepEntry with title and text added

* - apply naming conventions for ids
- use CallHelper to trigger a call
- access views using kotlinx.android.synthetic

Co-authored-by: harambasicluka <64483219+harambasicluka@users.noreply.github.com>

Corona-Warn-App/src/main/java/de/rki/coronawarnapp/ui/submission/SubmissionContactFragment.kt

+package de.rki.coronawarnapp.ui.submission
+
+import android.os.Bundle
+import android.view.LayoutInflater
+import android.view.View
+import android.view.ViewGroup
+import de.rki.coronawarnapp.R
+import de.rki.coronawarnapp.databinding.FragmentSubmissionContactBinding
+import de.rki.coronawarnapp.ui.BaseFragment
+import de.rki.coronawarnapp.ui.main.MainActivity
+import de.rki.coronawarnapp.util.CallHelper
+
+/**
+ * The [SubmissionContactFragment] allows requesting a teletan via phone
+ */
+class SubmissionContactFragment : BaseFragment() {
+
+    private lateinit var binding: FragmentSubmissionContactBinding
+
+    override fun onCreateView(
+        inflater: LayoutInflater,
+        container: ViewGroup?,
+        savedInstanceState: Bundle?
+    ): View? {
+        // get the binding reference by inflating it with the current layout
+        binding = FragmentSubmissionContactBinding.inflate(inflater)
+        return binding.root
+    }
+
+    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
+        super.onViewCreated(view, savedInstanceState)
+        setButtonOnClickListener()
+    }
+
+    private fun setButtonOnClickListener() {
+        binding.submissionContactHeader.headerButtonBack.buttonIcon.setOnClickListener {
+            (activity as MainActivity).goBack()
+        }
+        binding.submissionContactButtonCall.setOnClickListener {
+            dial()
+        }
+        binding.submissionContactButtonEnter.setOnClickListener {
+            doNavigate(SubmissionContactFragmentDirections.actionSubmissionContactFragmentToSubmissionTanFragment())
+        }
+    }
+
+    private fun dial() = context?.let {
+        val number = getString(R.string.submission_contact_number)
+        CallHelper.call(this, "tel:$number")
+    }
+}

Corona-Warn-App/src/main/java/de/rki/coronawarnapp/ui/submission/SubmissionDispatcherFragment.kt

@@ -3,7 +3,6 @@ package de.rki.coronawarnapp.ui.submission
 import android.Manifest
 import android.content.pm.PackageManager
 import android.os.Bundle
-import android.util.Log
 import android.view.LayoutInflater
 import android.view.View
 import android.view.ViewGroup
@@ -48,7 +47,10 @@ class SubmissionDispatcherFragment : BaseFragment() {
             )
         }
         binding.submissionDispatcherTanTele.dispatcherCard.setOnClickListener {
-            Log.i(TAG, "TAN tele pressed")
+            doNavigate(
+                SubmissionDispatcherFragmentDirections
+                    .actionSubmissionDispatcherFragmentToSubmissionContactFragment()
+            )
         }
     }
 

Corona-Warn-App/src/main/java/de/rki/coronawarnapp/ui/view/SimpleStepEntry.kt

+package de.rki.coronawarnapp.ui.view
+
+import android.content.Context
+import android.util.AttributeSet
+import androidx.core.content.withStyledAttributes
+import de.rki.coronawarnapp.R
+import kotlinx.android.synthetic.main.include_step_entry_simple_body.view.*
+
+/**
+ * The [SimpleStepEntry] is a step entry with title and text as content.
+ */
+class SimpleStepEntry @JvmOverloads constructor(
+    context: Context,
+    attrs: AttributeSet? = null,
+    defStyleAttr: Int = 0
+) : StepEntry(context, attrs, defStyleAttr) {
+
+    init {
+        inflate(context, R.layout.include_step_entry_simple_body, this)
+
+        context.withStyledAttributes(attrs, R.styleable.SimpleStepEntry) {
+            simple_step_entry_title.text =
+                getText(R.styleable.SimpleStepEntry_simple_step_entry_title)
+
+            simple_step_entry_body.text =
+                getText(R.styleable.SimpleStepEntry_simple_step_entry_text)
+        }
+    }
+}

Corona-Warn-App/src/main/java/de/rki/coronawarnapp/ui/view/StepEntry.kt

+package de.rki.coronawarnapp.ui.view
+
+import android.content.Context
+import android.util.AttributeSet
+import android.view.View
+import android.view.ViewGroup
+import android.widget.FrameLayout
+import androidx.core.content.withStyledAttributes
+import de.rki.coronawarnapp.R
+import kotlinx.android.synthetic.main.view_step_entry.view.*
+
+/**
+ * The [StepEntry] displays one step in a sequence. Children can be added to define the content.
+ */
+open class StepEntry @JvmOverloads constructor(
+    context: Context,
+    attrs: AttributeSet? = null,
+    defStyleAttr: Int = 0
+) : FrameLayout(context, attrs, defStyleAttr) {
+
+    val body: FrameLayout?
+
+    init {
+        inflate(context, R.layout.view_step_entry, this)
+
+        body = findViewById(R.id.step_entry_wrapper_children)
+
+        context.withStyledAttributes(attrs, R.styleable.StepEntry) {
+            val icon = getDrawable(R.styleable.StepEntry_step_entry_icon)
+            step_entry_icon.setImageDrawable(icon)
+
+            val isFinal = getBoolean(R.styleable.StepEntry_step_entry_final, false)
+            step_entry_line.visibility = if (isFinal) {
+                View.INVISIBLE
+            } else {
+                View.VISIBLE
+            }
+        }
+    }
+
+    override fun addView(
+        child: View?,
+        index: Int,
+        params: ViewGroup.LayoutParams?
+    ) {
+        if (body == null)
+            super.addView(child, index, params)
+        else
+            body.addView(child, index, params)
+    }
+}

Corona-Warn-App/src/main/res/drawable/ic_step_1.xml

+<vector android:height="40dp" android:viewportHeight="24"
+    android:viewportWidth="24" android:width="40dp" xmlns:android="http://schemas.android.com/apk/res/android">
+    <path android:fillColor="#007FAD" android:fillType="nonZero"
+        android:pathData="M13,17C12.45,17 12,16.55 12,16L12,9L11,9C10.45,9 10,8.55 10,8C10,7.45 10.45,7 11,7L13,7C13.55,7 14,7.45 14,8L14,16C14,16.55 13.55,17 13,17Z"
+        android:strokeColor="#00000000" android:strokeWidth="1"/>
+</vector>

Corona-Warn-App/src/main/res/drawable/ic_step_2.xml

+<vector android:height="40dp" android:viewportHeight="24"
+    android:viewportWidth="24" android:width="40dp" xmlns:android="http://schemas.android.com/apk/res/android">
+    <path android:fillColor="#007FAD" android:fillType="nonZero"
+        android:pathData="M15,11C15,12.1 14.1,13 13,13L11,13L11,15L14,15C14.55,15 15,15.45 15,16C15,16.55 14.55,17 14,17L10,17C9.45,17 9,16.55 9,16L9,13C9,11.9 9.9,11 11,11L13,11L13,9L10,9C9.45,9 9,8.55 9,8C9,7.45 9.45,7 10,7L13,7C14.1,7 15,7.9 15,9L15,11Z"
+        android:strokeColor="#00000000" android:strokeWidth="1"/>
+</vector>

Corona-Warn-App/src/main/res/drawable/ic_step_background.xml

+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="40dp"
+    android:height="40dp"
+    android:viewportWidth="40"
+    android:viewportHeight="40">
+    <path
+        android:fillAlpha="0.1"
+        android:fillColor="#17191A"
+        android:fillType="evenOdd"
+        android:pathData="M20,32L20,32A0.5,0.5 0,0 1,20.5 32.5L20.5,151.5A0.5,0.5 0,0 1,20 152L20,152A0.5,0.5 0,0 1,19.5 151.5L19.5,32.5A0.5,0.5 0,0 1,20 32z"
+        android:strokeWidth="1"
+        android:strokeColor="#00000000" />
+    <path
+        android:fillColor="#F5F5F5"
+        android:fillType="evenOdd"
+        android:pathData="M20,20m-20,0a20,20 0,1 1,40 0a20,20 0,1 1,-40 0"
+        android:strokeWidth="1"
+        android:strokeColor="#00000000" />
+</vector>

Corona-Warn-App/src/main/res/layout/fragment_submission_contact.xml

+<?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">
+
+    <ScrollView
+        android:layout_width="match_parent"
+        android:layout_height="match_parent"
+        android:fillViewport="true"
+        tools:context=".ui.submission.SubmissionContactFragment">
+
+        <androidx.constraintlayout.widget.ConstraintLayout
+            android:layout_width="match_parent"
+            android:layout_height="wrap_content">
+
+            <include
+                android:id="@+id/submission_contact_header"
+                layout="@layout/include_header"
+                android:layout_width="@dimen/match_constraint"
+                android:layout_height="wrap_content"
+                app:icon="@{@drawable/ic_back}"
+                app:layout_constraintEnd_toEndOf="parent"
+                app:layout_constraintStart_toStartOf="parent"
+                app:layout_constraintTop_toTopOf="parent"
+                app:title="@{@string/submission_contact_title}" />
+
+            <include
+                layout="@layout/include_submission_contact"
+                android:layout_width="@dimen/match_constraint"
+                android:layout_height="@dimen/match_constraint"
+                app:layout_constraintBottom_toTopOf="@id/guideline_bottom"
+                app:layout_constraintEnd_toEndOf="parent"
+                app:layout_constraintStart_toStartOf="parent"
+                app:layout_constraintTop_toBottomOf="@+id/submission_contact_header" />
+
+            <Button
+                android:id="@+id/submission_contact_button_call"
+                style="@style/buttonPrimary"
+                android:layout_width="@dimen/match_constraint"
+                android:layout_height="wrap_content"
+                android:text="@string/submission_contact_button_call"
+                android:textAllCaps="true"
+                app:layout_constraintBottom_toTopOf="@+id/submission_contact_button_enter"
+                app:layout_constraintEnd_toStartOf="@+id/guideline_end"
+                app:layout_constraintStart_toStartOf="@id/guideline_start"
+                app:layout_constraintTop_toBottomOf="@+id/guideline_bottom" />
+
+            <Button
+                android:id="@+id/submission_contact_button_enter"
+                style="@style/buttonGrey"
+                android:layout_width="@dimen/match_constraint"
+                android:layout_height="wrap_content"
+                android:text="@string/submission_contact_button_enter"
+                android:textAllCaps="true"
+                app:layout_constraintBottom_toBottomOf="parent"
+                app:layout_constraintEnd_toStartOf="@+id/guideline_end"
+                app:layout_constraintStart_toStartOf="@id/guideline_start"
+                app:layout_constraintTop_toBottomOf="@+id/submission_contact_button_call" />
+
+            <androidx.constraintlayout.widget.Guideline
+                android:id="@+id/guideline_bottom"
+                android:layout_width="wrap_content"
+                android:layout_height="wrap_content"
+                android:orientation="horizontal"
+                app:layout_constraintGuide_end="@dimen/guideline_action_large" />
+
+            <include layout="@layout/merge_guidelines_common" />
+
+        </androidx.constraintlayout.widget.ConstraintLayout>
+
+    </ScrollView>
+</layout>
\ No newline at end of file

Corona-Warn-App/src/main/res/layout/include_step_entry_simple_body.xml

+<?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:layout_width="match_parent"
+    android:layout_height="wrap_content">
+
+    <TextView
+        android:id="@+id/simple_step_entry_title"
+        style="@style/textTitle"
+        android:layout_width="@dimen/match_constraint"
+        android:layout_height="wrap_content"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintTop_toTopOf="parent"
+        tools:text="Title" />
+
+    <TextView
+        android:id="@+id/simple_step_entry_body"
+        android:layout_width="@dimen/match_constraint"
+        android:layout_height="wrap_content"
+        android:layout_marginTop="@dimen/spacing_small"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintTop_toBottomOf="@+id/simple_step_entry_title"
+        tools:text="Text" />
+
+</androidx.constraintlayout.widget.ConstraintLayout>
\ No newline at end of file

Corona-Warn-App/src/main/res/layout/include_submission_contact.xml

+<?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">
+
+    <ScrollView
+        style="@style/fadingScrollView"
+        android:layout_width="match_parent"
+        android:layout_height="match_parent">
+
+        <androidx.constraintlayout.widget.ConstraintLayout
+            android:layout_width="match_parent"
+            android:layout_height="wrap_content">
+
+            <ImageView
+                android:id="@+id/submission_contact_illustration"
+                android:layout_width="@dimen/match_constraint"
+                android:layout_height="wrap_content"
+                android:src="@drawable/ic_information_illustration_contact"
+                app:layout_constraintEnd_toEndOf="parent"
+                app:layout_constraintStart_toStartOf="parent"
+                app:layout_constraintTop_toTopOf="parent" />
+
+            <TextView
+                android:id="@+id/submission_contact_body"
+                style="@style/textMultiline"
+                android:layout_width="@dimen/match_constraint"
+                android:layout_height="wrap_content"
+                android:layout_marginTop="@dimen/spacing_small"
+                android:text="@string/submission_contact_body"
+                app:layout_constraintEnd_toStartOf="@+id/guideline_end"
+                app:layout_constraintStart_toStartOf="@+id/guideline_start"
+                app:layout_constraintTop_toBottomOf="@id/submission_contact_illustration" />
+
+            <TextView
+                android:id="@+id/submission_contact_headline"
+                style="@style/textTitle"
+                android:layout_width="@dimen/match_constraint"
+                android:layout_height="wrap_content"
+                android:layout_marginTop="@dimen/spacing_normal"
+                android:text="@string/submission_contact_headline"
+                app:layout_constraintEnd_toEndOf="parent"
+                app:layout_constraintStart_toStartOf="@id/guideline_start"
+                app:layout_constraintTop_toBottomOf="@+id/submission_contact_body" />
+
+
+            <de.rki.coronawarnapp.ui.view.StepEntry
+                android:id="@+id/submission_contact_step_1"
+                android:layout_width="@dimen/match_constraint"
+                android:layout_height="wrap_content"
+                android:layout_marginTop="@dimen/spacing_normal"
+                app:layout_constraintEnd_toStartOf="@+id/guideline_end"
+                app:layout_constraintStart_toStartOf="@+id/guideline_start"
+                app:layout_constraintTop_toBottomOf="@id/submission_contact_headline"
+                app:step_entry_final="false"
+                app:step_entry_icon="@drawable/ic_step_1">
+
+                <androidx.constraintlayout.widget.ConstraintLayout
+                    android:layout_width="match_parent"
+                    android:layout_height="wrap_content">
+
+                    <TextView
+                        android:id="@+id/submission_contact_step_1_body"
+                        android:layout_width="@dimen/match_constraint"
+                        android:layout_height="wrap_content"
+                        android:layout_marginTop="@dimen/button_icon_margin"
+                        android:text="@string/submission_contact_step_1_body"
+                        app:layout_constraintEnd_toEndOf="parent"
+                        app:layout_constraintStart_toStartOf="parent"
+                        app:layout_constraintTop_toTopOf="parent" />
+
+                    <TextView
+                        android:id="@+id/submission_contact_step_1_number"
+                        style="@style/textTitle"
+                        android:layout_width="@dimen/match_constraint"
+                        android:layout_height="wrap_content"
+                        android:layout_marginTop="@dimen/spacing_small"
+                        android:text="@string/submission_contact_number"
+                        android:textColor="@color/textColorBlue"
+                        app:layout_constraintEnd_toEndOf="parent"
+                        app:layout_constraintStart_toStartOf="parent"
+                        app:layout_constraintTop_toBottomOf="@id/submission_contact_step_1_body" />
+
+                </androidx.constraintlayout.widget.ConstraintLayout>
+
+            </de.rki.coronawarnapp.ui.view.StepEntry>
+
+            <de.rki.coronawarnapp.ui.view.StepEntry
+                android:id="@+id/submission_contact_step_2"
+                android:layout_width="@dimen/match_constraint"
+                android:layout_height="wrap_content"
+                app:layout_constraintEnd_toStartOf="@+id/guideline_end"
+                app:layout_constraintStart_toStartOf="@+id/guideline_start"
+                app:layout_constraintTop_toBottomOf="@+id/submission_contact_step_1"
+                app:step_entry_final="true"
+                app:step_entry_icon="@drawable/ic_step_2">
+
+                <TextView
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:text="@string/submission_contact_step_2_body" />
+
+            </de.rki.coronawarnapp.ui.view.StepEntry>
+
+            <include layout="@layout/merge_guidelines_common" />
+
+        </androidx.constraintlayout.widget.ConstraintLayout>
+
+    </ScrollView>
+</layout>
\ No newline at end of file

Corona-Warn-App/src/main/res/layout/view_step_entry.xml

+<?xml version="1.0" encoding="utf-8"?>
+<merge xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:app="http://schemas.android.com/apk/res-auto">
+
+    <androidx.constraintlayout.widget.ConstraintLayout
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content">
+
+        <ImageView
+            android:id="@+id/step_entry_icon"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:background="@drawable/ic_step_background"
+            android:src="@drawable/ic_step_1"
+            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintTop_toTopOf="parent" />
+
+        <FrameLayout
+            android:id="@+id/step_entry_wrapper_children"
+            android:layout_width="@dimen/match_constraint"
+            android:layout_height="wrap_content"
+            android:layout_marginStart="@dimen/spacing_small"
+            app:layout_constraintEnd_toEndOf="parent"
+            app:layout_constraintStart_toEndOf="@id/step_entry_icon"
+            app:layout_constraintTop_toTopOf="parent">
+
+        </FrameLayout>
+
+        <View
+            android:id="@+id/step_entry_placeholder"
+            android:layout_width="@dimen/match_constraint"
+            android:layout_height="@dimen/spacing_large"
+            app:layout_constraintEnd_toEndOf="parent"
+            app:layout_constraintStart_toStartOf="@id/step_entry_icon"
+            app:layout_constraintTop_toBottomOf="@id/step_entry_wrapper_children" />
+
+        <View
+            android:id="@+id/step_entry_line"
+            android:layout_width="@dimen/test_result_step_progress_line_width"
+            android:layout_height="@dimen/match_constraint"
+            android:background="@color/colorGreyLight"
+            app:layout_constraintBottom_toBottomOf="@+id/step_entry_placeholder"
+            app:layout_constraintEnd_toEndOf="@id/step_entry_icon"
+            app:layout_constraintStart_toStartOf="@id/step_entry_icon"
+            app:layout_constraintTop_toBottomOf="@id/step_entry_icon" />
+
+    </androidx.constraintlayout.widget.ConstraintLayout>
+
+</merge>
\ No newline at end of file

Corona-Warn-App/src/main/res/navigation/nav_graph.xml

@@ -186,6 +186,9 @@
         <action
             android:id="@+id/action_submissionDispatcherFragment_to_submissionQRCodeScanFragment"
             app:destination="@id/submissionQRCodeScanFragment" />
+        <action
+            android:id="@+id/action_submissionDispatcherFragment_to_submissionContactFragment"
+            app:destination="@id/submissionContactFragment" />
     </fragment>
     <fragment
         android:id="@+id/submissionResultPositiveOtherWarningFragment"
@@ -289,4 +292,12 @@
             app:popUpTo="@id/mainFragment"
             app:popUpToInclusive="true" />
     </fragment>
+    <fragment
+        android:id="@+id/submissionContactFragment"
+        android:name="de.rki.coronawarnapp.ui.submission.SubmissionContactFragment"
+        android:label="SubmissionContactFragment">
+        <action
+            android:id="@+id/action_submissionContactFragment_to_submissionTanFragment"
+            app:destination="@id/submissionTanFragment" />
+    </fragment>
 </navigation>

Corona-Warn-App/src/main/res/values/attrs.xml

@@ -7,4 +7,14 @@
         <attr name="onboarding_exchangeable_body" format="string" />
         <attr name="onboarding_exchangeable_body_notifications" format="string" />
     </declare-styleable> -->
+
+    <declare-styleable name="StepEntry">
+        <attr name="step_entry_icon" format="integer" />
+        <attr name="step_entry_final" format="boolean" />
+    </declare-styleable>
+
+    <declare-styleable name="SimpleStepEntry">
+        <attr name="simple_step_entry_title" format="string" />
+        <attr name="simple_step_entry_text" format="string" />
+    </declare-styleable>
 </resources>
\ No newline at end of file

Corona-Warn-App/src/main/res/values/strings.xml

@@ -445,6 +445,15 @@
     <string name="submission_done_contagious">Sie sind ansteckend.</string>
     <string name="submission_done_isolate">Bitte isolieren Sie sich von anderen Personen.</string>
     <string name="submission_done_button_done">Fertig</string>
+    <!-- Submission Contact -->
+    <string name="submission_contact_title">TAN anfragen</string>
+    <string name="submission_contact_headline">Info zum Ablauf:</string>
+    <string name="submission_contact_body">Wir teilen Ihnen Ihren TAN-Code gerne per Telefon mit.</string>
+    <string name="submission_contact_button_call">Anrufen</string>
+    <string name="submission_contact_button_enter">TAN-Code eingeben</string>
+    <string name="submission_contact_step_1_body"><![CDATA[Hotline anrufen & TAN erfragen:]]></string>
+    <string name="submission_contact_number">0800 7540002</string>
+    <string name="submission_contact_step_2_body">Test per TAN-Eingabe in der App registrieren</string>
 
     <!-- ####################################
            Just for Development