Create dedicated View and Epoxy item for QrCode

vector/src/debug/java/im/vector/riotx/features/debug/DebugMenuActivity.kt

@@ -29,7 +29,6 @@ import im.vector.riotx.R
 import im.vector.riotx.core.di.ActiveSessionHolder
 import im.vector.riotx.core.di.ScreenComponent
 import im.vector.riotx.core.platform.VectorBaseActivity
-import im.vector.riotx.core.qrcode.toQrCode
 import im.vector.riotx.core.utils.PERMISSIONS_FOR_TAKING_PHOTO
 import im.vector.riotx.core.utils.PERMISSION_REQUEST_CODE_LAUNCH_CAMERA
 import im.vector.riotx.core.utils.allGranted
@@ -56,8 +55,7 @@ class DebugMenuActivity : VectorBaseActivity() {
     }
 
     private fun renderQrCode(text: String) {
-        val qrBitmap = text.toQrCode(200, 200)
+        debug_qr_code.setData(text, true)
-        debug_qr_code.setImageBitmap(qrBitmap)
     }
 
     @OnClick(R.id.debug_test_text_view_link)

vector/src/debug/res/layout/activity_debug_menu.xml

@@ -68,7 +68,7 @@
                 android:layout_height="wrap_content"
                 android:text="Scan QR-code" />
 
-            <ImageView
+            <im.vector.riotx.core.ui.views.QrCodeImageView
                 android:id="@+id/debug_qr_code"
                 android:layout_width="200dp"
                 android:layout_height="200dp"

vector/src/main/java/im/vector/riotx/core/qrcode/QrCode.kt

@@ -23,16 +23,13 @@ import com.google.zxing.BarcodeFormat
 import com.google.zxing.common.BitMatrix
 import com.google.zxing.qrcode.QRCodeWriter
 
