Fix color for media viewer according to Figma.
This commit is contained in:
parent
ed80ca9899
commit
8d049e134f
4 changed files with 24 additions and 6 deletions
|
|
@ -26,7 +26,6 @@ import androidx.compose.runtime.setValue
|
||||||
import androidx.compose.ui.Alignment
|
import androidx.compose.ui.Alignment
|
||||||
import androidx.compose.ui.Modifier
|
import androidx.compose.ui.Modifier
|
||||||
import androidx.compose.ui.draw.clip
|
import androidx.compose.ui.draw.clip
|
||||||
import androidx.compose.ui.graphics.Color
|
|
||||||
import androidx.compose.ui.res.stringResource
|
import androidx.compose.ui.res.stringResource
|
||||||
import androidx.compose.ui.text.style.TextAlign
|
import androidx.compose.ui.text.style.TextAlign
|
||||||
import androidx.compose.ui.tooling.preview.PreviewParameter
|
import androidx.compose.ui.tooling.preview.PreviewParameter
|
||||||
|
|
@ -40,6 +39,7 @@ import io.element.android.libraries.designsystem.theme.components.Icon
|
||||||
import io.element.android.libraries.designsystem.theme.components.IconButton
|
import io.element.android.libraries.designsystem.theme.components.IconButton
|
||||||
import io.element.android.libraries.designsystem.theme.components.Slider
|
import io.element.android.libraries.designsystem.theme.components.Slider
|
||||||
import io.element.android.libraries.designsystem.theme.components.Text
|
import io.element.android.libraries.designsystem.theme.components.Text
|
||||||
|
import io.element.android.libraries.mediaviewer.impl.util.bgCanvasWithTransparency
|
||||||
import io.element.android.libraries.ui.strings.CommonStrings
|
import io.element.android.libraries.ui.strings.CommonStrings
|
||||||
|
|
||||||
@Composable
|
@Composable
|
||||||
|
|
@ -58,7 +58,7 @@ fun MediaPlayerControllerView(
|
||||||
) {
|
) {
|
||||||
Box(
|
Box(
|
||||||
modifier = Modifier
|
modifier = Modifier
|
||||||
.background(color = Color(0x99101317))
|
.background(color = bgCanvasWithTransparency)
|
||||||
.padding(horizontal = 8.dp, vertical = 4.dp),
|
.padding(horizontal = 8.dp, vertical = 4.dp),
|
||||||
contentAlignment = Alignment.Center,
|
contentAlignment = Alignment.Center,
|
||||||
) {
|
) {
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,16 @@
|
||||||
|
/*
|
||||||
|
* Copyright 2025 New Vector Ltd.
|
||||||
|
*
|
||||||
|
* SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-Element-Commercial
|
||||||
|
* Please see LICENSE files in the repository root for full details.
|
||||||
|
*/
|
||||||
|
|
||||||
|
package io.element.android.libraries.mediaviewer.impl.util
|
||||||
|
|
||||||
|
import androidx.compose.runtime.Composable
|
||||||
|
import androidx.compose.ui.graphics.Color
|
||||||
|
import io.element.android.compound.theme.ElementTheme
|
||||||
|
|
||||||
|
val bgCanvasWithTransparency: Color
|
||||||
|
@Composable
|
||||||
|
get() = ElementTheme.colors.bgCanvasDefault.copy(alpha = 0.6f)
|
||||||
|
|
@ -16,6 +16,7 @@ import androidx.compose.runtime.getValue
|
||||||
import androidx.compose.runtime.rememberUpdatedState
|
import androidx.compose.runtime.rememberUpdatedState
|
||||||
import androidx.compose.ui.Modifier
|
import androidx.compose.ui.Modifier
|
||||||
import androidx.compose.ui.graphics.Color
|
import androidx.compose.ui.graphics.Color
|
||||||
|
import io.element.android.compound.theme.ElementTheme
|
||||||
import kotlinx.coroutines.delay
|
import kotlinx.coroutines.delay
|
||||||
import me.saket.telephoto.flick.FlickToDismiss
|
import me.saket.telephoto.flick.FlickToDismiss
|
||||||
import me.saket.telephoto.flick.FlickToDismissState
|
import me.saket.telephoto.flick.FlickToDismissState
|
||||||
|
|
@ -90,5 +91,5 @@ private fun backgroundColorFor(flickState: FlickToDismissState): Color {
|
||||||
},
|
},
|
||||||
label = "Background alpha",
|
label = "Background alpha",
|
||||||
)
|
)
|
||||||
return Color.Black.copy(alpha = animatedAlpha)
|
return ElementTheme.colors.bgCanvasDefault.copy(alpha = animatedAlpha)
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -78,6 +78,7 @@ import io.element.android.libraries.mediaviewer.impl.details.MediaDetailsBottomS
|
||||||
import io.element.android.libraries.mediaviewer.impl.local.LocalMediaView
|
import io.element.android.libraries.mediaviewer.impl.local.LocalMediaView
|
||||||
import io.element.android.libraries.mediaviewer.impl.local.PlayableState
|
import io.element.android.libraries.mediaviewer.impl.local.PlayableState
|
||||||
import io.element.android.libraries.mediaviewer.impl.local.rememberLocalMediaViewState
|
import io.element.android.libraries.mediaviewer.impl.local.rememberLocalMediaViewState
|
||||||
|
import io.element.android.libraries.mediaviewer.impl.util.bgCanvasWithTransparency
|
||||||
import io.element.android.libraries.ui.strings.CommonStrings
|
import io.element.android.libraries.ui.strings.CommonStrings
|
||||||
import kotlinx.coroutines.delay
|
import kotlinx.coroutines.delay
|
||||||
import me.saket.telephoto.zoomable.ZoomSpec
|
import me.saket.telephoto.zoomable.ZoomSpec
|
||||||
|
|
@ -209,7 +210,7 @@ fun MediaViewerView(
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
colors = TopAppBarDefaults.topAppBarColors(
|
colors = TopAppBarDefaults.topAppBarColors(
|
||||||
containerColor = Color.Black.copy(alpha = 0.6f),
|
containerColor = bgCanvasWithTransparency,
|
||||||
),
|
),
|
||||||
navigationIcon = { BackButton(onClick = onBackClick) },
|
navigationIcon = { BackButton(onClick = onBackClick) },
|
||||||
)
|
)
|
||||||
|
|
@ -455,7 +456,7 @@ private fun MediaViewerTopBar(
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
colors = TopAppBarDefaults.topAppBarColors(
|
colors = TopAppBarDefaults.topAppBarColors(
|
||||||
containerColor = Color.Black.copy(alpha = 0.6f),
|
containerColor = bgCanvasWithTransparency,
|
||||||
),
|
),
|
||||||
navigationIcon = { BackButton(onClick = onBackClick) },
|
navigationIcon = { BackButton(onClick = onBackClick) },
|
||||||
actions = {
|
actions = {
|
||||||
|
|
@ -501,7 +502,7 @@ private fun MediaViewerBottomBar(
|
||||||
Column(
|
Column(
|
||||||
modifier = modifier
|
modifier = modifier
|
||||||
.fillMaxWidth()
|
.fillMaxWidth()
|
||||||
.background(Color(0x99101317))
|
.background(bgCanvasWithTransparency)
|
||||||
.onSizeChanged {
|
.onSizeChanged {
|
||||||
onHeightChange(it.height)
|
onHeightChange(it.height)
|
||||||
},
|
},
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue