I have a problem with the tappable area in a SwiftUI list row: it doesn’t cover the entire row.
Here is my code:
Section(header: Text("Latest Transit News").bold(), content: {
HStack(alignment: .center) {
Image("Twitter")
.resizable()
.renderingMode(.template)
.frame(width: 18.33, height: 15.14)
.foregroundColor(Color("TwitterBlue"))
VStack(alignment: .leading) {
Text("SBS Transit")
Text("@SBSTransit_Ltd").font(.caption).foregroundColor(.secondary)
}
Spacer()
}.onTapGesture {
UIApplication
.shared
.open(SupportURL.sbs.url,
options: [UIApplication.OpenExternalURLOptionsKey.universalLinksOnly : false], completionHandler: nil)
}
This produces the expected row:

The only tappable area in the entire row is enclosed in the red box: the Image
and Text
. My expectation is that the entire HStack
should be tappable.
Am I doing something wrong or is there a solution? Please let me know.