Skip to content

Instantly share code, notes, and snippets.

@steipete
Last active August 4, 2021 18:26
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save steipete/8bfa13ce80a105e19ea1996705b39f24 to your computer and use it in GitHub Desktop.
Save steipete/8bfa13ce80a105e19ea1996705b39f24 to your computer and use it in GitHub Desktop.
//: A Cocoa based Playground to present user interface
import SwiftUI
import PlaygroundSupport
struct ContentView: View {
var body: some View {
HStack {
VStack {
HStack {
Spacer()
Text("Highlight :")
.background(Color.green)
}
Spacer()
}
.frame(minWidth: 0, maxWidth: .infinity, minHeight: 0, maxHeight: .infinity)
.background(Color.yellow)
VStack {
HStack {
VStack(alignment: .leading) {
Text("Checkbox 111")
Text("Checkbox 2")
}
.background(Color.blue)
Spacer()
}
Spacer()
}
.frame(minWidth: 0, maxWidth: .infinity, minHeight: 0, maxHeight: .infinity)
.background(Color.red)
}
.frame(width: 400, height: 200)
}
}
PlaygroundPage.current.setLiveView(ContentView())
@kean
Copy link

kean commented Feb 20, 2021

struct ContentView: View {
    var body: some View {
        HStack {
            Text("Highlight :")
                .background(Color.green)
                .frame(minWidth: 0, maxWidth: .infinity, minHeight: 0, maxHeight: .infinity, alignment: .topTrailing)
                .background(Color.yellow)

            VStack {
                Text("Checkbox 111")
                Text("Checkbox 2")
            }
            .background(Color.blue)
            .frame(minWidth: 0, maxWidth: .infinity, minHeight: 0, maxHeight: .infinity, alignment: .topLeading)
            .background(Color.red)
        }
        .frame(width: 400, height: 200)
    }
}

@kean
Copy link

kean commented Feb 20, 2021

Adjusted for "stack three of these instead of putting them in a large frame; background color is not really needed" goal

struct ContentView: View {
    var body: some View {
        VStack {
            SettingsPanel()
            SettingsPanel()
        }

//        .frame(width: 400, height: 200)
    }
}

struct SettingsPanel: View {
    var body: some View {
        HStack(alignment: .firstTextBaseline) {
            Text("Highlight :")
                .background(Color.green)
                .frame(minWidth: 0, maxWidth: .infinity, minHeight: 0, alignment: .topTrailing)

            VStack(alignment: .leading) {
                Text("Checkbox 111")
                Text("Checkbox 2")
            }
            .background(Color.blue)
            .frame(minWidth: 0, maxWidth: .infinity, minHeight: 0, alignment: .topLeading)
        }
    }
}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment