Rework colors management

Author: bmarty

.idea/dictionaries/bmarty.xml

@@ -26,7 +26,7 @@ To install the template (to be done only once):
 
 To create a new screen:
 - First create a new package in your code.
-- Then right click on the package, and select `New/New Vector/RiotX Feature`.
+- Then right click on the package, and select `New/New Vector/Element Feature`.
 - Follow the Wizard, especially replace `Main` by something more relevant to your feature.
 - Click on `Finish`.
 - Remaining steps are described as TODO in the generated files, or will be pointed out by the compiler, or at runtime :)

CONTRIBUTING.md

@@ -0,0 +1,85 @@
+# Color migration
+
+### Changes
+
+- use colors defined in https://www.figma.com/file/X4XTH9iS2KGJ2wFKDqkyed/Compound?node-id=557%3A0
+- remove unused resources and code (ex: PercentView)
+- split some resource files into smaller file
+- rework the theme files
+- ensure material theme is used everywhere in the theme and in the layout
+- add default style for some views in the theme (ex: Toolbar, etc.)
+- add some debug screen in the debug menu, to test the themes and the button style
+- rework the button style to use `materialThemeOverlay` attribute
+- custom tint icon for menu management has been removed
+- comment with `riotx` has been updated
+
+### Main change for developers
+
+- Read migration guide: https://github.com./vector-im/element-android/pull/3459/files#diff-f0e52729d5e4f6eccbcf72246807aa34ed19c4ef5625ca669df998cd1022874b
+- Use MaterialAlertDialogBuilder instead of AlertDialog.Builder
+- some Epoxy Item included a divider. This has been removed. Use a `dividerItem` or `bottomSheetDividerItem` Epoxy items to add a divider
+- RecyclerView.configureWith now take a divider drawable instead of a divider color
+
+### Remaining work
+
+- Cleanup some vector drawables and ensure a tint is always used instead of hard coded color.
+
+### Migration guide
+
+Some colors and color attribute has been removed, here is the list and what has to be used now.
+
+It can help Element Android forks maintainers to migrate their code.
+
+- riotx_text_primary -> ?vctr_content_primary
+- riotx_text_secondary -> ?vctr_content_secondary
+- riotx_text_tertiary -> ?vctr_content_tertiary
+
+- ?riotx_background -> ?android:colorBackground
+- riotx_background_light -> element_background_light
+- riotx_background_dark -> element_background_dark
+- riotx_background_black -> element_background_black
+
+- riotx_accent -> ?colorPrimary
+- riotx_positive_accent -> ?colorPrimary
+- riotx_accent_alpha25 -> color_primary_alpha25
+- riotx_notice -> ?colorError
+- riotx_destructive_accent -> ?colorError
+- vector_error_color -> ?colorError
+- vector_warning_color -> ?colorError
+
+- riotx_bottom_sheet_background -> ?colorSurface
+- riotx_alerter_background -> ?colorSurface
+
+- riotx_username_1 -> element_name_01
+- riotx_username_2 -> element_name_02
+- riotx_username_3 -> element_name_03
+- riotx_username_4 -> element_name_04
+- riotx_username_5 -> element_name_05
+- riotx_username_6 -> element_name_06
+- riotx_username_7 -> element_name_07
+- riotx_username_8 -> element_name_08
+
+- riotx_avatar_fill_1 -> element_room_01
+- riotx_avatar_fill_2 -> element_room_02
+- riotx_avatar_fill_3 -> element_room_03
+
+- white -> @android:color/white
+- black -> @android:color/black or emoji_color
+
+- riotx_list_header_background_color -> ?vctr_header_background
+- riotx_header_panel_background -> ?vctr_header_background
+- riotx_list_bottom_sheet_divider_color -> ?vctr_list_separator_on_surface
+- riotx_list_divider_color -> ?vctr_list_separator
+- list_divider_color -> ?vctr_list_separator
+- riotx_header_panel_border_mobile -> ?vctr_list_separator
+- riotx_bottom_nav_background_border_color -> ?vctr_list_separator
+- riotx_header_panel_text_secondary -> ?vctr_content_primary
+
+- link_color_light -> element_link_light
+- link_color_dark -> element_link_dark
+
+- riotx_toolbar_primary_text_color -> vctr_content_primary
+- riotx_toolbar_secondary_text_color -> vctr_content_primary
+- riot_primary_text_color -> vctr_content_primary
+
+- riotx_android_secondary -> vctr_content_secondary

