Implementing imports in VML would allow large projects to split up their UI into multiple files and reuse components.
The regular V syntax could be re-used for consistency, e.g. below:
main.vml
import PrimaryScreen
Screen {
id: root
background: #F1F5F9
Label { text: "Screen manager" x: 20 y: 14 width: root.width - 40 height: 30 color: #0F172A font_size: 20 bold: true }
ScreenManager {
id: navigation
x: 20
y: 56
width: root.width - 40
height: 240
current: app.current
background: #FFFFFF
corner_radius: 10
PrimaryScreen {}
}
}
primary_screen.vml
module PrimaryScreen
Screen {
id: home
Label { text: "Home" x: 24 y: 26 width: 240 height: 34 color: #0F172A font_size: 24 bold: true }
Label { text: "Only this screen is mounted." x: 24 y: 68 width: 300 height: 24 color: #64748B }
Button { text: "Open details" on_tap: app.show("details") x: 24 y: 116 width: 140 height: 38 background: #2563EB color: #FFFFFF corner_radius: 8 }
}
Though module may not be the most appropriate name for UI elements, input welcome.
Implementing imports in VML would allow large projects to split up their UI into multiple files and reuse components.
The regular V syntax could be re-used for consistency, e.g. below:
main.vmlprimary_screen.vmlThough
modulemay not be the most appropriate name for UI elements, input welcome.