diff --git a/CHANGES.md b/CHANGES.md
index 761d8a4634..c3469f0661 100644
--- a/CHANGES.md
+++ b/CHANGES.md
@@ -14,6 +14,7 @@ Improvements 🙌:
- Handle events of type "m.room.server_acl" (#890)
- Room creation form: add advanced section to disable federation (#1314)
- Move "Enable Encryption" from room setting screen to room profile screen (#2394)
+ - Home empty screens quick design update (#2347)
- Improve Invite user screen (seamless search for matrix ID)
Bugfix 🐛:
diff --git a/vector/src/main/java/im/vector/app/core/extensions/ConstraintLayout.kt b/vector/src/main/java/im/vector/app/core/extensions/ConstraintLayout.kt
new file mode 100644
index 0000000000..b1b30da156
--- /dev/null
+++ b/vector/src/main/java/im/vector/app/core/extensions/ConstraintLayout.kt
@@ -0,0 +1,28 @@
+/*
+ * Copyright (c) 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.app.core.extensions
+
+import androidx.constraintlayout.widget.ConstraintLayout
+import androidx.constraintlayout.widget.ConstraintSet
+
+fun ConstraintLayout.updateConstraintSet(block: (ConstraintSet) -> Unit) {
+ ConstraintSet().let {
+ it.clone(this)
+ block.invoke(it)
+ it.applyTo(this)
+ }
+}
diff --git a/vector/src/main/java/im/vector/app/core/platform/StateView.kt b/vector/src/main/java/im/vector/app/core/platform/StateView.kt
index 2af3235cdf..9ecb03cb15 100755
--- a/vector/src/main/java/im/vector/app/core/platform/StateView.kt
+++ b/vector/src/main/java/im/vector/app/core/platform/StateView.kt
@@ -21,8 +21,10 @@ import android.graphics.drawable.Drawable
import android.util.AttributeSet
import android.view.View
import android.widget.FrameLayout
+import androidx.constraintlayout.widget.ConstraintSet
import androidx.core.view.isVisible
import im.vector.app.R
+import im.vector.app.core.extensions.updateConstraintSet
import kotlinx.android.synthetic.main.view_state.view.*
class StateView @JvmOverloads constructor(context: Context, attrs: AttributeSet? = null, defStyle: Int = 0)
@@ -31,7 +33,12 @@ class StateView @JvmOverloads constructor(context: Context, attrs: AttributeSet?
sealed class State {
object Content : State()
object Loading : State()
- data class Empty(val title: CharSequence? = null, val image: Drawable? = null, val message: CharSequence? = null) : State()
+ data class Empty(
+ val title: CharSequence? = null,
+ val image: Drawable? = null,
+ val isBigImage: Boolean = false,
+ val message: CharSequence? = null
+ ) : State()
data class Error(val message: CharSequence? = null) : State()
}
@@ -71,6 +78,9 @@ class StateView @JvmOverloads constructor(context: Context, attrs: AttributeSet?
is State.Loading -> Unit
is State.Empty -> {
emptyImageView.setImageDrawable(newState.image)
+ emptyView.updateConstraintSet {
+ it.constrainPercentHeight(R.id.emptyImageView, if (newState.isBigImage) 0.5f else 0.1f)
+ }
emptyMessageView.text = newState.message
emptyTitleView.text = newState.title
}
diff --git a/vector/src/main/java/im/vector/app/features/home/room/list/RoomListFragment.kt b/vector/src/main/java/im/vector/app/features/home/room/list/RoomListFragment.kt
index 60c2745b44..b4f525c119 100644
--- a/vector/src/main/java/im/vector/app/features/home/room/list/RoomListFragment.kt
+++ b/vector/src/main/java/im/vector/app/features/home/room/list/RoomListFragment.kt
@@ -294,28 +294,30 @@ class RoomListFragment @Inject constructor(
RoomListDisplayMode.NOTIFICATIONS -> {
if (hasNoRoom) {
StateView.State.Empty(
- getString(R.string.room_list_catchup_welcome_title),
- ContextCompat.getDrawable(requireContext(), R.drawable.ic_home_bottom_catchup),
- getString(R.string.room_list_catchup_welcome_body)
+ title = getString(R.string.room_list_catchup_welcome_title),
+ image = ContextCompat.getDrawable(requireContext(), R.drawable.ic_home_bottom_catchup),
+ message = getString(R.string.room_list_catchup_welcome_body)
)
} else {
StateView.State.Empty(
- getString(R.string.room_list_catchup_empty_title),
- ContextCompat.getDrawable(requireContext(), R.drawable.ic_noun_party_popper),
- getString(R.string.room_list_catchup_empty_body))
+ title = getString(R.string.room_list_catchup_empty_title),
+ image = ContextCompat.getDrawable(requireContext(), R.drawable.ic_noun_party_popper),
+ message = getString(R.string.room_list_catchup_empty_body))
}
}
RoomListDisplayMode.PEOPLE ->
StateView.State.Empty(
- getString(R.string.room_list_people_empty_title),
- ContextCompat.getDrawable(requireContext(), R.drawable.ic_home_bottom_chat),
- getString(R.string.room_list_people_empty_body)
+ title = getString(R.string.room_list_people_empty_title),
+ image = ContextCompat.getDrawable(requireContext(), R.drawable.empty_state_dm),
+ isBigImage = true,
+ message = getString(R.string.room_list_people_empty_body)
)
RoomListDisplayMode.ROOMS ->
StateView.State.Empty(
- getString(R.string.room_list_rooms_empty_title),
- ContextCompat.getDrawable(requireContext(), R.drawable.ic_home_bottom_group),
- getString(R.string.room_list_rooms_empty_body)
+ title = getString(R.string.room_list_rooms_empty_title),
+ image = ContextCompat.getDrawable(requireContext(), R.drawable.empty_state_room),
+ isBigImage = true,
+ message = getString(R.string.room_list_rooms_empty_body)
)
else ->
// Always display the content in this mode, because if the footer
diff --git a/vector/src/main/res/drawable-nodpi/empty_state_dm.png b/vector/src/main/res/drawable-nodpi/empty_state_dm.png
new file mode 100644
index 0000000000..12eedc803f
Binary files /dev/null and b/vector/src/main/res/drawable-nodpi/empty_state_dm.png differ
diff --git a/vector/src/main/res/drawable-nodpi/empty_state_room.png b/vector/src/main/res/drawable-nodpi/empty_state_room.png
new file mode 100644
index 0000000000..4fd93b2893
Binary files /dev/null and b/vector/src/main/res/drawable-nodpi/empty_state_room.png differ
diff --git a/vector/src/main/res/layout/view_state.xml b/vector/src/main/res/layout/view_state.xml
index 2d11daadbc..11f176e405 100644
--- a/vector/src/main/res/layout/view_state.xml
+++ b/vector/src/main/res/layout/view_state.xml
@@ -20,7 +20,9 @@
android:layout_height="wrap_content"
android:layout_gravity="center"
android:orientation="vertical"
- android:padding="@dimen/layout_horizontal_margin">
+ android:padding="@dimen/layout_horizontal_margin"
+ android:visibility="gone"
+ tools:visibility="visible">
<TextView
android:id="@+id/errorMessageView"
@@ -32,7 +34,6 @@
android:textSize="16sp"
tools:text="Une erreur est survenue" />
-
<com.google.android.material.button.MaterialButton
android:id="@+id/errorRetryView"
android:layout_width="wrap_content"
@@ -44,7 +45,6 @@
</LinearLayout>
-
<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/emptyView"
android:layout_width="match_parent"
@@ -53,47 +53,56 @@
android:orientation="vertical"
android:padding="@dimen/layout_horizontal_margin">
+ <ImageView
+ android:id="@+id/emptyImageView"
+ style="@style/VectorEmptyImageView"
+ android:layout_width="match_parent"
+ android:layout_height="0dp"
+ android:layout_gravity="center_horizontal"
+ android:layout_marginStart="20dp"
+ android:layout_marginEnd="20dp"
+ android:layout_marginBottom="30dp"
+ android:maxHeight="350dp"
+ app:layout_constraintBottom_toTopOf="@id/emptyTitleView"
+ app:layout_constraintEnd_toEndOf="parent"
+ app:layout_constraintStart_toStartOf="parent"
+ app:layout_constraintTop_toTopOf="parent"
+ app:layout_constraintVertical_chainStyle="packed"
+ tools:ignore="MissingPrefix"
+ tools:layout_constraintHeight_percent="0.5"
+ tools:src="@drawable/ic_search_no_results" />
+
<TextView
android:id="@+id/emptyTitleView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
- android:layout_marginBottom="49dp"
android:gravity="center"
android:textColor="?riotx_text_primary"
android:textSize="15sp"
android:textStyle="bold"
- app:layout_constraintBottom_toTopOf="@+id/emptyImageView"
+ app:layout_constraintBottom_toTopOf="@id/emptyMessageView"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
- tools:text="@string/room_list_catchup_empty_title" />
-
- <ImageView
- android:id="@+id/emptyImageView"
- android:layout_width="64dp"
- android:layout_height="64dp"
- android:layout_gravity="center_horizontal"
- app:layout_constraintBottom_toBottomOf="parent"
- app:layout_constraintEnd_toEndOf="parent"
- app:layout_constraintStart_toStartOf="parent"
- app:layout_constraintTop_toTopOf="parent"
- tools:src="@drawable/ic_noun_party_popper"
- app:tint="?riotx_text_primary"
- tools:ignore="MissingPrefix" />
+ app:layout_constraintTop_toBottomOf="@id/emptyImageView"
+ app:layout_constraintVertical_chainStyle="packed"
+ tools:text="@string/room_list_people_empty_title" />
<TextView
android:id="@+id/emptyMessageView"
android:layout_width="220dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
- android:layout_marginTop="49dp"
+ android:layout_marginTop="20dp"
android:gravity="center"
android:textColor="?riotx_text_secondary"
android:textSize="14sp"
+ app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
- app:layout_constraintTop_toBottomOf="@+id/emptyImageView"
- tools:text="@string/room_list_catchup_empty_body" />
+ app:layout_constraintTop_toBottomOf="@+id/emptyTitleView"
+ app:layout_constraintVertical_chainStyle="packed"
+ tools:text="@string/room_list_people_empty_body" />
</androidx.constraintlayout.widget.ConstraintLayout>
diff --git a/vector/src/main/res/values-land/styles.xml b/vector/src/main/res/values-land/styles.xml
new file mode 100644
index 0000000000..df40b71183
--- /dev/null
+++ b/vector/src/main/res/values-land/styles.xml
@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="utf-8"?>
+<resources>
+
+ <style name="VectorEmptyImageView">
+ <item name="android:visibility">gone</item>
+ </style>
+
+</resources>
\ No newline at end of file
diff --git a/vector/src/main/res/values/strings.xml b/vector/src/main/res/values/strings.xml
index f82e7f6fe7..2cb6eb9af9 100644
--- a/vector/src/main/res/values/strings.xml
+++ b/vector/src/main/res/values/strings.xml
@@ -1644,9 +1644,9 @@
<string name="room_list_catchup_welcome_title">Welcome home!</string>
<string name="room_list_catchup_welcome_body">Catch up on unread messages here</string>
<string name="room_list_people_empty_title">Conversations</string>
- <string name="room_list_people_empty_body">Your direct message conversations will be displayed here</string>
+ <string name="room_list_people_empty_body">Your direct message conversations will be displayed here. Tap the + bottom right to start some.</string>
<string name="room_list_rooms_empty_title">Rooms</string>
- <string name="room_list_rooms_empty_body">Your rooms will be displayed here</string>
+ <string name="room_list_rooms_empty_body">Your rooms will be displayed here. Tap the + bottom right to find existing ones or start some of your own.</string>
<string name="title_activity_emoji_reaction_picker">Reactions</string>
<string name="reactions_agree">Agree</string>
diff --git a/vector/src/main/res/values/styles.xml b/vector/src/main/res/values/styles.xml
index 09f17a77b4..8cc1fe70d8 100644
--- a/vector/src/main/res/values/styles.xml
+++ b/vector/src/main/res/values/styles.xml
@@ -3,4 +3,8 @@
<style name="Vector.PopupMenu" parent="Vector.PopupMenuBase" />
+ <style name="VectorEmptyImageView">
+ <item name="android:visibility">visible</item>
+ </style>
+
</resources>
\ No newline at end of file