Skip to content

Commit a8f0c3e

Browse files
Ebaron96Ebaron96
committed
Starting to work on drop downs.
1 parent d2b40e7 commit a8f0c3e

2 files changed

Lines changed: 109 additions & 46 deletions

File tree

‎app/src/processing/app/ui/ComposeTopBar.kt‎

Lines changed: 107 additions & 45 deletions
Original file line numberDiff line numberDiff line change
@@ -3,19 +3,23 @@ package processing.app.ui
33

44
import androidx.compose.foundation.background
55
import androidx.compose.foundation.clickable
6+
import androidx.compose.foundation.layout.Arrangement
67
import androidx.compose.foundation.layout.Box
78
import androidx.compose.foundation.layout.Row
89
import androidx.compose.foundation.layout.fillMaxWidth
910
import androidx.compose.foundation.layout.padding
11+
import androidx.compose.foundation.layout.heightIn
1012
import androidx.compose.material.Text
1113
import androidx.compose.runtime.Composable
1214
import androidx.compose.runtime.mutableStateOf
1315
import androidx.compose.runtime.remember
16+
import androidx.compose.ui.Alignment
1417
import androidx.compose.ui.Modifier
1518
import androidx.compose.ui.awt.ComposePanel
1619
import androidx.compose.ui.graphics.Color
1720
import androidx.compose.ui.layout.onGloballyPositioned
1821
import androidx.compose.ui.layout.positionInRoot
22+
import androidx.compose.ui.text.style.TextAlign
1923
import androidx.compose.ui.unit.IntOffset
2024
import androidx.compose.ui.unit.dp
2125
import processing.app.Base
@@ -34,64 +38,96 @@ fun themeColorOrFallback(key: String, fallback: AwtColor): Color {
3438
return awtToCompose(awt)
3539
}
3640

