mirror of
https://github.com/element-hq/element-android
synced 2024-11-28 13:38:49 +03:00
RoomProfile: fix some rendering + change anim
This commit is contained in:
parent
289951ea4a
commit
81712ae736
6 changed files with 126 additions and 52 deletions
|
@ -0,0 +1,53 @@
|
|||
/*
|
||||
* 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.animations
|
||||
|
||||
import com.google.android.material.appbar.AppBarLayout
|
||||
import com.google.android.material.appbar.AppBarLayout.OnOffsetChangedListener
|
||||
import kotlin.math.abs
|
||||
|
||||
|
||||
abstract class AppBarStateChangeListener : OnOffsetChangedListener {
|
||||
|
||||
enum class State {
|
||||
EXPANDED, COLLAPSED, IDLE
|
||||
}
|
||||
|
||||
private var currentState = State.IDLE
|
||||
|
||||
override fun onOffsetChanged(appBarLayout: AppBarLayout, i: Int) {
|
||||
currentState = if (i == 0) {
|
||||
if (currentState != State.EXPANDED) {
|
||||
onStateChanged(appBarLayout, State.EXPANDED)
|
||||
}
|
||||
State.EXPANDED
|
||||
} else if (abs(i) >= appBarLayout.totalScrollRange) {
|
||||
if (currentState != State.COLLAPSED) {
|
||||
onStateChanged(appBarLayout, State.COLLAPSED)
|
||||
}
|
||||
State.COLLAPSED
|
||||
} else {
|
||||
if (currentState != State.IDLE) {
|
||||
onStateChanged(appBarLayout, State.IDLE)
|
||||
}
|
||||
State.IDLE
|
||||
}
|
||||
}
|
||||
|
||||
abstract fun onStateChanged(appBarLayout: AppBarLayout, state: State)
|
||||
}
|
|
@ -34,8 +34,6 @@ abstract class ProfileItemSection: VectorEpoxyModel<ProfileItemSection.Holder>()
|
|||
holder.sectionView.text = title
|
||||
}
|
||||
|
||||
|
||||
|
||||
class Holder : VectorEpoxyHolder() {
|
||||
val sectionView by bind<TextView>(R.id.itemProfileSectionView)
|
||||
}
|
||||
|
|
|
@ -29,15 +29,14 @@ import androidx.recyclerview.widget.RecyclerView
|
|||
import com.airbnb.mvrx.args
|
||||
import com.airbnb.mvrx.fragmentViewModel
|
||||
import com.airbnb.mvrx.withState
|
||||
import com.google.android.material.snackbar.Snackbar
|
||||
import com.google.android.material.appbar.AppBarLayout
|
||||
import im.vector.matrix.android.api.session.room.notification.RoomNotificationState
|
||||
import im.vector.matrix.android.api.util.toMatrixItem
|
||||
import im.vector.riotx.R
|
||||
import im.vector.riotx.core.error.ErrorFormatter
|
||||
import im.vector.riotx.core.animations.AppBarStateChangeListener
|
||||
import im.vector.riotx.core.extensions.setTextOrHide
|
||||
import im.vector.riotx.core.platform.VectorBaseFragment
|
||||
import im.vector.riotx.features.home.AvatarRenderer
|
||||
import im.vector.riotx.features.home.room.list.RoomListAction
|
||||
import im.vector.riotx.features.home.room.list.actions.RoomListActionsArgs
|
||||
import im.vector.riotx.features.home.room.list.actions.RoomListQuickActionsBottomSheet
|
||||
import im.vector.riotx.features.home.room.list.actions.RoomListQuickActionsSharedAction
|
||||
|
@ -72,6 +71,18 @@ class RoomProfileFragment @Inject constructor(
|
|||
roomProfileSharedActionViewModel = activityViewModelProvider.get(RoomProfileSharedActionViewModel::class.java)
|
||||
setupToolbar(roomProfileToolbar)
|
||||
setupRecyclerView()
|
||||
roomProfileAppBarLayout.addOnOffsetChangedListener(object : AppBarStateChangeListener() {
|
||||
override fun onStateChanged(appBarLayout: AppBarLayout, state: State) {
|
||||
val animationDuration = roomProfileCollapsingToolbarLayout.scrimAnimationDuration
|
||||
if (state == State.COLLAPSED) {
|
||||
roomProfileToolbarAvatarImageView.animate().alpha(1f).duration = animationDuration + 100
|
||||
roomProfileToolbarTitleView.animate().alpha(1f).duration = animationDuration + 100
|
||||
} else {
|
||||
roomProfileToolbarAvatarImageView.animate().alpha(0f).duration = animationDuration - 100
|
||||
roomProfileToolbarTitleView.animate().alpha(0f).duration = animationDuration - 100
|
||||
}
|
||||
}
|
||||
})
|
||||
roomProfileViewModel.viewEvents
|
||||
.observe()
|
||||
.subscribe {
|
||||
|
@ -135,17 +146,18 @@ class RoomProfileFragment @Inject constructor(
|
|||
}
|
||||
|
||||
override fun invalidate() = withState(roomProfileViewModel) { state ->
|
||||
state.roomSummary()?.let {
|
||||
state.roomSummary()?.also {
|
||||
if (it.membership.isLeft()) {
|
||||
Timber.w("The room has been left")
|
||||
activity?.finish()
|
||||
} else {
|
||||
roomProfileNameView.text = it.displayName
|
||||
roomProfileNameView2.text = it.displayName
|
||||
// Use canonical alias when PR with alias management will be merged
|
||||
roomProfileAliasView.text = it.roomId
|
||||
roomProfileToolbarTitleView.text = it.displayName
|
||||
roomProfileAliasView.setTextOrHide(it.canonicalAlias)
|
||||
roomProfileTopicView.setTextOrHide(it.topic)
|
||||
avatarRenderer.render(it.toMatrixItem(), roomProfileAvatarView)
|
||||
val matrixItem = it.toMatrixItem()
|
||||
avatarRenderer.render(matrixItem, roomProfileAvatarView)
|
||||
avatarRenderer.render(matrixItem, roomProfileToolbarAvatarImageView)
|
||||
}
|
||||
}
|
||||
roomProfileController.setData(state)
|
||||
|
|
|
@ -11,8 +11,6 @@
|
|||
style="@style/VectorToolbarStyle"
|
||||
android:layout_width="0dp"
|
||||
android:layout_height="?actionBarSize"
|
||||
android:elevation="4dp"
|
||||
android:transitionName="toolbar"
|
||||
app:layout_constraintEnd_toEndOf="parent"
|
||||
app:layout_constraintStart_toStartOf="parent"
|
||||
app:layout_constraintTop_toTopOf="parent">
|
||||
|
|
|
@ -13,8 +13,11 @@
|
|||
android:layout_height="wrap_content">
|
||||
|
||||
<com.google.android.material.appbar.CollapsingToolbarLayout
|
||||
android:id="@+id/roomProfileCollapsingToolbarLayout"
|
||||
style="@style/VectorAppBarLayoutStyle"
|
||||
android:layout_width="match_parent"
|
||||
app:contentScrim="?riotx_background"
|
||||
app:scrimAnimationDuration="400"
|
||||
android:layout_height="match_parent"
|
||||
app:layout_scrollFlags="scroll|exitUntilCollapsed|snap"
|
||||
app:titleEnabled="false"
|
||||
|
@ -26,11 +29,18 @@
|
|||
android:layout_height="wrap_content"
|
||||
android:background="?riotx_background"
|
||||
android:orientation="vertical"
|
||||
android:paddingTop="160dp"
|
||||
android:minHeight="280dp"
|
||||
app:layout_collapseMode="parallax"
|
||||
app:layout_collapseParallaxMultiplier="0.9">
|
||||
|
||||
<ImageView
|
||||
android:id="@+id/roomProfileAvatarView"
|
||||
android:layout_width="128dp"
|
||||
android:layout_height="128dp"
|
||||
android:layout_gravity="center_horizontal"
|
||||
android:layout_marginTop="16dp"
|
||||
android:layout_marginBottom="16dp"
|
||||
tools:src="@tools:sample/avatars" />
|
||||
|
||||
<TextView
|
||||
android:id="@+id/roomProfileNameView"
|
||||
android:layout_width="wrap_content"
|
||||
|
@ -50,6 +60,7 @@
|
|||
android:layout_gravity="center_horizontal"
|
||||
android:layout_marginTop="8dp"
|
||||
android:singleLine="true"
|
||||
android:layout_marginBottom="16dp"
|
||||
android:textAppearance="@style/Vector.Toolbar.Title"
|
||||
android:textSize="16sp"
|
||||
tools:text="#random:matrix.org" />
|
||||
|
@ -60,7 +71,7 @@
|
|||
android:layout_height="wrap_content"
|
||||
android:layout_gravity="center_horizontal"
|
||||
android:layout_marginStart="40dp"
|
||||
android:layout_marginTop="16dp"
|
||||
android:layout_marginBottom="16dp"
|
||||
android:layout_marginEnd="40dp"
|
||||
android:fontFamily="sans-serif"
|
||||
android:gravity="center"
|
||||
|
@ -74,7 +85,44 @@
|
|||
android:id="@+id/roomProfileToolbar"
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="?attr/actionBarSize"
|
||||
app:layout_collapseMode="pin" />
|
||||
android:background="@android:color/transparent"
|
||||
app:layout_collapseMode="pin">
|
||||
|
||||
<androidx.constraintlayout.widget.ConstraintLayout
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="match_parent">
|
||||
|
||||
<ImageView
|
||||
android:id="@+id/roomProfileToolbarAvatarImageView"
|
||||
android:layout_width="40dp"
|
||||
android:layout_height="40dp"
|
||||
android:layout_marginTop="8dp"
|
||||
android:layout_marginBottom="8dp"
|
||||
app:layout_constraintBottom_toBottomOf="parent"
|
||||
app:layout_constraintStart_toStartOf="parent"
|
||||
app:layout_constraintTop_toTopOf="parent"
|
||||
tools:src="@tools:sample/avatars" />
|
||||
|
||||
<TextView
|
||||
android:id="@+id/roomProfileToolbarTitleView"
|
||||
android:layout_width="0dp"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_marginStart="8dp"
|
||||
android:layout_marginEnd="8dp"
|
||||
android:ellipsize="end"
|
||||
android:maxLines="1"
|
||||
android:textColor="?vctr_toolbar_primary_text_color"
|
||||
android:textSize="18sp"
|
||||
app:layout_constraintStart_toEndOf="@+id/roomProfileToolbarAvatarImageView"
|
||||
app:layout_constraintBottom_toBottomOf="parent"
|
||||
app:layout_constraintEnd_toEndOf="parent"
|
||||
app:layout_constraintTop_toTopOf="parent"
|
||||
tools:text="@sample/matrix.json/data/roomName" />
|
||||
|
||||
</androidx.constraintlayout.widget.ConstraintLayout>
|
||||
|
||||
|
||||
</androidx.appcompat.widget.Toolbar>
|
||||
|
||||
</com.google.android.material.appbar.CollapsingToolbarLayout>
|
||||
|
||||
|
@ -88,39 +136,4 @@
|
|||
app:layout_behavior="@string/appbar_scrolling_view_behavior"
|
||||
tools:listitem="@layout/item_profile_action" />
|
||||
|
||||
<ImageView
|
||||
android:id="@+id/roomProfileAvatarView"
|
||||
android:layout_width="128dp"
|
||||
android:layout_height="128dp"
|
||||
android:layout_gravity="center_horizontal"
|
||||
android:layout_marginTop="16dp"
|
||||
android:elevation="10dp"
|
||||
app:behavior_dependTarget="-176dp"
|
||||
app:behavior_dependType="y"
|
||||
app:behavior_dependsOn="@id/roomProfileAppBarLayout"
|
||||
app:behavior_targetHeight="40dp"
|
||||
app:behavior_targetWidth="40dp"
|
||||
app:behavior_targetX="56dp"
|
||||
app:behavior_targetY="8dp"
|
||||
app:layout_behavior="im.vector.riotx.core.animations.behavior.PercentViewBehavior"
|
||||
tools:src="@tools:sample/avatars" />
|
||||
|
||||
<TextView
|
||||
android:id="@+id/roomProfileNameView2"
|
||||
android:layout_width="wrap_content"
|
||||
android:layout_height="?attr/actionBarSize"
|
||||
android:layout_marginStart="104dp"
|
||||
android:layout_marginTop="-100dp"
|
||||
android:alpha="0"
|
||||
android:elevation="10dp"
|
||||
android:gravity="center_vertical"
|
||||
android:textAppearance="@style/Vector.Toolbar.Title"
|
||||
android:textSize="18dp"
|
||||
app:behavior_dependTarget="-208dp"
|
||||
app:behavior_dependType="y"
|
||||
app:behavior_dependsOn="@id/roomProfileAppBarLayout"
|
||||
app:behavior_targetAlpha="1"
|
||||
app:behavior_targetY="0dp"
|
||||
app:layout_behavior="im.vector.riotx.core.animations.behavior.PercentViewBehavior" />
|
||||
|
||||
</androidx.coordinatorlayout.widget.CoordinatorLayout>
|
|
@ -13,5 +13,5 @@
|
|||
android:textStyle="bold"
|
||||
android:textColor="?riotx_text_primary"
|
||||
android:background="?riotx_header_panel_background"
|
||||
android:layout_height="68dp"/>
|
||||
android:layout_height="56dp"/>
|
||||
|
||||
|
|
Loading…
Reference in a new issue