Login screens: splash screen

vector/src/main/java/im/vector/riotx/features/login/AbstractLoginFragment.kt

@@ -0,0 +1,40 @@
+/*
+ * 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.riotx.features.login
+
+import android.os.Bundle
+import android.view.View
+import androidx.annotation.CallSuper
+import com.airbnb.mvrx.activityViewModel
+import im.vector.riotx.core.platform.VectorBaseFragment
+
+/**
+ * Parent Fragment for all the login/registration screens
+ */
+abstract class AbstractLoginFragment() : VectorBaseFragment() {
+
+    protected val viewModel: LoginViewModel by activityViewModel()
+    protected lateinit var loginSharedActionViewModel: LoginSharedActionViewModel
+
+    @CallSuper
+    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
+        super.onViewCreated(view, savedInstanceState)
+
+        loginSharedActionViewModel = activityViewModelProvider.get(LoginSharedActionViewModel::class.java)
+    }
+
+}

vector/src/main/java/im/vector/riotx/features/login/LoginActivity.kt

@@ -45,7 +45,7 @@ class LoginActivity : VectorBaseActivity() {
 
     override fun initUiAndData() {
         if (isFirstCreation()) {
-            addFragment(R.id.simpleFragmentContainer, LoginFragment::class.java)
+            addFragment(R.id.simpleFragmentContainer, LoginSplashFragment::class.java)
         }
 
         // Get config extra
@@ -58,6 +58,7 @@ class LoginActivity : VectorBaseActivity() {
         loginSharedActionViewModel.observe()
                 .subscribe {
                     when (it) {
+                        is LoginNavigation.OpenServerSelection  -> addFragmentToBackstack(R.id.simpleFragmentContainer, LoginFragment::class.java)
                         is LoginNavigation.OpenSsoLoginFallback -> addFragmentToBackstack(R.id.simpleFragmentContainer, LoginSsoFallbackFragment::class.java)
                         is LoginNavigation.GoBack               -> supportFragmentManager.popBackStack(null, FragmentManager.POP_BACK_STACK_INCLUSIVE)
                     }

vector/src/main/java/im/vector/riotx/features/login/LoginFragment.kt

@@ -28,7 +28,6 @@ import com.jakewharton.rxbinding3.widget.textChanges
 import im.vector.riotx.R
 import im.vector.riotx.core.extensions.setTextWithColoredPart
 import im.vector.riotx.core.extensions.showPassword
-import im.vector.riotx.core.platform.VectorBaseFragment
 import im.vector.riotx.core.utils.openUrlInExternalBrowser
 import im.vector.riotx.features.homeserver.ServerUrlsRepository
 import io.reactivex.Observable
@@ -41,10 +40,7 @@ import javax.inject.Inject
  * What can be improved:
  * - When filtering more (when entering new chars), we could filter on result we already have, during the new server request, to avoid empty screen effect
  */
-class LoginFragment @Inject constructor() : VectorBaseFragment() {
+class LoginFragment @Inject constructor() : AbstractLoginFragment() {
-
-    private val viewModel: LoginViewModel by activityViewModel()
-    private lateinit var loginSharedActionViewModel: LoginSharedActionViewModel
 
     private var passwordShown = false
 
@@ -53,8 +49,6 @@ class LoginFragment @Inject constructor() : VectorBaseFragment() {
     override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
         super.onViewCreated(view, savedInstanceState)
 
-        loginSharedActionViewModel = activityViewModelProvider.get(LoginSharedActionViewModel::class.java)
-
         setupNotice()
         setupAuthButton()
         setupPasswordReveal()

vector/src/main/java/im/vector/riotx/features/login/LoginNavigation.kt

@@ -18,8 +18,9 @@ package im.vector.riotx.features.login
 
 import im.vector.riotx.core.platform.VectorSharedAction
 
-// Supported navigation actions for this Activity
+// Supported navigation actions for LoginActivity
 sealed class LoginNavigation : VectorSharedAction {
+    object OpenServerSelection : LoginNavigation()
     object OpenSsoLoginFallback : LoginNavigation()
     object GoBack : LoginNavigation()
 }

vector/src/main/java/im/vector/riotx/features/login/LoginSplashFragment.kt

@@ -0,0 +1,34 @@
+/*
+ * 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.riotx.features.login
+
+import butterknife.OnClick
+import im.vector.riotx.R
+import javax.inject.Inject
+
+/**
+ *
+ */
+class LoginSplashFragment @Inject constructor() : AbstractLoginFragment() {
+
+    override fun getLayoutResId() = R.layout.fragment_login_splash
+
+    @OnClick(R.id.loginSplashSubmit)
+    fun getStarted() {
+        loginSharedActionViewModel.post(LoginNavigation.OpenServerSelection)
+    }
+}

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

@@ -0,0 +1,126 @@
+<androidx.coordinatorlayout.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    android:layout_width="match_parent"
+    android:layout_height="match_parent">
+
+    <androidx.constraintlayout.widget.ConstraintLayout
+        android:layout_width="match_parent"
+        android:layout_height="match_parent"
+        android:layout_margin="36dp">
+
+        <ImageView
+            android:id="@+id/loginSplashLogo"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:src="@drawable/riotx_logo"
+            app:layout_constraintBottom_toTopOf="@+id/loginSplashTitle"
+            app:layout_constraintEnd_toEndOf="parent"
+            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintTop_toTopOf="parent"
+            app:layout_constraintVertical_chainStyle="packed" />
+
+        <TextView
+            android:id="@+id/loginSplashTitle"
+            android:layout_width="0dp"
+            android:layout_height="wrap_content"
+            android:layout_marginTop="48dp"
+            android:text="@string/login_splash_title"
+            android:textColor="?riotx_text_primary"
+            android:textSize="20sp"
+            android:textStyle="bold"
+            app:layout_constraintBottom_toTopOf="@+id/loginSplashText1"
+            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintTop_toBottomOf="@+id/loginSplashLogo" />
+
+        <!-- TODO icon src -->
+        <!-- TODO check relative dimension -->
+        <ImageView
+            android:id="@+id/loginSplashPicto1"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:src="@drawable/ic_settings_x"
+            android:tint="?vctr_notice_secondary"
+            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintTop_toTopOf="@+id/loginSplashText1" />
+
+        <TextView
+            android:id="@+id/loginSplashText1"
+            android:layout_width="0dp"
+            android:layout_height="wrap_content"
+            android:layout_marginStart="12dp"
+            android:layout_marginTop="32dp"
+            android:gravity="start"
+            android:text="@string/login_splash_text1"
+            android:textColor="?vctr_notice_secondary"
+            android:textSize="16sp"
+            app:layout_constraintBottom_toTopOf="@+id/loginSplashText2"
+            app:layout_constraintEnd_toEndOf="parent"
+            app:layout_constraintStart_toEndOf="@id/loginSplashPicto1"
+            app:layout_constraintTop_toBottomOf="@+id/loginSplashTitle" />
+
+        <!-- TODO icon src -->
+        <ImageView
+            android:id="@+id/loginSplashPicto2"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:src="@drawable/ic_settings_x"
+            android:tint="?vctr_notice_secondary"
+            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintTop_toTopOf="@+id/loginSplashText2" />
+
+        <TextView
+            android:id="@+id/loginSplashText2"
+            android:layout_width="0dp"
+            android:layout_height="wrap_content"
+            android:layout_marginStart="12dp"
+            android:layout_marginTop="16dp"
+            android:gravity="start"
+            android:text="@string/login_splash_text2"
+            android:textColor="?vctr_notice_secondary"
+            android:textSize="16sp"
+            app:layout_constraintBottom_toTopOf="@id/loginSplashText3"
+            app:layout_constraintEnd_toEndOf="parent"
+            app:layout_constraintStart_toEndOf="@id/loginSplashPicto2"
+            app:layout_constraintTop_toBottomOf="@+id/loginSplashText1" />
+
+        <!-- TODO icon src -->
+        <ImageView
+            android:id="@+id/loginSplashPicto3"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:src="@drawable/ic_settings_x"
+            android:tint="?vctr_notice_secondary"
+            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintTop_toTopOf="@+id/loginSplashText3" />
+
+        <TextView
+            android:id="@+id/loginSplashText3"
+            android:layout_width="0dp"
+            android:layout_height="wrap_content"
+            android:layout_marginStart="12dp"
+            android:layout_marginTop="16dp"
+            android:gravity="start"
+            android:text="@string/login_splash_text1"
+            android:textColor="?vctr_notice_secondary"
+            android:textSize="16sp"
+            app:layout_constraintBottom_toTopOf="@+id/loginSplashSubmit"
+            app:layout_constraintEnd_toEndOf="parent"
+            app:layout_constraintStart_toEndOf="@id/loginSplashPicto3"
+            app:layout_constraintTop_toBottomOf="@+id/loginSplashText2" />
+
+        <androidx.appcompat.widget.AppCompatButton
+            android:id="@+id/loginSplashSubmit"
+            style="@style/VectorButtonStyle"
+            android:layout_width="0dp"
+            android:layout_height="wrap_content"
+            android:layout_marginTop="48dp"
+            android:text="@string/login_splash_submit"
+            app:layout_constraintBottom_toBottomOf="parent"
+            app:layout_constraintEnd_toEndOf="parent"
+            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintTop_toBottomOf="@+id/loginSplashText3" />
+
+    </androidx.constraintlayout.widget.ConstraintLayout>
+
+</androidx.coordinatorlayout.widget.CoordinatorLayout>
+

vector/src/main/res/values/strings_riotX.xml

@@ -23,5 +23,10 @@
     <string name="room_join_rules_public">%1$s made the room public to whoever knows the link.</string>
     <string name="room_join_rules_invite">%1$s made the room invite only.</string>
 
+    <string name="login_splash_title">Liberate your communication</string>
+    <string name="login_splash_text1">Chat with people directly or in groups</string>
+    <string name="login_splash_text2">Keep conversations private with encryption</string>
+    <string name="login_splash_text3">Extend &amp; customise your experience</string>
+    <string name="login_splash_submit">Get started</string>
 
 </resources>