Skip to content

Commit

Permalink
add debugging for compose recomposing
Browse files Browse the repository at this point in the history
  • Loading branch information
@zoff99
zoff99 committed Feb 8, 2024
1 parent 3fa9e40 commit bfbf3b5
Show file tree
Hide file tree
Showing 6 changed files with 61 additions and 37 deletions.
83 changes: 51 additions & 32 deletions src/main/kotlin/Main.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -72,6 +72,7 @@ import androidx.compose.ui.geometry.CornerRadius
import androidx.compose.ui.geometry.Size
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.PathEffect
import androidx.compose.ui.graphics.RectangleShape
import androidx.compose.ui.graphics.drawscope.DrawScope
import androidx.compose.ui.graphics.drawscope.Stroke
import androidx.compose.ui.graphics.painter.Painter
Expand Down Expand Up @@ -183,6 +184,7 @@ import com.vanniktech.emoji.ios.IosEmojiProvider
import com.vanniktech.emoji.search.SearchEmojiManager
import com.zoffcc.applications.ffmpegav.AVActivity.JAVA_AUDIO_IN_DEVICE_NAME
import com.zoffcc.applications.trifa.EmojiStrAndName
import com.zoffcc.applications.trifa.MainActivity.Companion.DEBUG_COMPOSE_UI_UPDATES