docs/color_migration_guide.md

@@ -35,7 +35,7 @@ interface IdentityService {
     /**
      * Check if the identity server is valid
      * See https://matrix.org/docs/spec/identity_service/latest#status-check
-     * RiotX SDK only supports identity server API v2
+     * Matrix Android SDK2 only supports identity server API v2
      */
     suspend fun isValidIdentityServer(url: String)
 

matrix-sdk-android/src/main/java/org/matrix/android/sdk/api/session/identity/IdentityService.kt

@@ -388,7 +388,7 @@ internal class DefaultCryptoService @Inject constructor(
         cryptoStore.close()
     }
 
-    // Aways enabled on RiotX
+    // Always enabled on Matrix Android SDK2
     override fun isCryptoEnabled() = true
 
     /**

matrix-sdk-android/src/main/java/org/matrix/android/sdk/internal/crypto/DefaultCryptoService.kt

@@ -155,7 +155,7 @@ internal class MXMegolmDecryption(private val userId: String,
                                                 withHeldInfo.code?.value ?: "",
                                                 withHeldInfo.reason)
                                     } else {
-                                        // This is un-used in riotX SDK, not sure if needed
+                                        // This is un-used in Matrix Android SDK2, not sure if needed
                                         // addEventToPendingList(event, timeline)
                                         if (requestKeysOnFail) {
                                             requestKeysForEvent(event, false)

matrix-sdk-android/src/main/java/org/matrix/android/sdk/internal/crypto/algorithms/megolm/MXMegolmDecryption.kt

@@ -153,7 +153,7 @@ internal class DefaultLegacySessionImporter @Inject constructor(
     }
 
     private fun importCryptoDb(legacyConfig: LegacyHomeServerConnectionConfig) {
-        // Here we migrate the DB, we copy the crypto DB to the location specific to RiotX, and we encrypt it.
+        // Here we migrate the DB, we copy the crypto DB to the location specific to Matrix SDK2, and we encrypt it.
         val userMd5 = legacyConfig.credentials.userId.md5()
 
         val sessionId = legacyConfig.credentials.let { (if (it.deviceId.isNullOrBlank()) it.userId else "${it.userId}|${it.deviceId}").md5() }
@@ -177,12 +177,12 @@ internal class DefaultLegacySessionImporter @Inject constructor(
 
         Timber.d("Migration: copy DB to encrypted DB")
         Realm.getInstance(realmConfiguration).use {
-            // Move the DB to the new location, handled by RiotX
+            // Move the DB to the new location, handled by Matrix SDK2
             it.writeEncryptedCopyTo(File(newLocation, realmConfiguration.realmFileName), realmKeysUtils.getRealmEncryptionKey(keyAlias))
         }
     }
 
-    // Delete all the files created by Riot Android which will not be used anymore by RiotX
+    // Delete all the files created by Riot Android which will not be used anymore by Element
     private fun clearFileSystem(legacyConfig: LegacyHomeServerConnectionConfig) {
         val cryptoFolder = legacyConfig.credentials.userId.md5()
 

matrix-sdk-android/src/main/java/org/matrix/android/sdk/internal/legacy/DefaultLegacySessionImporter.kt

@@ -36,7 +36,7 @@ internal class UserAgentHolder @Inject constructor(private val context: Context,
 
     /**
      * Create an user agent with the application version.
-     * Ex: RiotX/1.0.0 (Linux; U; Android 6.0.1; SM-A510F Build/MMB29; Flavour GPlay; MatrixAndroidSDK_X 1.0)
+     * Ex: Element/1.0.0 (Linux; U; Android 6.0.1; SM-A510F Build/MMB29; Flavour GPlay; MatrixAndroidSDK_X 1.0)
      *
      * @param flavorDescription the flavor description
      */

matrix-sdk-android/src/main/java/org/matrix/android/sdk/internal/network/UserAgentHolder.kt

@@ -0,0 +1,2 @@
+Migrate to new colors and cleanup the style and theme
+Ref: https://material.io/blog/migrate-android-material-components

newsfragment/3459.feature

@@ -136,8 +136,9 @@ android\.R\.id\.home===2
 ### Kotlin conversion tools introduce this, but is can be replace by trim()
 trim \{ it \<\= \' \' \}
 
-### Use AlertDialog form v7 compat lib
+### Use MaterialAlertDialogBuilder
 android\.app\.AlertDialog
+androidx\.appcompat\.app\.AlertDialog===4
 
 ### Put the operator at the beginning of next line
 &&$

tools/check/forbidden_strings_in_code.txt

@@ -84,3 +84,22 @@ layout_constraintLeft_
 
 ### Use androidx.recyclerview.widget.RecyclerView because EpoxyRecyclerViews add behavior we do not want to
 <com\.airbnb\.epoxy\.EpoxyRecyclerView
+
+### Use Button instead of MaterialButton, the inflater will automatically inflate MaterialButton.
+<com\.google\.android\.material\.button\.MaterialButton
+<androidx\.appcompat\.widget\.AppCompatButton
+
+### Use CheckBox instead of MaterialCheckBox, the inflater will automatically inflate MaterialCheckBox.
+<com\.google\.android\.material\.checkbox\.MaterialCheckBox
+
+### Use RadioButton instead of MaterialRadioButton, the inflater will automatically inflate Material Views.
+<com\.google\.android\.material\.radiobutton\.MaterialRadioButton
+
+### Use com.google.android.material.switchmaterial.SwitchMaterial instead of Switch, the inflater will not automatically inflate Material Views for Switch.
+<Switch
+
+### Use colorSecondary
+colorAccent
+
+### Use MaterialCardView
+<androidx\.cardview\.widget\.CardView

tools/check/forbidden_strings_in_resources.txt

@@ -6,11 +6,26 @@
         <activity android:name=".features.debug.TestLinkifyActivity" />
         <activity android:name=".features.debug.sas.DebugSasEmojiActivity" />
         <activity
-            android:name=".features.debug.DebugMaterialThemeLightActivity"
+            android:name=".features.debug.DebugMaterialThemeLightDefaultActivity"
             android:theme="@style/VectorMaterialThemeDebugLight" />
         <activity
-            android:name=".features.debug.DebugMaterialThemeDarkActivity"
+            android:name=".features.debug.DebugMaterialThemeLightTestActivity"
+            android:theme="@style/VectorMaterialThemeDebugLight.Test" />
+        <activity
+            android:name=".features.debug.DebugMaterialThemeLightVectorActivity"
+            android:theme="@style/AppTheme.Light" />
+        <activity
+            android:name=".features.debug.DebugMaterialThemeDarkDefaultActivity"
             android:theme="@style/VectorMaterialThemeDebugDark" />
+        <activity
+            android:name=".features.debug.DebugMaterialThemeDarkTestActivity"
+            android:theme="@style/VectorMaterialThemeDebugDark.Test" />
+        <activity
+            android:name=".features.debug.DebugMaterialThemeDarkVectorActivity"
+            android:theme="@style/AppTheme.Dark" />
+        <activity
+            android:name=".features.debug.DebugVectorButtonStylesActivity"
+            android:theme="@style/AppTheme.Light" />
     </application>
 
 </manifest>

vector/src/debug/AndroidManifest.xml

@@ -0,0 +1,32 @@
+/*
+ * Copyright (c) 2021 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.debug
+
+import android.os.Bundle
+import android.view.LayoutInflater
+import android.view.View
+import android.view.ViewGroup
+import com.google.android.material.bottomsheet.BottomSheetDialogFragment
+import im.vector.app.databinding.ActivityTestMaterialThemeBinding
+
+class DebugBottomSheet : BottomSheetDialogFragment() {
+    override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View {
+        // Reuse tha Activity layout
+        val binding = ActivityTestMaterialThemeBinding.inflate(inflater, container, false)
+        return binding.root
+    }
+}

vector/src/debug/java/im/vector/app/features/debug/DebugBottomSheet.kt

@@ -18,9 +18,8 @@ package im.vector.app.features.debug
 
 import android.os.Bundle
 import android.view.Menu
-import androidx.appcompat.app.AlertDialog
 import androidx.appcompat.app.AppCompatActivity
-import com.google.android.material.bottomsheet.BottomSheetDialogFragment
+import com.google.android.material.dialog.MaterialAlertDialogBuilder
 import com.google.android.material.snackbar.Snackbar
 import im.vector.app.R
 import im.vector.app.core.utils.toast
@@ -45,7 +44,8 @@ abstract class DebugMaterialThemeActivity : AppCompatActivity() {
         }
 
         views.debugShowDialog.setOnClickListener {
-            AlertDialog.Builder(this)
+            MaterialAlertDialogBuilder(this)
+                    .setTitle("Dialog title")
                     .setMessage("Dialog content")
                     .setIcon(R.drawable.ic_settings_x)
                     .setPositiveButton("Positive", null)
@@ -55,7 +55,7 @@ abstract class DebugMaterialThemeActivity : AppCompatActivity() {
         }
 
         views.debugShowBottomSheet.setOnClickListener {
-            BottomSheetDialogFragment().show(supportFragmentManager, "TAG")
+            DebugBottomSheet().show(supportFragmentManager, "TAG")
         }
     }
 

vector/src/debug/java/im/vector/app/features/debug/DebugMaterialThemeActivity.kt

@@ -0,0 +1,19 @@
+/*
+ * Copyright 2019 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.debug
+
+class DebugMaterialThemeDarkDefaultActivity : DebugMaterialThemeActivity()

vector/src/debug/java/im/vector/app/features/debug/DebugMaterialThemeDarkDefaultActivity.kt

@@ -16,4 +16,4 @@
 
 package im.vector.app.features.debug
 
-class DebugMaterialThemeDarkActivity : DebugMaterialThemeActivity()
+class DebugMaterialThemeDarkTestActivity : DebugMaterialThemeActivity()

vector/src/debug/java/im/vector/app/features/debug/DebugMaterialThemeDarkActivity.kt renamed to vector/src/debug/java/im/vector/app/features/debug/DebugMaterialThemeDarkTestActivity.kt

@@ -0,0 +1,19 @@
+/*
+ * Copyright 2019 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.debug
+
+class DebugMaterialThemeDarkVectorActivity : DebugMaterialThemeActivity()

vector/src/debug/java/im/vector/app/features/debug/DebugMaterialThemeDarkVectorActivity.kt

@@ -0,0 +1,19 @@
+/*
+ * Copyright 2019 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.debug
+
+class DebugMaterialThemeLightDefaultActivity : DebugMaterialThemeActivity()

vector/src/debug/java/im/vector/app/features/debug/DebugMaterialThemeLightDefaultActivity.kt

@@ -16,4 +16,4 @@
 
 package im.vector.app.features.debug
 
-class DebugMaterialThemeLightActivity : DebugMaterialThemeActivity()
+class DebugMaterialThemeLightTestActivity : DebugMaterialThemeActivity()

vector/src/debug/java/im/vector/app/features/debug/DebugMaterialThemeLightActivity.kt renamed to vector/src/debug/java/im/vector/app/features/debug/DebugMaterialThemeLightTestActivity.kt

@@ -0,0 +1,19 @@
+/*
+ * Copyright 2019 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.debug
+
+class DebugMaterialThemeLightVectorActivity : DebugMaterialThemeActivity()