Karin Prater gahntpo
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| import SwiftUI | |
| struct ContentView: View { | |
| var body: some View { | |
| Text("Hello World") | |
| } | |
| } |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| import SwiftUI | |
| struct StackExample: View { | |
| var body: some View { | |
| VStack { | |
| Text("first item") | |
| Text("second item") | |
| Text("third item") | |
| } | |
| } |
gahntpo
/ StackAlignment.swift
Created
June 19, 2020 14:53
using VStack and HStack with different alignment
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| VStack(alignment: .leading, spacing: 10) { | |
| Text("first item").background(Color.orange) | |
| Text("second item").background(Color.red) | |
| Text("third item").background(Color.gray) | |
| } | |
| HStack(alignment: .leading, spacing: 10) { | |
| Text("first item") | |
| .frame(height: 60) | |
| .background(Color.orange) |
gahntpo
/ ZStackExample.swift
Created
June 19, 2020 15:14
showing ZStack with default alignment behav
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| ZStack(alignment: .center) { | |
| Text("first item") | |
| .frame(width: 150, height: 100) | |
| .background(Color.orange) | |
| Text("second item") | |
| .frame(width: 120, height: 70) | |
| .background(Color.red) | |
| Text("third item") | |
| .frame(width: 80, height: 40) | |
| .background(Color.gray) |
gahntpo
/ ZStackExample.swift
Created
June 19, 2020 15:14
showing ZStack with default alignment behavior
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| ZStack(alignment: .center) { | |
| Text("first item") | |
| .frame(width: 150, height: 100) | |
| .background(Color.orange) | |
| Text("second item") | |
| .frame(width: 120, height: 70) | |
| .background(Color.red) | |
| Text("third item") | |
| .frame(width: 80, height: 40) | |
| .background(Color.gray) |
gahntpo
/ AbsoluteFrameView.swift
Created
June 19, 2020 15:30
using absolute values to set the size of a view
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Text("no frame - this is a long line that won't fit parent's size.") | |
| .border(Color.green) | |
| Text("with absolute frame - this is a long line that only has a width of 200 avaliable.") | |
| .frame(width: 200, height: 100) | |
| .border(Color.green) | |
| Text("with fixedSize - this is a long line that won't fit parent's size.") | |
| .fixedSize() | |
| .border(Color.blue) |
gahntpo
/ FlexibleFrameView
Created
June 19, 2020 15:37
using flexible frames to layout depending on available space
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| HStack { | |
| Text("using maxWidth 300") | |
| .frame(minWidth: 100, idealWidth: 200, maxWidth: 300).border(Color.red) | |
| Text("taking space") | |
| } | |
| HStack { | |
| Text("using maxWidth 200") | |
| .frame(minWidth: 100, idealWidth: 150, maxWidth: 200).border(Color.red) | |
| Text("taking space") | |
| } |
gahntpo
/ FrameAlignmentTest.swift
Created
June 19, 2020 15:43
specifying the alignment position inside the frame
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| HStack { | |
| Text("alignment: \n .leading") | |
| .background(Color.orange) | |
| .frame(width: 110, height: 100, alignment: .leading) | |
| .border(Color.red) | |
| Text("alignment: \n .center") | |
| .background(Color.orange) | |
| .frame(width: 110, height: 100, alignment: .center) | |
| .border(Color.red) | |
| Text("alignment: \n .trailing") |
gahntpo
/ PositionExamples.swift
Created
June 20, 2020 07:19
positioning a view inside a given frame with .position() and .offset()
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| ZStack { | |
| Rectangle() | |
| .fill(Color.green) | |
| .position(x: 100, y: 100) | |
| .frame(width: size, height: size) | |
| .border(Color.green) | |
| Rectangle() | |
| .fill(Color.red) | |
| .offset(CGSize(width: 100, height: 100)) |
gahntpo
/ GeometryTestView.swift
Created
June 20, 2020 08:18
GeometryReader in SwiftUI will give you the size at is available to layout the view
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| import SwiftUI | |
| struct GeometryTestView: View { | |
| var body: some View { | |
| GeometryReader { geometry in | |
| VStack { | |
| Text("view width: \(geometry.size.width)") | |
| Text("view height: \(geometry.size.height)") | |
| HStack(spacing: 0) { | |
| Rectangle() |
OlderNewer