-fun String.toQrCode(width: Int,
+fun String.toBitMatrix(size: Int): BitMatrix {
-                    height: Int,
-                    @ColorInt backgroundColor: Int = Color.WHITE,
-                    @ColorInt foregroundColor: Int = Color.BLACK): Bitmap {
     return QRCodeWriter().encode(
             this,
             BarcodeFormat.QR_CODE,
-            width,
+            size,
-            height
+            size
-    ).toBitmap(backgroundColor, foregroundColor)
+    )
 }
 
 fun BitMatrix.toBitmap(@ColorInt backgroundColor: Int = Color.WHITE,

vector/src/main/java/im/vector/riotx/core/ui/views/QrCodeImageView.kt

@@ -0,0 +1,94 @@
+/*
+ * Copyright 2020 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.riotx.core.ui.views
+
+import android.content.Context
+import android.graphics.drawable.AnimationDrawable
+import android.graphics.drawable.BitmapDrawable
+import android.util.AttributeSet
+import androidx.appcompat.widget.AppCompatImageView
+import im.vector.riotx.core.qrcode.toBitMatrix
+import im.vector.riotx.core.qrcode.toBitmap
+import kotlin.random.Random
+
+class QrCodeImageView @JvmOverloads constructor(
+        context: Context, attrs: AttributeSet? = null, defStyleAttr: Int = 0
+) : AppCompatImageView(context, attrs, defStyleAttr) {
+
+    private var data: String? = null
+    private var animate = false
+
+    fun setData(data: String, animate: Boolean) {
+        this.data = data
+        this.animate = animate
+
+        render()
+    }
+
+    override fun onSizeChanged(w: Int, h: Int, oldw: Int, oldh: Int) {
+        super.onSizeChanged(w, h, oldw, oldh)
+        render()
+    }
+
+    private fun render() {
+        data
+                ?.takeIf { width > 0 }
+                ?.let {
+                    if (animate) {
+                        // NOT SUPPORTED YET val anim = createAnimation(it)
+                        // NOT SUPPORTED YET setImageDrawable(anim)
+                        // NOT SUPPORTED YET anim.start()
+                        // NOT SUPPORTED YET setImageDrawable(BitmapDrawable(resources, it.toBitMatrix(width).toBitmap()))
+                        val bitmap = it.toBitMatrix(width).toBitmap()
+                        post { setImageBitmap(bitmap) }
+                    } else {
+                        val bitmap = it.toBitMatrix(width).toBitmap()
+                        post { setImageBitmap(bitmap) }
+                    }
+                }
+    }
+
+    private fun createAnimation(data: String): AnimationDrawable {
+        val finalQr = data.toBitMatrix(width)
+
+        val list = mutableListOf(finalQr)
+
+        val random = Random(System.currentTimeMillis())
+        val repeatTime = 8
+        repeat(repeatTime) { index ->
+            val alteredQr = finalQr.clone()
+            for (x in 0 until alteredQr.width) {
+                for (y in 0 until alteredQr.height) {
+                    if (random.nextInt(repeatTime - index) == 0) {
+                        // Pb is that it does not toggle a whole black square, but only a pixel
+                        alteredQr.unset(x, y)
+                    }
+                }
+            }
+            list.add(alteredQr)
+        }
+
+        val animDrawable = AnimationDrawable()
+
+        list.asReversed()
+                .forEach {
+                    animDrawable.addFrame(BitmapDrawable(resources, it.toBitmap()), 150)
+                }
+
+        return animDrawable
+    }
+}

vector/src/main/java/im/vector/riotx/features/crypto/verification/choose/VerificationChooseMethodController.kt

@@ -19,19 +19,16 @@ package im.vector.riotx.features.crypto.verification.choose
 import com.airbnb.epoxy.EpoxyController
 import im.vector.riotx.R
 import im.vector.riotx.core.epoxy.dividerItem
-import im.vector.riotx.core.qrcode.toQrCode
 import im.vector.riotx.core.resources.ColorProvider
 import im.vector.riotx.core.resources.StringProvider
-import im.vector.riotx.core.utils.DimensionConverter
 import im.vector.riotx.features.crypto.verification.epoxy.bottomSheetVerificationActionItem
-import im.vector.riotx.features.crypto.verification.epoxy.bottomSheetVerificationBigImageItem
 import im.vector.riotx.features.crypto.verification.epoxy.bottomSheetVerificationNoticeItem
+import im.vector.riotx.features.crypto.verification.epoxy.bottomSheetVerificationQrCodeItem
 import javax.inject.Inject
 
 class VerificationChooseMethodController @Inject constructor(
         private val stringProvider: StringProvider,
-        private val colorProvider: ColorProvider,
+        private val colorProvider: ColorProvider
-        private val dimensionConverter: DimensionConverter
 ) : EpoxyController() {
 
     var listener: Listener? = null
@@ -53,13 +50,10 @@ class VerificationChooseMethodController @Inject constructor(
             }
 
             if (state.otherCanScanQrCode && !state.QRtext.isNullOrBlank()) {
-                // Generate the QR code
+                bottomSheetVerificationQrCodeItem {
-                val size = dimensionConverter.dpToPx(180)
-                val qrCodeBitmap = state.QRtext.toQrCode(size, size)
-
-                bottomSheetVerificationBigImageItem {
                     id("qr")
-                    imageBitmap(qrCodeBitmap)
+                    data(state.QRtext)
+                    animate(false)
                 }
 
                 dividerItem {

vector/src/main/java/im/vector/riotx/features/crypto/verification/epoxy/BottomSheetVerificationBigImageItem.kt

@@ -16,7 +16,6 @@
  */
 package im.vector.riotx.features.crypto.verification.epoxy
 
-import android.graphics.Bitmap
 import android.widget.ImageView
 import androidx.core.view.ViewCompat
 import com.airbnb.epoxy.EpoxyAttribute
@@ -34,18 +33,11 @@ abstract class BottomSheetVerificationBigImageItem : VectorEpoxyModel<BottomShee
     @EpoxyAttribute
     var imageRes: Int = 0
 
-    @EpoxyAttribute
-    var imageBitmap: Bitmap? = null
-
     @EpoxyAttribute
     var contentDescription: String? = null
 
     override fun bind(holder: Holder) {
-        imageBitmap?.let {
+        holder.image.setImageResource(imageRes)
-            holder.image.setImageBitmap(it)
-        } ?: run {
-            holder.image.setImageResource(imageRes)
-        }
 
         if (contentDescription == null) {
             ViewCompat.setImportantForAccessibility(holder.image, ViewCompat.IMPORTANT_FOR_ACCESSIBILITY_NO)

vector/src/main/java/im/vector/riotx/features/crypto/verification/epoxy/BottomSheetVerificationQrCodeItem.kt

@@ -0,0 +1,56 @@
+/*
+ * Copyright 2020 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.riotx.features.crypto.verification.epoxy
+
+import androidx.core.view.ViewCompat
+import com.airbnb.epoxy.EpoxyAttribute
+import com.airbnb.epoxy.EpoxyModelClass
+import im.vector.riotx.R
+import im.vector.riotx.core.epoxy.VectorEpoxyHolder
+import im.vector.riotx.core.epoxy.VectorEpoxyModel
+import im.vector.riotx.core.ui.views.QrCodeImageView
+
+/**
+ * A action for bottom sheet.
+ */
+@EpoxyModelClass(layout = R.layout.item_verification_qr_code)
+abstract class BottomSheetVerificationQrCodeItem : VectorEpoxyModel<BottomSheetVerificationQrCodeItem.Holder>() {
+
+    @EpoxyAttribute
+    lateinit var data: String
+
+    @EpoxyAttribute
+    var animate = false
+
+    @EpoxyAttribute
+    var contentDescription: String? = null
+
+    override fun bind(holder: Holder) {
+        holder.qsrCodeImage.setData(data, animate)
+
+        if (contentDescription == null) {
+            ViewCompat.setImportantForAccessibility(holder.qsrCodeImage, ViewCompat.IMPORTANT_FOR_ACCESSIBILITY_NO)
+        } else {
+            ViewCompat.setImportantForAccessibility(holder.qsrCodeImage, ViewCompat.IMPORTANT_FOR_ACCESSIBILITY_YES)
+            holder.qsrCodeImage.contentDescription = contentDescription
+        }
+    }
+
+    class Holder : VectorEpoxyHolder() {
+        val qsrCodeImage by bind<QrCodeImageView>(R.id.itemVerificationBigImage)
+    }
+}

vector/src/main/res/layout/item_verification_qr_code.xml

@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="utf-8"?>
+<im.vector.riotx.core.ui.views.QrCodeImageView xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:tools="http://schemas.android.com/tools"
+    android:id="@+id/itemVerificationBigImage"
+    android:layout_width="match_parent"
+    android:layout_height="240dp"
+    android:layout_margin="8dp"
+    tools:src="@drawable/ic_shield_trusted" />