Messages: update how textcomposer is composed
This commit is contained in:
parent
17e90560e2
commit
1548dd4e6a
2 changed files with 38 additions and 48 deletions
|
|
@ -109,7 +109,7 @@ fun MessagesContent(
|
||||||
)
|
)
|
||||||
},
|
},
|
||||||
content = { padding ->
|
content = { padding ->
|
||||||
Box(
|
Column(
|
||||||
modifier = Modifier
|
modifier = Modifier
|
||||||
.padding(padding)
|
.padding(padding)
|
||||||
.fillMaxSize()
|
.fillMaxSize()
|
||||||
|
|
@ -119,38 +119,37 @@ fun MessagesContent(
|
||||||
timelineItems = timelineItems,
|
timelineItems = timelineItems,
|
||||||
hasMoreToLoad = hasMoreToLoad,
|
hasMoreToLoad = hasMoreToLoad,
|
||||||
onReachedLoadMore = onReachedLoadMore,
|
onReachedLoadMore = onReachedLoadMore,
|
||||||
|
modifier = Modifier.weight(1f)
|
||||||
)
|
)
|
||||||
Box(
|
TextComposer(
|
||||||
modifier = Modifier.align(Alignment.BottomCenter)
|
callback = object : Callback {
|
||||||
) {
|
override fun onRichContentSelected(contentUri: Uri): Boolean {
|
||||||
TextComposer(
|
return false
|
||||||
callback = object : Callback {
|
}
|
||||||
override fun onRichContentSelected(contentUri: Uri): Boolean {
|
|
||||||
return false
|
|
||||||
}
|
|
||||||
|
|
||||||
override fun onTextChanged(text: CharSequence) {
|
override fun onTextChanged(text: CharSequence) {
|
||||||
}
|
}
|
||||||
|
|
||||||
override fun onCloseRelatedMessage() {
|
override fun onCloseRelatedMessage() {
|
||||||
}
|
}
|
||||||
|
|
||||||
override fun onSendMessage(text: CharSequence) {
|
override fun onSendMessage(text: CharSequence) {
|
||||||
onSendMessage.invoke(text)
|
onSendMessage.invoke(text)
|
||||||
}
|
}
|
||||||
|
|
||||||
override fun onAddAttachment() {
|
override fun onAddAttachment() {
|
||||||
}
|
}
|
||||||
|
|
||||||
override fun onExpandOrCompactChange() {
|
override fun onExpandOrCompactChange() {
|
||||||
}
|
}
|
||||||
|
|
||||||
override fun onFullScreenModeChanged() {
|
override fun onFullScreenModeChanged() {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
height = COMPOSER_HEIGHT
|
modifier = Modifier
|
||||||
)
|
.fillMaxWidth()
|
||||||
}
|
.height(COMPOSER_HEIGHT)
|
||||||
|
)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
)
|
)
|
||||||
|
|
@ -162,19 +161,15 @@ fun TimelineItems(
|
||||||
timelineItems: List<MessagesTimelineItemState>,
|
timelineItems: List<MessagesTimelineItemState>,
|
||||||
hasMoreToLoad: Boolean,
|
hasMoreToLoad: Boolean,
|
||||||
onReachedLoadMore: () -> Unit,
|
onReachedLoadMore: () -> Unit,
|
||||||
|
modifier: Modifier = Modifier,
|
||||||
) {
|
) {
|
||||||
LazyColumn(
|
LazyColumn(
|
||||||
modifier = Modifier
|
modifier = modifier.fillMaxWidth(),
|
||||||
.padding(bottom = COMPOSER_HEIGHT)
|
|
||||||
.fillMaxSize(),
|
|
||||||
state = lazyListState,
|
state = lazyListState,
|
||||||
horizontalAlignment = Alignment.Start,
|
horizontalAlignment = Alignment.Start,
|
||||||
verticalArrangement = Arrangement.Bottom,
|
verticalArrangement = Arrangement.Bottom,
|
||||||
reverseLayout = true
|
reverseLayout = true
|
||||||
) {
|
) {
|
||||||
item {
|
|
||||||
Spacer(modifier = Modifier.height(8.dp))
|
|
||||||
}
|
|
||||||
itemsIndexed(timelineItems) { index, timelineItem ->
|
itemsIndexed(timelineItems) { index, timelineItem ->
|
||||||
TimelineItemRow(timelineItem = timelineItem)
|
TimelineItemRow(timelineItem = timelineItem)
|
||||||
}
|
}
|
||||||
|
|
@ -267,7 +262,6 @@ fun MessageEventBubble(
|
||||||
messageEvent: MessagesTimelineItemState.MessageEvent,
|
messageEvent: MessagesTimelineItemState.MessageEvent,
|
||||||
modifier: Modifier = Modifier,
|
modifier: Modifier = Modifier,
|
||||||
) {
|
) {
|
||||||
|
|
||||||
fun MessagesTimelineItemState.MessageEvent.bubbleShape(): Shape {
|
fun MessagesTimelineItemState.MessageEvent.bubbleShape(): Shape {
|
||||||
return when (groupPosition) {
|
return when (groupPosition) {
|
||||||
MessagesItemGroupPosition.First -> if (isMine) {
|
MessagesItemGroupPosition.First -> if (isMine) {
|
||||||
|
|
@ -295,6 +289,14 @@ fun MessageEventBubble(
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
fun Modifier.offsetForItem(messageEvent: MessagesTimelineItemState.MessageEvent): Modifier {
|
||||||
|
return if (messageEvent.isMine) {
|
||||||
|
offset(y = -(12.dp))
|
||||||
|
} else {
|
||||||
|
offset(x = 20.dp, y = -(12.dp))
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
val (backgroundBubbleColor, border) = if (messageEvent.isMine) {
|
val (backgroundBubbleColor, border) = if (messageEvent.isMine) {
|
||||||
Pair(MaterialTheme.colorScheme.surfaceVariant, null)
|
Pair(MaterialTheme.colorScheme.surfaceVariant, null)
|
||||||
} else {
|
} else {
|
||||||
|
|
@ -304,15 +306,7 @@ fun MessageEventBubble(
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
fun Modifier.offsetForItem(messageEvent: MessagesTimelineItemState.MessageEvent): Modifier {
|
val bubbleShape = messageEvent.bubbleShape()
|
||||||
return if (messageEvent.isMine) {
|
|
||||||
offset(y = -(12.dp))
|
|
||||||
} else {
|
|
||||||
offset(x = 20.dp, y = -(12.dp))
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
val bubbleShape = remember { messageEvent.bubbleShape() }
|
|
||||||
Surface(
|
Surface(
|
||||||
modifier = modifier
|
modifier = modifier
|
||||||
.widthIn(min = 80.dp)
|
.widthIn(min = 80.dp)
|
||||||
|
|
|
||||||
|
|
@ -1,9 +1,7 @@
|
||||||
package io.element.android.x.textcomposer
|
package io.element.android.x.textcomposer
|
||||||
|
|
||||||
import androidx.compose.foundation.layout.*
|
|
||||||
import androidx.compose.runtime.Composable
|
import androidx.compose.runtime.Composable
|
||||||
import androidx.compose.ui.Modifier
|
import androidx.compose.ui.Modifier
|
||||||
import androidx.compose.ui.unit.Dp
|
|
||||||
import androidx.compose.ui.viewinterop.AndroidView
|
import androidx.compose.ui.viewinterop.AndroidView
|
||||||
import androidx.core.view.isVisible
|
import androidx.core.view.isVisible
|
||||||
import io.element.android.x.element.resources.R as ElementR
|
import io.element.android.x.element.resources.R as ElementR
|
||||||
|
|
@ -11,12 +9,10 @@ import io.element.android.x.element.resources.R as ElementR
|
||||||
@Composable
|
@Composable
|
||||||
fun TextComposer(
|
fun TextComposer(
|
||||||
callback: Callback,
|
callback: Callback,
|
||||||
height: Dp,
|
modifier: Modifier = Modifier,
|
||||||
){
|
){
|
||||||
AndroidView(
|
AndroidView(
|
||||||
modifier = Modifier
|
modifier = modifier,
|
||||||
.fillMaxWidth()
|
|
||||||
.height(height),
|
|
||||||
factory = { context ->
|
factory = { context ->
|
||||||
RichTextComposerLayout(context).apply {
|
RichTextComposerLayout(context).apply {
|
||||||
// Sets up listeners for View -> Compose communication
|
// Sets up listeners for View -> Compose communication
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue