Post

Replies

Boosts

Views

Activity

tvOS 14 SwiftUI custom button style breaks scrolling back
I am trying to implement LazyHGrid on tvOS 14 with a pinned header. If I use standard buttons as grid items, the items scroll properly by changing its focus. However if I use my own custom style for the buttons, the first item is hidden behind the pinned header. Here's a repro code: struct ContentView: View { 		var rows: [GridItem] = [GridItem(.fixed(113))] 		@State private var selected : Bool = false 		@State private var isFocused : Bool = false 		 		var body: some View { 				VStack (alignment: .leading, spacing: 0) { 						ScrollView([.horizontal]) { 								LazyHGrid (rows: rows, alignment: .top, spacing: 10, pinnedViews: .sectionHeaders, content: { 										Section(header: HeaderView(title: "NBC").border(Color.white)){ 												ForEach((0...20), id: \.self) { 														let codepoint = $0 + 0x1f600 														let codepointString = String(format: "%02X", codepoint) 																Button(action: { print("selected")}) { 																		CellView(title: "\(codepointString)") 																} // Comment out this line - it will start working properly 																.buttonStyle(MyCustomButton()) 												} 										} 						 }) 					 } 				} 		} } struct HeaderView: View { 		@State var title : String 		 		var body: some View { 				VStack { 						Text(title).frame(width: 160) 				} 				.frame(maxWidth: .infinity, alignment: .topLeading) 				.frame(height: 113) 				.background(Color.blue) 		} } struct CellView : View { 		@Environment(\.isFocused) var isFocused: Bool 		@State var title : String 		 		var body: some View { 				VStack{ 						Text(title).font(.headline) 						Text("Very intersting movie") 				}.padding() 				.background(isFocused ? Color.gray : Color.red) 		} } struct MyCustomButton: ButtonStyle { 		func makeBody(configuration: Self.Configuration) -> some View { 				configuration.label 						.frame(minWidth: 0, maxWidth: 300) 						.foregroundColor(.white) 						.background(configuration.isPressed ? Color.red : Color.green) 						 		} }
1
0
2.1k
Jul ’21