Commit f015f0d4 authored by Filipe de Lima Brito's avatar Filipe de Lima Brito

Changes the user detais UI.

parent a2f38889
...@@ -140,6 +140,7 @@ dependencies { ...@@ -140,6 +140,7 @@ dependencies {
implementation libraries.frescoAnimatedWebP implementation libraries.frescoAnimatedWebP
implementation libraries.glide implementation libraries.glide
implementation libraries.glideTransformations
kapt libraries.kotshiCompiler kapt libraries.kotshiCompiler
implementation libraries.kotshiApi implementation libraries.kotshiApi
......
...@@ -10,6 +10,7 @@ import chat.rocket.android.R ...@@ -10,6 +10,7 @@ import chat.rocket.android.R
import chat.rocket.android.analytics.AnalyticsManager import chat.rocket.android.analytics.AnalyticsManager
import chat.rocket.android.analytics.event.ScreenViewEvent import chat.rocket.android.analytics.event.ScreenViewEvent
import chat.rocket.android.chatroom.ui.ChatRoomActivity import chat.rocket.android.chatroom.ui.ChatRoomActivity
import chat.rocket.android.emoji.internal.GlideApp
import chat.rocket.android.userdetails.presentation.UserDetailsPresenter import chat.rocket.android.userdetails.presentation.UserDetailsPresenter
import chat.rocket.android.userdetails.presentation.UserDetailsView import chat.rocket.android.userdetails.presentation.UserDetailsView
import chat.rocket.android.util.extensions.inflate import chat.rocket.android.util.extensions.inflate
...@@ -17,7 +18,12 @@ import chat.rocket.android.util.extensions.setLightStatusBar ...@@ -17,7 +18,12 @@ import chat.rocket.android.util.extensions.setLightStatusBar
import chat.rocket.android.util.extensions.showToast import chat.rocket.android.util.extensions.showToast
import chat.rocket.android.util.extensions.ui import chat.rocket.android.util.extensions.ui
import com.bumptech.glide.Glide import com.bumptech.glide.Glide
import com.bumptech.glide.load.MultiTransformation
import com.bumptech.glide.load.resource.bitmap.CenterCrop
import com.bumptech.glide.load.resource.bitmap.RoundedCorners
import com.bumptech.glide.request.RequestOptions
import dagger.android.support.AndroidSupportInjection import dagger.android.support.AndroidSupportInjection
import jp.wasabeef.glide.transformations.BlurTransformation
import kotlinx.android.synthetic.main.app_bar_chat_room.* import kotlinx.android.synthetic.main.app_bar_chat_room.*
import kotlinx.android.synthetic.main.fragment_user_details.* import kotlinx.android.synthetic.main.fragment_user_details.*
import javax.inject.Inject import javax.inject.Inject
...@@ -62,6 +68,7 @@ class UserDetailsFragment : Fragment(), UserDetailsView { ...@@ -62,6 +68,7 @@ class UserDetailsFragment : Fragment(), UserDetailsView {
super.onViewCreated(view, savedInstanceState) super.onViewCreated(view, savedInstanceState)
setupToolbar() setupToolbar()
setupListeners()
presenter.loadUserDetails(userId) presenter.loadUserDetails(userId)
analyticsManager.logScreenView(ScreenViewEvent.UserDetails) analyticsManager.logScreenView(ScreenViewEvent.UserDetails)
...@@ -74,14 +81,17 @@ class UserDetailsFragment : Fragment(), UserDetailsView { ...@@ -74,14 +81,17 @@ class UserDetailsFragment : Fragment(), UserDetailsView {
status: String, status: String,
utcOffset: String utcOffset: String
) { ) {
Glide.with(this) val requestBuilder = Glide.with(this).load(avatarUrl)
.asBitmap()
.load(avatarUrl) requestBuilder.apply(RequestOptions.bitmapTransform(MultiTransformation(BlurTransformation(), CenterCrop())))
.into(image_blur)
requestBuilder.apply(RequestOptions.bitmapTransform(RoundedCorners(14)))
.into(image_avatar) .into(image_avatar)
text_name.text = name text_name.text = name
text_username.text = username text_username.text = username
text_description_status.text = status text_description_status.text = status.substring(0, 1).toUpperCase() + status.substring(1)
text_description_timezone.text = utcOffset text_description_timezone.text = utcOffset
// We should also setup the user details listeners. // We should also setup the user details listeners.
...@@ -114,4 +124,8 @@ class UserDetailsFragment : Fragment(), UserDetailsView { ...@@ -114,4 +124,8 @@ class UserDetailsFragment : Fragment(), UserDetailsView {
toolbar.isVisible = false toolbar.isVisible = false
} }
} }
private fun setupListeners() {
image_arrow_back.setOnClickListener { activity?.onBackPressed() }
}
} }
\ No newline at end of file
...@@ -3,12 +3,12 @@ ...@@ -3,12 +3,12 @@
android:shape="rectangle"> android:shape="rectangle">
<padding <padding
android:bottom="2dp" android:bottom="3dp"
android:left="2dp" android:left="3dp"
android:right="2dp" android:right="3dp"
android:top="2dp" /> android:top="3dp" />
<solid android:color="@android:color/white" /> <solid android:color="@color/color_white" />
<corners android:radius="25px" /> <corners android:radius="6dp" />
</shape> </shape>
<?xml version="1.0" encoding="utf-8"?> <?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android" <ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools" xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent" android:layout_width="match_parent"
android:layout_height="match_parent" android:layout_height="match_parent">
android:background="@android:color/white"
android:padding="@dimen/screen_edge_left_and_right_margins">
<ImageView <androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/image_avatar" android:layout_width="match_parent"
android:layout_width="98dp"
android:layout_height="98dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:srcCompat="@tools:sample/avatars[6]" />
<TextView
android:id="@+id/text_name"
style="@style/UserDetails.TextView.Name"
android:layout_width="wrap_content"
android:layout_height="wrap_content" android:layout_height="wrap_content"
android:layout_marginTop="12dp" android:background="@android:color/white">
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/image_avatar"
tools:text="Karem Flusser" />
<TextView <ImageView
android:id="@+id/text_username" android:id="@+id/image_blur"
style="@style/UserDetails.TextView.Username" android:layout_width="match_parent"
android:layout_width="wrap_content" android:layout_height="120dp" />
android:layout_height="wrap_content"
android:layout_marginTop="2dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/text_name"
tools:text="karem.flusser" />
<TextView <ImageView
android:id="@+id/text_message" android:id="@+id/image_arrow_back"
style="@style/UserDetails.TextView.Actions" android:layout_width="24dp"
android:layout_width="wrap_content" android:layout_height="24dp"
android:layout_height="wrap_content" android:layout_margin="@dimen/screen_edge_left_and_right_margins"
android:layout_marginTop="24dp" android:src="@drawable/ic_arrow_back_white_24dp"
android:drawableTop="@drawable/ic_message_24dp" android:tint="@color/color_black"
android:text="@string/msg_message" app:layout_constraintStart_toStartOf="@+id/image_blur"
app:layout_constraintEnd_toEndOf="parent" app:layout_constraintTop_toTopOf="@+id/image_blur" />
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/text_username" />
<TextView <ImageView
android:id="@+id/text_title_status" android:id="@+id/image_avatar"
style="@style/UserDetails.TextView.Title" android:layout_width="100dp"
android:layout_width="wrap_content" android:layout_height="100dp"
android:layout_height="wrap_content" android:background="@drawable/bg_border_user_details_avatar"
android:layout_marginTop="32dp" app:layout_constraintBottom_toBottomOf="@+id/image_blur"
android:text="@string/status" app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent" app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/text_message" /> app:layout_constraintTop_toBottomOf="@+id/image_blur"
tools:srcCompat="@tools:sample/avatars[6]" />
<TextView <TextView
android:id="@+id/text_description_status" android:id="@+id/text_name"
style="@style/UserDetails.TextView.Description" style="@style/UserDetails.TextView.Name"
android:layout_width="wrap_content" android:layout_width="wrap_content"
android:layout_height="wrap_content" android:layout_height="wrap_content"
app:layout_constraintStart_toStartOf="parent" android:layout_marginTop="12dp"
app:layout_constraintTop_toBottomOf="@+id/text_title_status" app:layout_constraintEnd_toEndOf="parent"
tools:text="Online" /> app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/image_avatar"
tools:text="Karem Flusser" />
<TextView <TextView
android:id="@+id/text_title_timezone" android:id="@+id/text_username"
style="@style/UserDetails.TextView.Title" style="@style/UserDetails.TextView.Username"
android:layout_width="wrap_content" android:layout_width="wrap_content"
android:layout_height="wrap_content" android:layout_height="wrap_content"
android:layout_marginTop="16dp" android:layout_marginTop="2dp"
android:text="@string/timezone" app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent" app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/text_description_status" /> app:layout_constraintTop_toBottomOf="@+id/text_name"
tools:text="karem.flusser" />
<TextView <TextView
android:id="@+id/text_description_timezone" android:id="@+id/text_message"
style="@style/UserDetails.TextView.Description" style="@style/UserDetails.TextView.Actions"
android:layout_width="wrap_content" android:layout_width="wrap_content"
android:layout_height="wrap_content" android:layout_height="wrap_content"
app:layout_constraintStart_toStartOf="parent" android:layout_marginTop="24dp"
app:layout_constraintTop_toBottomOf="@+id/text_title_timezone" android:drawableTop="@drawable/ic_message_24dp"
tools:text="(UTC-2) 11:08 AM" /> android:text="@string/msg_message"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/text_username" />
<com.wang.avi.AVLoadingIndicatorView <TextView
android:id="@+id/view_loading" android:id="@+id/text_title_status"
style="@style/Authentication.AVLoadingIndicatorView" style="@style/UserDetails.TextView.Title"
android:visibility="gone" android:layout_width="wrap_content"
app:layout_constraintBottom_toBottomOf="parent" android:layout_height="wrap_content"
app:layout_constraintEnd_toEndOf="parent" android:layout_marginStart="@dimen/screen_edge_left_and_right_margins"
app:layout_constraintStart_toStartOf="parent" android:layout_marginTop="20dp"
app:layout_constraintTop_toTopOf="parent" android:text="@string/status"
tools:visibility="visible" /> app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/text_message" />
<androidx.constraintlayout.widget.Group <TextView
android:id="@+id/group_user_details" android:id="@+id/text_description_status"
android:layout_width="wrap_content" style="@style/UserDetails.TextView.Description"
android:layout_height="wrap_content" android:layout_width="wrap_content"
app:constraint_referenced_ids="image_avatar, text_name, text_username, text_message, text_title_status, text_description_status, text_title_timezone, text_description_timezone" /> android:layout_height="wrap_content"
</androidx.constraintlayout.widget.ConstraintLayout> android:layout_marginStart="@dimen/screen_edge_left_and_right_margins"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/text_title_status"
tools:text="Online" />
<TextView
android:id="@+id/text_title_timezone"
style="@style/UserDetails.TextView.Title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="@dimen/screen_edge_left_and_right_margins"
android:layout_marginTop="16dp"
android:text="@string/timezone"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/text_description_status" />
<TextView
android:id="@+id/text_description_timezone"
style="@style/UserDetails.TextView.Description"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="@dimen/screen_edge_left_and_right_margins"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/text_title_timezone"
tools:text="(UTC-2) 11:08 AM" />
<View
android:id="@+id/view_gray_bottom"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_marginTop="16dp"
android:background="#FFF3f4f5"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toBottomOf="@+id/text_description_timezone" />
<com.wang.avi.AVLoadingIndicatorView
android:id="@+id/view_loading"
style="@style/Authentication.AVLoadingIndicatorView"
android:visibility="gone"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<androidx.constraintlayout.widget.Group
android:id="@+id/group_user_details"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:constraint_referenced_ids="image_blur, image_avatar, text_name, text_username, text_message, text_title_status, text_description_status, text_title_timezone, text_description_timezone, view_gray_bottom" />
</androidx.constraintlayout.widget.ConstraintLayout>
</ScrollView>
...@@ -51,6 +51,7 @@ ext { ...@@ -51,6 +51,7 @@ ext {
markwon : '2.0.0', markwon : '2.0.0',
aVLoadingIndicatorView: '2.1.3', aVLoadingIndicatorView: '2.1.3',
glide : '4.8.0', glide : '4.8.0',
glideTransformations : '4.0.0',
// For wearable // For wearable
wear : '2.3.0', wear : '2.3.0',
...@@ -118,6 +119,7 @@ ext { ...@@ -118,6 +119,7 @@ ext {
frescoImageViewer : "com.github.luciofm:FrescoImageViewer:${versions.frescoImageViewer}", frescoImageViewer : "com.github.luciofm:FrescoImageViewer:${versions.frescoImageViewer}",
glide : "com.github.bumptech.glide:glide:${versions.glide}", glide : "com.github.bumptech.glide:glide:${versions.glide}",
glideProcessor : "com.github.bumptech.glide:compiler:${versions.glide}", glideProcessor : "com.github.bumptech.glide:compiler:${versions.glide}",
glideTransformations : "jp.wasabeef:glide-transformations:${versions.glideTransformations}",
markwon : "ru.noties:markwon:${versions.markwon}", markwon : "ru.noties:markwon:${versions.markwon}",
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment