Add Preview for TextComposer

This commit is contained in:
Benoit Marty 2022-11-28 11:28:49 +01:00
parent b399aebdf5
commit 48ac9f22c0

View file

@ -3,8 +3,18 @@ package io.element.android.x.textcomposer
import android.graphics.Color import android.graphics.Color
import android.net.Uri import android.net.Uri
import androidx.compose.foundation.isSystemInDarkTheme import androidx.compose.foundation.isSystemInDarkTheme
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier import androidx.compose.ui.Modifier
import androidx.compose.ui.platform.LocalInspectionMode
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import androidx.compose.ui.viewinterop.AndroidView import androidx.compose.ui.viewinterop.AndroidView
import androidx.core.view.isInvisible import androidx.core.view.isInvisible
import androidx.core.view.isVisible import androidx.core.view.isVisible
@ -20,6 +30,10 @@ fun TextComposer(
composerCanSendMessage: Boolean, composerCanSendMessage: Boolean,
composerText: String?, composerText: String?,
) { ) {
if (LocalInspectionMode.current) {
FakeComposer(modifier)
return
}
val isInDarkMode = isSystemInDarkTheme() val isInDarkMode = isSystemInDarkTheme()
AndroidView( AndroidView(
modifier = modifier, modifier = modifier,
@ -75,10 +89,28 @@ fun TextComposer(
) )
} }
@Composable
private fun FakeComposer(modifier: Modifier) {
// AndroidView is not Available in this mode, just render a Text
Box(
modifier = modifier
.fillMaxWidth()
.height(80.dp)
) {
Text(
modifier = Modifier
.align(Alignment.Center),
textAlign = TextAlign.Center,
text = "Composer Preview",
fontSize = 20.sp
)
}
}
private fun MessageComposerView.setup(isDarkMode: Boolean) { private fun MessageComposerView.setup(isDarkMode: Boolean) {
val editTextColor = if(isDarkMode){ val editTextColor = if (isDarkMode) {
Color.WHITE Color.WHITE
}else{ } else {
Color.BLACK Color.BLACK
} }
editText.setTextColor(editTextColor) editText.setTextColor(editTextColor)
@ -87,3 +119,16 @@ private fun MessageComposerView.setup(isDarkMode: Boolean) {
emojiButton?.isVisible = true emojiButton?.isVisible = true
sendButton.isVisible = true sendButton.isVisible = true
} }
@Preview
@Composable
fun TextComposerPreview() {
TextComposer(
onSendMessage = {},
fullscreen = false,
onFullscreenToggle = { },
onComposerTextChange = {},
composerCanSendMessage = true,
composerText = "Message",
)
}