Create a SwiftUI user interface through a JSON file. The JSON file will contain the structure of the user interface, and the program will create the user interface based on the JSON file.
Warning
This is a work in progress and not yet ready for production use.
Please feel free to contribute, report issues, or request features.
- Swift 5.9+ (Xcode 15+)
- iOS 15+, macOS 12+, tvOS 14+, watchOS 7+, macCatalyst 15+, visionOS 1.0+
Install using Swift Package Manager
dependencies: [
.package(url: "https://github.com/0xWDG/DynamicUI.git", .branch("main")),
],
targets: [
.target(name: "MyTarget", dependencies: [
.product(name: "DynamicUI", package: "DynamicUI"),
]),
]And import it:
import DynamicUIimport SwiftUI
import DynamicUI
struct ContentView: View {
let json = """
[
{
"type": "Text",
"title": "Wait, am i generating views from JSON?",
"modifiers": {"foregroundStyle":"red","opacity":0.6}
},
{
"type": "Button",
"title": "Click me",
"eventHandler": "customHandler"
},
{
"type": "Toggle",
"title": "Toggle me",
"identifier": "my.toggle.1"
}
]
""".data(using: .utf8)
var body: some View {
DynamicUI(
json: json,
callback: { component in
// This contains everything passed as a component (type, title, identifier, ...)
print(component)
}
)
}
}In the directory Playground is a Xcode project to build the Playground Application
Please note: Items prefixed with ⚠ may ignore passed parameters.
Items with a strikethrough are not yet supported.
VStack
{
"type": "VStack",
"children": [ ]
}HStack
{
"type": "HStack",
"children": [ ]
}ZStack
{
"type": "ZStack",
"children": [ ]
}List
{
"type": "List",
"children": [ ]
}ScrollView
{
"type": "ScrollView",
"children": [ ]
}NavigationView
{
"type": "NavigationView",
"children": [ ]
}Form
{
"type": "Form",
"children": [ ]
}Button
{
"type": "Button",
"title": "Click me!"
}Text
{
"type": "Text",
"title": "..."
}Image
{
"type": "Image",
"imageURL": "systemName"
}Divider
{
"type": "Divider"
}Spacer
{
"type": "Spacer"
}Label
{
"type": "Label",
"title": "..."
}TextField
{
"type": "TextField",
"title": "...",
"defaultValue": "..."
}SecureField
{
"type": "SecureField",
"title": "...",
"defaultValue": "..."
}TextEditor
{
"type": "TextEditor",
"title": "...",
"defaultValue": "..."
}Toggle
{
"type": "Toggle",
"title": "Turn me on!",
"defaultValue": true
}⚠ Gauge
{
"type": "Gauge",
"title": "...",
"defaultValue": 0.5
}⚠ ProgressView
{
"type": "ProgressView",
"title": "...",
"value": 50,
"total": 100
}Slider
{
"type": "Slider",
"title": "...",
"minLabel": "min",
"maxLabel": "max"
}GroupBox
{
"type": "GroupBox",
"children": [ ]
}DisclosureGroup
{
"type": "DisclosureGroup",
"children": [ ]
}HSplitView
{
"type": "HSplitView",
"children": [ ]
}VSplitView
{
"type": "VSplitView",
"children": [ ]
}⚠ Picker
{
"type": "Picker",
"title": "...",
"values": ["...", "..."]
}⚠ NavigationSplitView
{
"type": "NavigationSplitView",
"children": [ ]
}⚠ TabView
{
"type": "TabView",
"children": [ ]
}
- Aurora Editor for custom views in extensions.
We can get in touch via Twitter/X, Discord, Mastodon, Email, Website.