Merge pull request #6636 from vector-im/feature/mna/ended-state-map-live-location

[Location Share] - Expanded map state when no more live location shares (PSG-629)
This commit is contained in:
Maxime NATUREL 2022-07-28 10:53:31 +02:00 committed by GitHub
commit a0534d8fcc
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
15 changed files with 227 additions and 95 deletions

1
changelog.d/6635.misc Normal file
View File

@ -0,0 +1 @@
[Location Share] - Expanded map state when no more live location shares

View File

@ -0,0 +1,9 @@
<?xml version="1.0" encoding="utf-8"?>
<resources>
<declare-styleable name="LocationLiveEndedBannerView">
<attr name="locLiveEndedBkgWithAlpha" format="boolean" />
<attr name="locLiveEndedIconMarginStart" format="dimension" />
</declare-styleable>
</resources>

View File

@ -42,7 +42,7 @@ abstract class MessageLiveLocationInactiveItem :
override fun getViewStubId() = STUB_ID
class Holder : AbsMessageItem.Holder(STUB_ID) {
val bannerImageView by bind<ImageView>(R.id.locationLiveInactiveBanner)
val bannerImageView by bind<ImageView>(R.id.locationLiveEndedBannerBackground)
val noLocationMapImageView by bind<ImageView>(R.id.locationLiveInactiveMap)
}

View File