41+
data class TopBarItemData(
42+
val label: String,
43+
val onClick: (ComposePanel, Base, Int, Int) -> Unit
44+
)
45+
3746
@Composable
3847
fun TopBar(panel: ComposePanel, base: Base) {
3948
val blueBarColor = themeColorOrFallback("toolbar.gradient.top", AwtColor(107, 160, 204))
4049
val textColor = themeColorOrFallback("toolbar.rollover.color", AwtColor(0, 0, 0))
4150

42-
val developAnchor = remember { mutableStateOf(IntOffset.Zero) }
43-
val developHeight = remember { mutableStateOf(0) }
51+
val items = listOf(
52+
TopBarItemData("File") { p, b, x, y ->
53+
showMenuPopup(p, b, x, y)
54+
},
55+
TopBarItemData("Edit") { p, b, x, y ->
56+
showMenuPopup(p, b, x, y)
57+
},
58+
TopBarItemData("Sketch") { p, b, x, y ->
59+
showMenuPopup(p, b, x, y)
60+
},
61+
TopBarItemData("Debug") { p, b, x, y ->
62+
showMenuPopup(p, b, x, y)
63+
},
64+
TopBarItemData("Tools") { p, b, x, y ->
65+
showMenuPopup(p, b, x, y)
66+
},
67+
TopBarItemData("Help") { p, b, x, y ->
68+
showMenuPopup(p, b, x, y)
69+
},
70+
TopBarItemData("Develop") { p, b, x, y ->
71+
showDevelopPopup(p, b, x, y)
72+
}
73+
)
4474

4575
Row(
4676
modifier = Modifier
4777
.fillMaxWidth()
48-
.background(blueBarColor)
49-
.padding(start = 8.dp)
78+
.background(blueBarColor),
79+
horizontalArrangement = Arrangement.SpaceEvenly,
80+
verticalAlignment = Alignment.CenterVertically
5081
) {
51-
Box(
52-
modifier = Modifier.onGloballyPositioned { coordinates ->
53-
val position = coordinates.positionInRoot()
54-
developAnchor.value = IntOffset(
55-
position.x.toInt(),
56-
position.y.toInt()
57-
)
58-
developHeight.value = coordinates.size.height
82+
items.forEach { item ->
83+
TopBarItem(
84+
label = item.label,
85+
textColor = textColor,
86+
modifier = Modifier.weight(1f)
87+
) { x, y ->
88+
item.onClick(panel, base, x, y)
5989
}
60-
61-
) {
62-
Text(
63-
text = "Develop",
64-
color = textColor,
65-
modifier = Modifier
66-
.padding(horizontal = 8.dp, vertical = 4.dp)
67-
.clickable {
68-
showDevelopPopup(
69-
panel = panel,
70-
base = base,
71-
x = developAnchor.value.x,
72-
y = developAnchor.value.y + developHeight.value
73-
)
74-
}
75-
)
76-
Text (
77-
text = "New Button",
78-
color = textColor,
79-
modifier = Modifier
80-
81-
.padding(horizontal = 40.dp, vertical = 4.dp)
82-
.clickable {
83-
showDevelopPopup(
84-
panel = panel,
85-
base = base,
86-
x = developAnchor.value.x,
87-
y = developAnchor.value.y + developHeight.value
88-
)
89-
}
90-
)
9190
}
9291
}
9392
}
9493

94+
@Composable
95+
private fun TopBarItem(
96+
label: String,
97+
textColor: Color,
98+
modifier: Modifier = Modifier,
99+
onClick: (x: Int, y: Int) -> Unit
100+
) {
101+
val anchor = remember { mutableStateOf(IntOffset.Zero) } //stores the location of the top bar item
102+
val height = remember { mutableStateOf(0) } //stores the height of the top bar item
103+
104+
Box(
105+
modifier = modifier
106+
.heightIn(min = 32.dp)
107+
.onGloballyPositioned { coordinates ->
108+
val position = coordinates.positionInRoot() //top left corner of drop down
109+
anchor.value = IntOffset(position.x.toInt(), position.y.toInt()) //x and y positioning
110+
height.value = coordinates.size.height //height of the menu
111+
}
112+
.clickable {
113+
onClick(anchor.value.x, anchor.value.y + height.value)
114+
//anchor x lines up menu with top left edge of the clicked menu
115+
//anchor y + height value moves the pop up below the tool bar item
116+
}
117+
.padding(vertical = 4.dp),
118+
contentAlignment = Alignment.Center
119+
) {
120+
Text(
121+
text = label,
122+
color = textColor,
123+
textAlign = TextAlign.Center,
124+
modifier = Modifier
125+
.fillMaxWidth()
126+
.padding(horizontal = 0.dp, vertical = 4.dp)
127+
)
128+
}
129+
}
130+
95131
private fun showDevelopPopup(panel: ComposePanel, base: Base, x: Int, y: Int) {
96132
val popup = JPopupMenu()
97133

@@ -103,14 +139,40 @@ private fun showDevelopPopup(panel: ComposePanel, base: Base, x: Int, y: Int) {
103139
}
104140

105141
popup.add(updatesItem)
106-
popup.show(panel, x, y) //this is ignoring the os differences
142+
popup.show(panel, x, y)
143+
}
144+
145+
private fun showMenuPopup(panel: ComposePanel, base: Base, x: Int, y: Int) {
146+
val popup = JPopupMenu()
147+
148+
val fileNew = JMenuItem("New")
149+
fileNew.addActionListener {
150+
base.handleNew()
151+
}
152+
popup.add(fileNew);
153+
154+
val fileOpen = JMenuItem("Open")
155+
fileOpen.addActionListener {
156+
base.handleOpenPrompt();
157+
}
158+
159+
popup.add(fileOpen);
160+
161+
162+
163+
164+
popup.show(panel, x, y)
107165
}
108166

167+
168+
109169
fun mountTopBar(panel: ComposePanel, base: Base) {
110170
val awtBg = Theme.getColor("toolbar.gradient.top") ?: AwtColor(107, 160, 204)
111171
panel.background = awtBg
112172

113173
panel.setContent {
114174
TopBar(panel, base)
115175
}
116-
}
176+
}
177+
178+

‎app/src/processing/app/ui/Editor.java‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -234,8 +234,9 @@ public void windowDeactivated(WindowEvent e) {
234234

235235

236236
toolbar = createToolbar();
237-
// upper.add(toolbar);
238237
upper.add(composeTopBar);
238+
upper.add(toolbar);
239+
239240

240241
header = createHeader();
241242
upper.add(header);

0 commit comments

Comments
 (0)