private const val TAG = "trifa.Main.kt"
var tox_running_state_wrapper = "start"
Expand Down Expand Up @@ -282,15 +284,15 @@ fun App()
MaterialTheme {
scaffoldState = rememberScaffoldState()
ScaffoldCoroutineScope = rememberCoroutineScope()
Scaffold(scaffoldState = scaffoldState) {
Row() {
Scaffold(modifier = Modifier.randomDebugBorder(), scaffoldState = scaffoldState) {
Row(modifier = Modifier.randomDebugBorder()) {
var uiMode by remember { mutableStateOf(UiMode.CONTACTS) }
var main_top_tab_height by remember { mutableStateOf(MAIN_TOP_TAB_HEIGHT) }
BriarSidebar(uiMode = uiMode, setUiMode = { uiMode = it })
VerticalDivider()
Column(Modifier.fillMaxSize()) {
Row(modifier = Modifier.fillMaxWidth().height(main_top_tab_height)) {
Column{
Column(Modifier.randomDebugBorder().fillMaxSize()) {
Row(modifier = Modifier.randomDebugBorder().fillMaxWidth().height(main_top_tab_height)) {
Column(modifier = Modifier.randomDebugBorder()) {
Row(Modifier.wrapContentHeight(), Arrangement.spacedBy(5.dp)) {
Button(modifier = Modifier.width(140.dp), onClick = { // start/stop tox button
if (tox_running_state == "running")
Expand Down Expand Up @@ -466,7 +468,7 @@ fun App()
AVState.CALL_STATUS.CALL_STATUS_CALLING,
AVState.CALL_STATUS.CALL_STATUS_ENDING ->
{
Row() {
Row(modifier = Modifier.randomDebugBorder().padding(3.dp)) {
var video_in_box_width by remember { mutableStateOf(VIDEO_IN_BOX_WIDTH_SMALL) }
var video_in_box_height by remember { mutableStateOf(VIDEO_IN_BOX_HEIGHT_SMALL) }
var video_in_box_small by remember { mutableStateOf(true) }
Expand Down Expand Up @@ -677,7 +679,7 @@ fun App()
val audio_in_sources by remember { mutableStateOf(ArrayList<AVActivity.ffmpegav_descrid>()) }
var video_in_devices by remember { mutableStateOf(ArrayList<String>()) }
val video_in_sources by remember { mutableStateOf(ArrayList<AVActivity.ffmpegav_descrid>()) }
Column(modifier = Modifier.padding(5.dp)) {
Column(modifier = Modifier.padding(5.dp).randomDebugBorder()) {
Text(text = "audio capture: " + avstatestore.state.audio_in_device_get() + " " + avstatestore.state.audio_in_source_get()
, fontSize = 12.sp, modifier = Modifier.fillMaxWidth(),
maxLines = 1)
Expand Down Expand Up @@ -981,28 +983,30 @@ fun App()
}
}
}
val audio_bar_bgcolor = MaterialTheme.colors.background
SwingPanel(
modifier = Modifier.size(200.dp,5.dp),
factory = {
JPanel(SingleComponentAspectRatioKeeperLayout(), true).apply {
add(AudioBar.audio_out_bar)
AudioBar.set_bar_bgcolor(audio_bar_bgcolor.toArgb(), audio_out_bar)
}
},
update = { }
)
Spacer(modifier = Modifier.height(5.dp))
SwingPanel(
modifier = Modifier.size(200.dp,5.dp),
factory = {
JPanel(SingleComponentAspectRatioKeeperLayout(), true).apply {
add(AudioBar.audio_in_bar)
AudioBar.set_bar_bgcolor(audio_bar_bgcolor.toArgb(), audio_in_bar)
}
},
update = { }
)
Column(modifier = Modifier.randomDebugBorder().padding(4.dp)) {
val audio_bar_bgcolor = MaterialTheme.colors.background
SwingPanel(
modifier = Modifier.size(200.dp, 5.dp),
factory = {
JPanel(SingleComponentAspectRatioKeeperLayout(), true).apply {
add(AudioBar.audio_out_bar)
AudioBar.set_bar_bgcolor(audio_bar_bgcolor.toArgb(), audio_out_bar)
}
},
update = { }
)
Spacer(modifier = Modifier.height(5.dp))
SwingPanel(
modifier = Modifier.size(200.dp, 5.dp),
factory = {
JPanel(SingleComponentAspectRatioKeeperLayout(), true).apply {
add(AudioBar.audio_in_bar)
AudioBar.set_bar_bgcolor(audio_bar_bgcolor.toArgb(), audio_in_bar)
}
},
update = { }
)
}
UIScaleItem(
label = i18n("ui.ui_scale"),
description = "${i18n("ui.current_value")}: "
Expand Down Expand Up @@ -1030,7 +1034,7 @@ fun App()
contactstore.visible(true)
groupstore.visible(false)
val focusRequester = remember { FocusRequester() }
Row(modifier = Modifier.fillMaxWidth()) {
Row(modifier = Modifier.fillMaxWidth().randomDebugBorder()) {
val contacts by contactstore.stateFlow.collectAsState()
ContactList(contactList = contacts)
VerticalDivider()
Expand All @@ -1056,7 +1060,7 @@ fun App()
val groupfocusRequester = remember { FocusRequester() }
val groups by groupstore.stateFlow.collectAsState()
val grouppeers by grouppeerstore.stateFlow.collectAsState()
Row(modifier = Modifier.fillMaxWidth()) {
Row(modifier = Modifier.fillMaxWidth().randomDebugBorder()) {
GroupList(groupList = groups)
VerticalDivider()
val groupsettings by groupsettingsstore.stateFlow.collectAsState()
Expand Down Expand Up @@ -1875,7 +1879,7 @@ fun UIScaleItem(
label: String,
description: String,
setting: @Composable (RowScope.() -> Unit),
) = Row(Modifier.fillMaxWidth().height(UISCALE_ITEM_HEIGHT)
) = Row(Modifier.randomDebugBorder().fillMaxWidth().height(UISCALE_ITEM_HEIGHT)
.padding(horizontal = 16.dp).
semantics(mergeDescendants = true) { // it would be nicer to derive the contentDescriptions from the descendants automatically
// which is currently not supported in Compose for Desktop
Expand Down Expand Up @@ -1914,6 +1918,21 @@ fun DragAndDropDescription(modifier: Modifier, color: Color) {
)
}

fun Modifier.randomDebugBorder(): Modifier =
if (DEBUG_COMPOSE_UI_UPDATES)
{
Modifier.padding(3.dp).border(width = 4.dp,
color = Color(
Random().nextInt(0, 255),
Random().nextInt(0, 255),
Random().nextInt(0, 255)),
shape = RectangleShape)
}
else
{
Modifier
}

fun Modifier.dashedBorder(strokeWidth: Dp, color: Color, cornerRadiusDp: Dp) = composed(
factory = {
val density = LocalDensity.current
Expand Down
1 change: 1 addition & 0 deletions src/main/kotlin/com/zoffcc/applications/trifa/MainActivity.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -137,6 +137,7 @@ class MainActivity
// --------- global config ---------
const val CTOXCORE_NATIVE_LOGGING = false // set "false" for release builds
const val AUDIO_PCM_DEBUG_FILES = false // set "false" for release builds
const val DEBUG_COMPOSE_UI_UPDATES = false // set "false" for release builds

// --------- global config ---------
// --------- global config ---------
Expand Down
4 changes: 2 additions & 2 deletions src/main/kotlin/com/zoffcc/applications/trifa2/ChatApp.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -205,7 +205,7 @@ fun ChatApp(focusRequester: FocusRequester, displayTextField: Boolean = true, se
{
Theme {
Surface {
Box(modifier = Modifier.fillMaxSize()) {
Box(modifier = Modifier.fillMaxSize().randomDebugBorder()) {
Image(painterResource("background.jpg"), modifier = Modifier.fillMaxSize(), contentDescription = null, contentScale = ContentScale.Crop)
Column(modifier = Modifier.fillMaxSize()) {
var isDragging by remember { mutableStateOf(false) }
Expand Down Expand Up @@ -309,7 +309,7 @@ fun GroupApp(focusRequester: FocusRequester, displayTextField: Boolean = true, s
{
Theme {
Surface {
Box(modifier = Modifier.fillMaxSize()) {
Box(modifier = Modifier.fillMaxSize().randomDebugBorder()) {
Image(painterResource("background.jpg"), modifier = Modifier.fillMaxSize(),
contentDescription = null, contentScale = ContentScale.Crop)
Column(modifier = Modifier.fillMaxSize()) {
Expand Down
3 changes: 2 additions & 1 deletion src/main/kotlin/org/briarproject/briar/desktop/contact/ContactList.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,14 +25,15 @@ import kotlinx.coroutines.launch
import org.briarproject.briar.desktop.ui.ListItemView
import org.briarproject.briar.desktop.ui.VerticallyScrollableArea
import org.briarproject.briar.desktop.utils.InternationalizationUtils.i18n
import randomDebugBorder

@Composable
fun ContactList(
contactList: StateContacts,
) = Column(
modifier = Modifier.fillMaxHeight().width(CONTACT_COLUMN_WIDTH).background(Color.Transparent),
) {
VerticallyScrollableArea(modifier = Modifier.fillMaxSize()) { scrollState ->
VerticallyScrollableArea(modifier = Modifier.randomDebugBorder().fillMaxSize()) { scrollState ->
LazyColumn(
state = scrollState,
modifier = Modifier
Expand Down
3 changes: 2 additions & 1 deletion src/main/kotlin/org/briarproject/briar/desktop/contact/GroupPeerList.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,7 @@ import grouppeerstore
import org.briarproject.briar.desktop.ui.ListItemView
import org.briarproject.briar.desktop.ui.VerticallyScrollableArea
import org.briarproject.briar.desktop.utils.InternationalizationUtils.i18n
import randomDebugBorder
import kotlin.math.max
import kotlin.math.min

Expand All @@ -29,7 +30,7 @@ fun GroupPeerList(
) = Column(
modifier = Modifier.fillMaxHeight().width(GROUP_PEER_COLUMN_WIDTH).background(Color.Transparent),
) {
VerticallyScrollableArea(modifier = Modifier.fillMaxSize()) { scrollState ->
VerticallyScrollableArea(modifier = Modifier.randomDebugBorder().fillMaxSize()) { scrollState ->
LazyColumn(
state = scrollState,
modifier = Modifier
Expand Down
4 changes: 3 additions & 1 deletion src/main/kotlin/org/briarproject/briar/desktop/navigation/BriarSidebar.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -53,6 +53,7 @@ import org.briarproject.briar.desktop.navigation.SidebarButtonState.UnreadMessag
import org.briarproject.briar.desktop.navigation.SidebarButtonState.Warning
import org.briarproject.briar.desktop.ui.UiMode
import org.briarproject.briar.desktop.utils.InternationalizationUtils.i18n
import randomDebugBorder

val SIDEBAR_WIDTH = 56.dp

Expand Down Expand Up @@ -86,7 +87,8 @@ fun BriarSidebar(
)

Column(
modifier = Modifier.width(SIDEBAR_WIDTH).fillMaxHeight().padding(vertical = 4.dp).selectableGroup(),
modifier = Modifier.randomDebugBorder().width(SIDEBAR_WIDTH)
.fillMaxHeight().padding(vertical = 4.dp).selectableGroup(),
verticalArrangement = spacedBy(4.dp),
horizontalAlignment = Alignment.CenterHorizontally,
) { // profile button
Expand Down

0 comments on commit bfbf3b5

Please sign in to comment.