@ -26,8 +26,8 @@ import im.vector.app.core.resources.toTimestamp
import im.vector.app.core.utils.DimensionConverter
import im.vector.app.features.home.room.detail.RoomDetailAction
import im.vector.app.features.home.room.detail.timeline.style.TimelineMessageLayout
import im.vector.app.features.location.live.LocationLiveMessageBannerView
import im.vector.app.features.location.live.LocationLiveMessageBannerViewState
import im.vector.app.features.location.live.LocationLiveRunningBannerView
import org.threeten.bp.LocalDateTime
@EpoxyModelClass
@ -52,9 +52,9 @@ abstract class MessageLiveLocationItem : AbsMessageLocationItem<MessageLiveLocat
val isEmitter = currentUserId != null && currentUserId == locationUserId
val messageLayout = attributes.informationData.messageLayout
val viewState = buildViewState(holder, messageLayout, isEmitter)
holder.locationLiveMessageBanner.isVisible = true
holder.locationLiveMessageBanner.render(viewState)
holder.locationLiveMessageBanner.stopButton.setOnClickListener {
holder.locationLiveRunningBanner.isVisible = true
holder.locationLiveRunningBanner.render(viewState)
holder.locationLiveRunningBanner.stopButton.setOnClickListener {
attributes.callback?.onTimelineItemAction(RoomDetailAction.StopLiveLocationSharing)
}
}
@ -112,7 +112,7 @@ abstract class MessageLiveLocationItem : AbsMessageLocationItem<MessageLiveLocat
override fun getViewStubId() = STUB_ID
class Holder : AbsMessageLocationItem.Holder(STUB_ID) {
val locationLiveMessageBanner by bind<LocationLiveMessageBannerView>(R.id.locationLiveMessageBanner)
val locationLiveRunningBanner by bind<LocationLiveRunningBannerView>(R.id.locationLiveRunningBanner)
}
companion object {

View File

@ -22,6 +22,7 @@ import android.util.AttributeSet
import android.view.Gravity
import android.widget.ImageView
import androidx.core.content.ContextCompat
import androidx.core.content.res.use
import androidx.core.view.marginBottom
import androidx.core.view.marginTop
import androidx.core.view.updateLayoutParams
@ -60,17 +61,13 @@ class MapTilerMapView @JvmOverloads constructor(
private var dimensionConverter: DimensionConverter? = null
init {
context.theme.obtainStyledAttributes(
context.obtainStyledAttributes(
attrs,
R.styleable.MapTilerMapView,
0,
0
).run {
try {
setLocateButtonVisibility(this)
} finally {
recycle()
}
).use {
setLocateButtonVisibility(it)
}
dimensionConverter = DimensionConverter(resources)
}

View File

@ -0,0 +1,65 @@
/*
* Copyright (c) 2022 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.location.live
import android.content.Context
import android.content.res.TypedArray
import android.util.AttributeSet
import android.view.LayoutInflater
import androidx.constraintlayout.widget.ConstraintLayout
import androidx.core.content.res.use
import androidx.core.view.updateLayoutParams
import im.vector.app.R
import im.vector.app.databinding.ViewLocationLiveEndedBannerBinding
private const val BACKGROUND_ALPHA = 0.75f
class LocationLiveEndedBannerView @JvmOverloads constructor(
context: Context,
attrs: AttributeSet? = null,
defStyleAttr: Int = 0
) : ConstraintLayout(context, attrs, defStyleAttr) {
private val binding = ViewLocationLiveEndedBannerBinding.inflate(
LayoutInflater.from(context),
this
)
init {
context.obtainStyledAttributes(
attrs,
R.styleable.LocationLiveEndedBannerView,
0,
0
).use {
setBackgroundAlpha(it)
setIconMarginStart(it)
}
}
private fun setBackgroundAlpha(typedArray: TypedArray) {
val withAlpha = typedArray.getBoolean(R.styleable.LocationLiveEndedBannerView_locLiveEndedBkgWithAlpha, false)
binding.locationLiveEndedBannerBackground.alpha = if (withAlpha) BACKGROUND_ALPHA else 1f
}
private fun setIconMarginStart(typedArray: TypedArray) {
val margin = typedArray.getDimensionPixelOffset(R.styleable.LocationLiveEndedBannerView_locLiveEndedIconMarginStart, 0)
binding.locationLiveEndedBannerIcon.updateLayoutParams<MarginLayoutParams> {
marginStart = margin
}
}
}

View File

@ -31,34 +31,34 @@ import com.bumptech.glide.load.resource.bitmap.GranularRoundedCorners
import im.vector.app.R
import im.vector.app.core.glide.GlideApp
import im.vector.app.core.utils.TextUtils
import im.vector.app.databinding.ViewLocationLiveMessageBannerBinding
import im.vector.app.databinding.ViewLocationLiveRunningBannerBinding
import im.vector.app.features.themes.ThemeUtils
import org.threeten.bp.Duration
private const val REMAINING_TIME_COUNTER_INTERVAL_IN_MS = 1000L
class LocationLiveMessageBannerView @JvmOverloads constructor(
class LocationLiveRunningBannerView @JvmOverloads constructor(
context: Context,
attrs: AttributeSet? = null,
defStyleAttr: Int = 0
) : ConstraintLayout(context, attrs, defStyleAttr) {
private val binding = ViewLocationLiveMessageBannerBinding.inflate(
private val binding = ViewLocationLiveRunningBannerBinding.inflate(
LayoutInflater.from(context),
this
)
val stopButton: Button
get() = binding.locationLiveMessageBannerStop
get() = binding.locationLiveRunningBannerStop
private val background: ImageView
get() = binding.locationLiveMessageBannerBackground
get() = binding.locationLiveRunningBannerBackground
private val title: TextView
get() = binding.locationLiveMessageBannerTitle
get() = binding.locationLiveRunningBannerTitle
private val subTitle: TextView
get() = binding.locationLiveMessageBannerSubTitle
get() = binding.locationLiveRunningBannerSubTitle
private var countDownTimer: CountDownTimer? = null
@ -70,7 +70,7 @@ class LocationLiveMessageBannerView @JvmOverloads constructor(
GlideApp.with(context)
.load(ColorDrawable(ThemeUtils.getColor(context, android.R.attr.colorBackground)))
.placeholder(binding.locationLiveMessageBannerBackground.drawable)
.placeholder(binding.locationLiveRunningBannerBackground.drawable)
.transform(GranularRoundedCorners(0f, 0f, viewState.bottomEndCornerRadiusInDp, viewState.bottomStartCornerRadiusInDp))
.into(background)
}
@ -109,14 +109,14 @@ class LocationLiveMessageBannerView @JvmOverloads constructor(
if (viewState.isStopButtonCenteredVertically) {
constraintSet.connect(
R.id.locationLiveMessageBannerStop,
R.id.locationLiveRunningBannerStop,
ConstraintSet.BOTTOM,
R.id.locationLiveMessageBannerBackground,
R.id.locationLiveRunningBannerBackground,
ConstraintSet.BOTTOM,
0
)
} else {
constraintSet.clear(R.id.locationLiveMessageBannerStop, ConstraintSet.BOTTOM)
constraintSet.clear(R.id.locationLiveRunningBannerStop, ConstraintSet.BOTTOM)
}
constraintSet.applyTo(parentLayout)

View File

@ -22,6 +22,8 @@ import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import androidx.core.graphics.drawable.toBitmap
import androidx.core.view.isGone
import androidx.core.view.isVisible
import androidx.lifecycle.lifecycleScope
import com.airbnb.mvrx.fragmentViewModel
import com.airbnb.mvrx.withState
@ -57,7 +59,6 @@ import javax.inject.Inject
/**
* Screen showing a map with all the current users sharing their live location in a room.
*/
@AndroidEntryPoint
class LocationLiveMapViewFragment @Inject constructor() : VectorBaseFragment<FragmentLocationLiveMapViewBinding>() {
@ -110,13 +111,6 @@ class LocationLiveMapViewFragment @Inject constructor() : VectorBaseFragment<Fra
private fun setupMap() {
val mapFragment = getOrCreateSupportMapFragment()
mapFragment.getMapAsync { mapboxMap ->
val bottomSheetHeight = BottomSheetBehavior.from(views.bottomSheet).peekHeight
mapboxMap.uiSettings.apply {
// Place copyright above the user list bottom sheet
setLogoMargins(dimensionConverter.dpToPx(8), 0, 0, bottomSheetHeight + dimensionConverter.dpToPx(8))
setAttributionMargins(dimensionConverter.dpToPx(96), 0, 0, bottomSheetHeight + dimensionConverter.dpToPx(8))
}
lifecycleScope.launch {
mapboxMap.setStyle(urlMapProvider.getMapUrl()) { style ->
mapStyle = style
@ -173,9 +167,47 @@ class LocationLiveMapViewFragment @Inject constructor() : VectorBaseFragment<Fra
}
private fun updateUserListBottomSheet(userLocations: List<UserLiveLocationViewState>) {
if (userLocations.isEmpty()) {
showEndedLiveBanner()
} else {
showUserList(userLocations)
}
}
private fun showEndedLiveBanner() {
views.bottomSheet.isGone = true
views.liveLocationMapFragmentEndedBanner.isVisible = true
updateCopyrightMargin(bottomOffset = views.liveLocationMapFragmentEndedBanner.height)
}
private fun showUserList(userLocations: List<UserLiveLocationViewState>) {
val bottomSheetHeight = BottomSheetBehavior.from(views.bottomSheet).peekHeight
updateCopyrightMargin(bottomOffset = bottomSheetHeight)
views.bottomSheet.isVisible = true
views.liveLocationMapFragmentEndedBanner.isGone = true
bottomSheetController.setData(userLocations)
}
private fun updateCopyrightMargin(bottomOffset: Int) {
getOrCreateSupportMapFragment().getMapAsync { mapboxMap ->
mapboxMap.uiSettings.apply {
// Place copyright above the user list bottom sheet
setLogoMargins(
dimensionConverter.dpToPx(COPYRIGHT_MARGIN_DP),
0,
0,
bottomOffset + dimensionConverter.dpToPx(COPYRIGHT_MARGIN_DP)
)
setAttributionMargins(
dimensionConverter.dpToPx(COPYRIGHT_ATTRIBUTION_MARGIN_DP),
0,
0,
bottomOffset + dimensionConverter.dpToPx(COPYRIGHT_MARGIN_DP)
)
}
}
}
private fun updateMap(userLiveLocations: List<UserLiveLocationViewState>) {
symbolManager?.let { sManager ->
val latLngBoundsBuilder = LatLngBounds.Builder()
@ -278,5 +310,7 @@ class LocationLiveMapViewFragment @Inject constructor() : VectorBaseFragment<Fra
companion object {
private const val MAP_FRAGMENT_TAG = "im.vector.app.features.location.live.map"
private const val COPYRIGHT_MARGIN_DP = 8
private const val COPYRIGHT_ATTRIBUTION_MARGIN_DP = 96
}
}

View File

@ -24,6 +24,7 @@ import android.widget.ImageView
import androidx.annotation.ColorInt
import androidx.constraintlayout.widget.ConstraintLayout
import androidx.core.content.ContextCompat
import androidx.core.content.res.use
import androidx.core.view.setPadding
import im.vector.app.R
import im.vector.app.core.extensions.tintBackground
@ -45,18 +46,14 @@ class LocationSharingOptionView @JvmOverloads constructor(
)
init {
context.theme.obtainStyledAttributes(
context.obtainStyledAttributes(
attrs,
R.styleable.LocationSharingOptionView,
0,
0
).run {
try {
setIcon(this)
setTitle(this)
} finally {
recycle()
}
).use {
setIcon(it)
setTitle(it)
}
}

View File

@ -10,7 +10,7 @@
android:id="@+id/liveLocationPopupAnchor"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_gravity="center"/>
android:layout_gravity="center" />
<FrameLayout
android:id="@+id/liveLocationMapFragmentContainer"
@ -49,4 +49,14 @@
</androidx.constraintlayout.widget.ConstraintLayout>
<im.vector.app.features.location.live.LocationLiveEndedBannerView
android:id="@+id/liveLocationMapFragmentEndedBanner"
android:layout_width="match_parent"
android:layout_height="56dp"
android:layout_gravity="bottom"
android:visibility="gone"
app:locLiveEndedBkgWithAlpha="false"
app:locLiveEndedIconMarginStart="16dp"
tools:visibility="visible" />
</androidx.coordinatorlayout.widget.CoordinatorLayout>

View File

@ -15,16 +15,15 @@
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<ImageView
android:id="@+id/locationLiveInactiveBanner"
<im.vector.app.features.location.live.LocationLiveEndedBannerView
android:id="@+id/locationLiveEndedBanner"
android:layout_width="0dp"
android:layout_height="48dp"
android:alpha="0.75"
android:src="?android:colorBackground"
app:layout_constraintBottom_toBottomOf="@id/locationLiveInactiveMap"
app:layout_constraintEnd_toEndOf="@id/locationLiveInactiveMap"
app:layout_constraintStart_toStartOf="@id/locationLiveInactiveMap"
tools:ignore="ContentDescription" />
app:locLiveEndedBkgWithAlpha="true"
app:locLiveEndedIconMarginStart="8dp" />
<ImageView
android:id="@+id/locationLiveInactiveIcon"
@ -37,37 +36,6 @@
app:tint="?vctr_content_quaternary"
tools:ignore="ContentDescription" />
<ImageView
android:id="@+id/locationLiveInactiveBannerIcon"
android:layout_width="26dp"
android:layout_height="26dp"
android:layout_marginVertical="8dp"
android:layout_marginStart="8dp"
android:background="@drawable/circle"
android:backgroundTint="?vctr_content_quaternary"
android:padding="3dp"
app:layout_constraintBottom_toBottomOf="@id/locationLiveInactiveBanner"
app:layout_constraintStart_toStartOf="@id/locationLiveInactiveBanner"
app:layout_constraintTop_toTopOf="@id/locationLiveInactiveBanner"
app:srcCompat="@drawable/ic_attachment_location_live_white"
app:tint="?android:colorBackground"
tools:ignore="ContentDescription" />
<TextView
android:id="@+id/locationLiveInactiveTitle"
style="@style/Widget.Vector.TextView.Caption"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_margin="8dp"
android:lines="1"
android:text="@string/location_share_live_ended"
android:ellipsize="end"
android:textColor="?vctr_content_tertiary"
app:layout_constraintBottom_toBottomOf="@id/locationLiveInactiveBanner"
app:layout_constraintStart_toEndOf="@id/locationLiveInactiveBannerIcon"
app:layout_constraintEnd_toEndOf="@id/locationLiveInactiveBanner"
app:layout_constraintTop_toTopOf="@id/locationLiveInactiveBanner" />
<androidx.constraintlayout.widget.Guideline
android:id="@+id/locationLiveInactiveVerticalCenter"
android:layout_width="wrap_content"

View File

@ -28,8 +28,8 @@
<ImageView
android:id="@+id/locationLiveStartIcon"
android:layout_width="26dp"
android:layout_height="26dp"
android:layout_width="32dp"
android:layout_height="32dp"
android:layout_marginVertical="8dp"
android:layout_marginStart="8dp"
android:background="@drawable/circle"
@ -49,6 +49,7 @@
android:layout_height="wrap_content"
android:layout_margin="8dp"
android:lines="1"
android:ellipsize="end"
android:text="@string/location_share_live_started"
android:textColor="?vctr_content_tertiary"
app:layout_constraintBottom_toBottomOf="@id/locationLiveStartBanner"

View File

@ -45,8 +45,8 @@
app:layout_constraintTop_toBottomOf="@id/staticMapPinImageView"
tools:visibility="visible" />
<im.vector.app.features.location.live.LocationLiveMessageBannerView
android:id="@+id/locationLiveMessageBanner"
<im.vector.app.features.location.live.LocationLiveRunningBannerView
android:id="@+id/locationLiveRunningBanner"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:visibility="gone"

View File

@ -0,0 +1,50 @@
<?xml version="1.0" encoding="utf-8"?>
<merge xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="48dp"
tools:parentTag="androidx.constraintlayout.widget.ConstraintLayout">
<ImageView
android:id="@+id/locationLiveEndedBannerBackground"
android:layout_width="0dp"
android:layout_height="0dp"
android:src="?android:colorBackground"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
tools:ignore="ContentDescription" />
<ImageView
android:id="@+id/locationLiveEndedBannerIcon"
android:layout_width="32dp"
android:layout_height="32dp"
android:layout_marginVertical="8dp"
android:layout_marginStart="8dp"
android:background="@drawable/circle"
android:backgroundTint="?vctr_content_quaternary"
android:padding="3dp"
app:layout_constraintBottom_toBottomOf="@id/locationLiveEndedBannerBackground"
app:layout_constraintStart_toStartOf="@id/locationLiveEndedBannerBackground"
app:layout_constraintTop_toTopOf="@id/locationLiveEndedBannerBackground"
app:srcCompat="@drawable/ic_attachment_location_live_white"
app:tint="?android:colorBackground"
tools:ignore="ContentDescription" />
<TextView
android:id="@+id/locationLiveEndedTitle"
style="@style/Widget.Vector.TextView.Caption"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_margin="8dp"
android:ellipsize="end"
android:lines="1"
android:text="@string/location_share_live_ended"
android:textColor="?vctr_content_tertiary"
app:layout_constraintBottom_toBottomOf="@id/locationLiveEndedBannerBackground"
app:layout_constraintEnd_toEndOf="@id/locationLiveEndedBannerBackground"
app:layout_constraintStart_toEndOf="@id/locationLiveEndedBannerIcon"
app:layout_constraintTop_toTopOf="@id/locationLiveEndedBannerBackground" />
</merge>

View File

@ -7,7 +7,7 @@
tools:parentTag="androidx.constraintlayout.widget.ConstraintLayout">
<ImageView
android:id="@+id/locationLiveMessageBannerBackground"
android:id="@+id/locationLiveRunningBannerBackground"
android:layout_width="0dp"
android:layout_height="50dp"
android:alpha="0.75"
@ -18,7 +18,7 @@
tools:ignore="ContentDescription" />
<ImageView
android:id="@+id/locationLiveMessageBannerIcon"
android:id="@+id/locationLiveRunningBannerIcon"
android:layout_width="32dp"
android:layout_height="32dp"
android:layout_marginHorizontal="8dp"
@ -26,13 +26,13 @@
android:backgroundTint="?vctr_live_location"
android:padding="3dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="@id/locationLiveMessageBannerBackground"
app:layout_constraintStart_toStartOf="@id/locationLiveRunningBannerBackground"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="@drawable/ic_attachment_location_live_white"
tools:ignore="ContentDescription" />
<TextView
android:id="@+id/locationLiveMessageBannerTitle"
android:id="@+id/locationLiveRunningBannerTitle"
style="@style/Widget.Vector.TextView.Caption"
android:layout_width="0dp"
android:layout_height="wrap_content"
@ -40,16 +40,16 @@
android:ellipsize="end"
android:lines="1"
android:textColor="?colorOnSurface"
app:layout_constraintBottom_toTopOf="@id/locationLiveMessageBannerSubTitle"
app:layout_constraintEnd_toStartOf="@id/locationLiveMessageBannerStop"
app:layout_constraintBottom_toTopOf="@id/locationLiveRunningBannerSubTitle"
app:layout_constraintEnd_toStartOf="@id/locationLiveRunningBannerStop"
app:layout_constraintHorizontal_bias="0"
app:layout_constraintStart_toEndOf="@id/locationLiveMessageBannerIcon"
app:layout_constraintStart_toEndOf="@id/locationLiveRunningBannerIcon"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_chainStyle="packed"
tools:text="@string/location_share_live_enabled" />
<TextView
android:id="@+id/locationLiveMessageBannerSubTitle"
android:id="@+id/locationLiveRunningBannerSubTitle"
style="@style/Widget.Vector.TextView.Caption"
android:layout_width="0dp"
android:layout_height="wrap_content"
@ -57,19 +57,19 @@
android:lines="1"
android:textColor="?vctr_content_secondary"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="@id/locationLiveMessageBannerTitle"
app:layout_constraintEnd_toEndOf="@id/locationLiveRunningBannerTitle"
app:layout_constraintHorizontal_bias="0"
app:layout_constraintStart_toStartOf="@id/locationLiveMessageBannerTitle"
app:layout_constraintTop_toBottomOf="@id/locationLiveMessageBannerTitle"
app:layout_constraintStart_toStartOf="@id/locationLiveRunningBannerTitle"
app:layout_constraintTop_toBottomOf="@id/locationLiveRunningBannerTitle"
tools:text="9min left" />
<Button
android:id="@+id/locationLiveMessageBannerStop"
android:id="@+id/locationLiveRunningBannerStop"
style="@style/Widget.Vector.Button.Text.LocationLive"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/location_share_live_stop"
app:layout_constraintBottom_toBottomOf="@id/locationLiveMessageBannerBackground"
app:layout_constraintBottom_toBottomOf="@id/locationLiveRunningBannerBackground"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="@id/locationLiveMessageBannerBackground" />
app:layout_constraintTop_toTopOf="@id/locationLiveRunningBannerBackground" />
</merge>