英文:
[SwiftUI]: Not transparency behind TabBar
问题
我刚刚开始学习SwiftUI，我遇到了一个问题：为什么我的TabBar在滚动时不是透明的？
这是我的代码：
var body: some View {
VStack {
ZStack(alignment: .bottomTrailing) {
ScrollViewReader { scroll in
// 在这里添加我的气泡
}
.padding(.bottom, 70)
.scrollDismissesKeyboard(.interactively)
ZStack {
HStack {
TextField("输入你的消息", text: $newMessage)
.padding(9)
.background(
RoundedRectangle(cornerRadius: 19)
.foregroundColor(Color(.systemGray6))
)
}
.padding()
}
}
}
}
谢谢，祝你有一个美好的一天！
英文:
I just started to learn SwiftUI, and I have an issue: why my TabBar isn't transparent when scrolling ?
![[SwiftUI]: TabBar 后面没有透明度](https://i.stack.imgur.com/O7Dd0.png)
Here's my code :
var body: some View {
VStack {
ZStack(alignment: .bottomTrailing) {
ScrollViewReader { scroll in
// my bubbles here
}
.padding(.bottom, 70)
.scrollDismissesKeyboard(.interactively)
ZStack {
HStack {
TextField("Type your message", text: $newMessage)
.padding(9)
.background(
RoundedRectangle(cornerRadius: 19)
.foregroundColor(Color(.systemGray6))
)
}
.padding()
}
}
}
}
Thank you and have a great day !
答案1
得分: 2
要实现半透明的选项卡栏，您需要将文本字段和发送按钮放在ToolbarItem中，如下所示：
var body: some View {
ScrollView {
ForEach(0..<100) { _ in
Capsule().fill(Color.blue)
.frame(height: 50)
.frame(maxWidth: .infinity)
.padding(.horizontal)
}
}
.toolbar {
ToolbarItem(placement: .bottomBar) {
HStack {
TextField("输入您的消息", text: .constant(""))
.textFieldStyle(.roundedBorder)
Button("发送", action: {})
}
}
}
}
这将在工具栏和选项卡栏上都给您模糊的背景效果。
英文:
To have a semi-transparent tab bar you will have to place your text field and send button in a ToolbarItem like so:
var body: some View {
ScrollView {
ForEach(0..<100) {_ in
Capsule().fill(Color.blue)
.frame(height: 50)
.frame(maxWidth: .infinity)
.padding(.horizontal)
}
}
.toolbar {
ToolbarItem(placement: .bottomBar) {
HStack {
TextField("Type your message", text: .constant(""))
.textFieldStyle(.roundedBorder)
Button("Send", action: {})
}
}
}
}
Which gives you the blurry background both on tool bar and tab bar:
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论