diff --git a/library/ui-strings/src/main/res/values/strings.xml b/library/ui-strings/src/main/res/values/strings.xml
index 4ff7aae750..8520bfbed4 100644
--- a/library/ui-strings/src/main/res/values/strings.xml
+++ b/library/ui-strings/src/main/res/values/strings.xml
@@ -3323,5 +3323,9 @@
Tap top right to see the option to feedback.
Try it out
+
+
+ Scan QR code
+ Use the camera on this device to scan the QR code shown on your other device:
diff --git a/library/ui-styles/src/main/res/values/stylable_qr_code_login_header_view.xml b/library/ui-styles/src/main/res/values/stylable_qr_code_login_header_view.xml
new file mode 100644
index 0000000000..99f56084d9
--- /dev/null
+++ b/library/ui-styles/src/main/res/values/stylable_qr_code_login_header_view.xml
@@ -0,0 +1,11 @@
+
+
+
+
+
+
+
+
+
+
+
diff --git a/vector/src/main/java/im/vector/app/features/login/qr/QrCodeLoginHeaderView.kt b/vector/src/main/java/im/vector/app/features/login/qr/QrCodeLoginHeaderView.kt
new file mode 100644
index 0000000000..315369c462
--- /dev/null
+++ b/vector/src/main/java/im/vector/app/features/login/qr/QrCodeLoginHeaderView.kt
@@ -0,0 +1,69 @@
+/*
+ * Copyright (c) 2022 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package im.vector.app.features.login.qr
+
+import android.content.Context
+import android.content.res.ColorStateList
+import android.content.res.TypedArray
+import android.util.AttributeSet
+import android.view.LayoutInflater
+import androidx.constraintlayout.widget.ConstraintLayout
+import androidx.core.content.res.use
+import im.vector.app.R
+import im.vector.app.databinding.ViewQrCodeLoginHeaderBinding
+
+class QrCodeLoginHeaderView @JvmOverloads constructor(
+ context: Context,
+ attrs: AttributeSet? = null,
+ defStyleAttr: Int = 0
+) : ConstraintLayout(context, attrs, defStyleAttr) {
+
+ private val binding = ViewQrCodeLoginHeaderBinding.inflate(
+ LayoutInflater.from(context),
+ this
+ )
+
+ init {
+ context.obtainStyledAttributes(
+ attrs,
+ R.styleable.QrCodeLoginHeaderView,
+ 0,
+ 0
+ ).use {
+ setTitle(it)
+ setDescription(it)
+ setImage(it)
+ }
+ }
+
+ private fun setTitle(typedArray: TypedArray) {
+ val title = typedArray.getString(R.styleable.QrCodeLoginHeaderView_qrCodeLoginHeaderTitle)
+ binding.qrCodeLoginHeaderTitleTextView.text = title
+ }
+
+ private fun setDescription(typedArray: TypedArray) {
+ val description = typedArray.getString(R.styleable.QrCodeLoginHeaderView_qrCodeLoginHeaderDescription)
+ binding.qrCodeLoginHeaderDescriptionTextView.text = description
+ }
+
+ private fun setImage(typedArray: TypedArray) {
+ val imageResource = typedArray.getResourceId(R.styleable.QrCodeLoginHeaderView_qrCodeLoginHeaderImageResource, 0)
+ val backgroundTint = typedArray.getColor(R.styleable.QrCodeLoginHeaderView_qrCodeLoginHeaderImageBackgroundTint, 0)
+ binding.qrCodeLoginHeaderImageView.setImageResource(imageResource)
+ binding.qrCodeLoginHeaderImageView.backgroundTintList = ColorStateList.valueOf(backgroundTint)
+ }
+}
diff --git a/vector/src/main/java/im/vector/app/features/login/qr/QrCodeLoginInstructionsFragment.kt b/vector/src/main/java/im/vector/app/features/login/qr/QrCodeLoginInstructionsFragment.kt
new file mode 100644
index 0000000000..68848fad04
--- /dev/null
+++ b/vector/src/main/java/im/vector/app/features/login/qr/QrCodeLoginInstructionsFragment.kt
@@ -0,0 +1,29 @@
+/*
+ * Copyright (c) 2022 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package im.vector.app.features.login.qr
+
+import android.view.LayoutInflater
+import android.view.ViewGroup
+import im.vector.app.core.platform.VectorBaseFragment
+import im.vector.app.databinding.FragmentQrCodeLoginInstructionsBinding
+
+class QrCodeLoginInstructionsFragment : VectorBaseFragment() {
+
+ override fun getBinding(inflater: LayoutInflater, container: ViewGroup?): FragmentQrCodeLoginInstructionsBinding {
+ return FragmentQrCodeLoginInstructionsBinding.inflate(inflater, container, false)
+ }
+}
diff --git a/vector/src/main/res/layout/fragment_qr_code_login_instructions.xml b/vector/src/main/res/layout/fragment_qr_code_login_instructions.xml
new file mode 100644
index 0000000000..3f085b0aee
--- /dev/null
+++ b/vector/src/main/res/layout/fragment_qr_code_login_instructions.xml
@@ -0,0 +1,20 @@
+
+
+
+
+
+
diff --git a/vector/src/main/res/layout/view_qr_code_login_header.xml b/vector/src/main/res/layout/view_qr_code_login_header.xml
new file mode 100644
index 0000000000..4a734ec21e
--- /dev/null
+++ b/vector/src/main/res/layout/view_qr_code_login_header.xml
@@ -0,0 +1,48 @@
+
+
+
+
+
+
+
+
+
+