Comments (11)
It looks like you just need to include tabItems for the items in your tabs, like:
// …
let lh = LayoutHolder(.vertical)
// …
Split(primary: { Color.red }, secondary: {
TabView {
Color.green
.tabItem {
Label("Green", systemImage: "hand.thumbsup")
}
Color.yellow
.tabItem {
Label("Yellow", systemImage: "hand.thumbsdown")
}
}
})
.layout(lh)
Button("bug") { withAnimation { lh.toggle() } }
Button("ok") { lh.toggle() }
// …
I am running this on Sonoma with the latest version 3.2.2, so maybe something was fixed between what you are running and what I just released. In any case, when I paste your code into a fresh view, it works for me even without tabItems. At least I cannot see the image you included above where the splitter is at the wrong orientation. I see:
or
from splitview.
Tnx, Steven!
I am on Ventura 13.6 and the bug is still here, even with .tabItem().
Let's hope for Sonoma :)
from splitview.
It's very odd! I don't have a Ventura machine easily accessible, but I tried it on my old MacBook running Big Sur, and it also shows no issue.
The only time I have seen something looking like this has been when I messed something up in a custom splitter. The default Splitter gets its layout from the Environment, established in Split, so it should not be possible for it to get out-of-sync with the Split view like this shows. It looks visually like that is what happened here - that Splitter's value for layout
is different than the value Split has.
Just to be sure we are testing the exact same thing in the same way, you could paste your code into the DemoApp so it replaces the .simpleDefaults
case as follows:
case .simpleDefaults:
let lh = LayoutHolder(.vertical)
Split(primary: { Color.red }, secondary: { TabView { Color.green } })
.layout(lh)
Button("bug") { withAnimation { lh.toggle() } }
Button("ok") { lh.toggle() }
If running the demo with this pasted-in shows the same problem for you, then I'm willing to blame it on a weird Ventura SwiftUI bug (that I'm not working around 😜).
from splitview.
at start
first click
second click
first click + a lil resize of window - it's autofixed.
P.S. w/o TabView - no problems at all.
from splitview.
Can you try it using DemoSplitter? It will look ugly, but if the layouts match between DemoSplitter and Split, then it will tell us if I might be able to fix it by using ObservedObject instead of Environment. Like this:
case .simpleDefaults:
let lh = LayoutHolder(.vertical)
Split(primary: { Color.red }, secondary: { TabView { Color.green } })
.splitter { DemoSplitter(layout: lh, hide: SideHolder()) }
.layout(lh)
Button("bug") { withAnimation { lh.toggle() } }
Button("ok") { lh.toggle() }
from splitview.
at start
1st click
2nd click
so it works like w/o custom .splitter
BUT!!! with a 50% chance everything works correctly!
in 10 apps run – 5/5 bugged and ok.
from splitview.
I didn't realize it would be so confusing. The DemoSplitter is clear, so the triangle direction in the button is indicating the layout for the DemoSplitter. It's showing the same behavior as the Splitter, which is:
- At start: DemoSplitter layout = .vertical, Split layout = .vertical
- 1st click: DemoSplitter layout = .horizontal, Split layout = .vertical
- 2nd click: DemoSplitter layout = .vertical, Split layout = .horizontal
I was thinking the Splitter was in the wrong orientation, but it's the Split view that's layed out wrong.
I would debug this myself if I could reproduce it. I don't know how much time you want to spend on it in this way. If you're up for more, here are some more things to try:
- Hold the LayoutHolder in a StateObject. So in DemoApp, it would look like:
struct DemoApp: View {
@State private var demoID: DemoID = .simpleDefaults
@StateObject private var lh = LayoutHolder(.vertical)
var body: some View {
let demo = demos[demoID]!
VStack {
DemoToolbar(demoID: $demoID)
switch demoID {
case .simpleDefaults:
Split(primary: { Color.red }, secondary: { TabView { Color.green } })
.layout(lh)
Button("bug") { withAnimation { lh.toggle() } }
...
- Use a VStack instead of the TabView to see if it has the same problems:
struct DemoApp: View {
@State private var demoID: DemoID = .simpleDefaults
@StateObject private var lh = LayoutHolder(.vertical)
var body: some View {
let demo = demos[demoID]!
VStack {
DemoToolbar(demoID: $demoID)
switch demoID {
case .simpleDefaults:
Split(primary: { Color.red }, secondary: {
VStack {
Button(lh.isHorizontal ? "Horizontal": "Vertical") {}
Color.green
}
})
.layout(lh)
Button("bug") { withAnimation { lh.toggle() } }
...
from splitview.
-
still bugged
no problems with VStack + Button.
- VStack + TabView = bugged
P.S. btw, IMO, using an @EnvironmentObject is incorrect anyway, since it only stores them of one type, which will create problems if the splitter is used in further views.
P.P.S. let's wait for Sonoma, mb problems are related to xcode 15 on Ventura…
from splitview.
Agreed on Environment. Looking at this problem, I thought: why did I do that!? I think it was something I did when I was sorting out some other problem and never reverted 🤷♂️. Thanks for spending so much time debugging. Let's see if it changes with Sonoma.
from splitview.
No bugs on Sonoma :)
from splitview.
Great!!! Thanks again for spending so much time looking into it.
from splitview.
Related Issues (20)
- Issue When Dragging a Splitter Outside the Parent Window on MacOS HOT 4
- Instantiating from a simpler format? HOT 1
- Change cursor on Mac when inside splitter HOT 4
- UserDefaults - working ? HOT 6
- Set SplitView Constraints Maximum HOT 1
- Set SplitView Constraints by absolute number HOT 1
- Nested views ad infinitum HOT 3
- Sticky buttons in secondary views or on press repeat HOT 4
- Feature: minimum split size HOT 8
- Bug: splitter line should be invisible when hidden HOT 2
- Option to offset views instead of changing frame size HOT 5
- Breakpoints & animations HOT 1
- Hidden view still visible partly HOT 4
- Custom splitter using drag-to-hide
- Setting fraction programmatically (after the split view is shown already) HOT 2
- CustomSplitter disappears when constraints is set HOT 4
- Bug when hiding splitview while using minimum fractions HOT 3
- Default splitter HOT 2
- Fraction animation HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from splitview.