For questions about how to lay out Swift UI elements on screen as intended. When using this tag also include the more generic [swiftui] tag where possible.
Questions tagged [swiftui-layout]
39 questions
1
vote
1 answer
Why does adding a frame() to an image add padding in between the image and it's sibling?
Why does adding a frame() to an image add padding in between the image and it's sibling? E.g. why is there padding underneath the A, but not the B, in this example? Thank you!
struct ContentView: View {
var body: some View {
VStack {
…
John Cashew
- 1,078
- 2
- 12
- 28
1
vote
0 answers
The layout breaks when ignoring the bottom edge of the safe area in SwiftUI
I'm currently working on an app for watchOS, but this problem is the same on iOS.
When I use ignoring the bottom edge of the safe area for a view that is slightly larger than the safe area, the layout breaks, as if ignoring the bottom edge of the…
Nikaaner
- 1,022
- 16
- 19
1
vote
1 answer
Does a LazyVStack remain "lazy" if it's inside a VStack?
Let's consider a list of 100 posts. According to Apple, if I layout them inside a LazyVStack:
the stack view doesn’t create items until it needs to render them
onscreen.
What if I embed that LazyVStack inside a VStack? Does it still load the views…
Sotiris Kaniras
- 520
- 1
- 12
- 30
1
vote
1 answer
Adding Fixed/Scrollable Space Between Two Icons
I am looking to create a SwiftUI layout that has one icon to the far left, two icons to the far right, and a fixed-width scrollable area for any number of icons in between:
The issue I'm running into is that the scrollable area overlaps the icons…
dohpaz42
- 520
- 4
- 18
1
vote
2 answers
Multiple Layouts in SwiftUI ScrollView overlap
I've implemented a left aligned flow layout using the new iOS 16 Layout protocol, and I'm using it to add two lists of items to a ScrollView as follows:
let people = ["Albert", "Bernard", "Clarence", "Desmond", "Ethelbert", "Frederick", "Graeme",…
Ashley Mills
- 50,474
- 16
- 129
- 160
1
vote
1 answer
SwiftUI: Centering a subview of a VStack in the main view
I want to center a TextField, which is in a VStack, to the center of the main view / screen. I tried everything I could think of. But no matter what I do SwiftUI is centering the whole VStack and not the one TextField to the center.
Maybe one of you…
Nick Sorge
- 21
- 2
1
vote
0 answers
How to get the current element in the screen to programmatically scroll from buttons without getting broken by the ScrollViewReader Index
I've been working on a GridView with programmatical scroll support, I've been using ScrollViewReader to programmatically scroll to the top & bottom of the GridView, but I have a trouble, I added two extra buttons to scroll 3 elements per touch, and…
Hirose Maverick
- 11
- 1
1
vote
1 answer
How to eliminate spacing around LazyHGrid items?
I've set the spacing on the LazyHGrid and the GridItems to 0, yet there is still spacing in the vertical direction. Why is that? How do I eliminate that spacing?
struct ContentView: View {
let strs: [String] = ["aa", "", "bbbb"]
let…
Rob N
- 15,024
- 17
- 92
- 165
1
vote
0 answers
Best way to create a table with named columns in the first row in SwiftUI
I was looking for some built in functionality in SwiftUI for building a table with named columns in iOS. There appears to be a Table Function but it only works for macOS. Would the best way be to use a LazyVGrid, build the table up manually with…
Petesta
- 1,623
- 3
- 19
- 29
1
vote
1 answer
SwiftUI place around center object
Say the blue rectangle is in the center of the red rectangle, and the green needed to be on top and the yellow on the left.
How would one do this in SwiftUI with alignment guides? None of the sizes are known, but the yellow and blue height match,…
magnuskahr
- 1,137
- 9
- 17
1
vote
1 answer
SwifUI LandScape NavigationTopBar won't hide
I wanted only one landscape View between all Views so I added code bellow to the AppDelegate
func application(_ application: UIApplication, supportedInterfaceOrientationsFor window:
UIWindow?) -> UIInterfaceOrientationMask {
return…
Azhman Adam
- 43
- 6
1
vote
1 answer
SwiftUI: Prevent view being inside VStack to expand
I have such VStack with list inside it
VStack(alignment: .leading, spacing: 16) {
Text("Contacts")
.font(.custom("AvenirNext-DemiBold", size: 20))
…
Michał Ziobro
- 10,759
- 11
- 88
- 143
0
votes
0 answers
SwiftUI layout issue for embedded TabView in NavigationView on watchOS
I have noticed a very strange issue when using two embedded TabView in a navigation view.
My code sample show a TabView (page mode) imbedded in a NavigationView.
One of the tabs (tag 2) is also a TabView (verticalPage mode).
When I first display…
Raphaël Barthomeuf
- 365
- 1
- 2
- 9
0
votes
1 answer
How does .position modifier change layout of parent Stack in SwiftUI?
I'm curious, does anyone understand what .position(x:y:) is doing to the layout process for a containing ZStack? I've looked at Apple's documentation on "Making fine adjustments to a view’s position" and it doesn't mention anything about this.
See…
Curious Jorge
- 354
- 1
- 9
0
votes
0 answers
swiftui zstack are not fully centered
My code is as bellow:
struct Clock10View: View {
let light: Bool
var body: some View {
ZStack() {
Rectangle()
.frame(width: 6, height: 6)
.foregroundColor(.gray)
Rectangle()
…
mars
- 109
- 5
- 21