使 TextField 将其内容包装在 SwiftUI 中 [英] Make TextField wrap it content in SwiftUI
问题描述
我正在尝试实现这样的组件
TextField (5 000) 和 Text (PLN) 一起应该水平居中.输入新数字时,应取消文本 (PLN).我想我必须将这两个视图合并到一个容器中并居中,例如
HStack {文本域()文本(PLN")}.frame(对齐方式:.center)
但是 TextField 占用了所有可能的宽度.
我该如何处理,或者可能有其他解决方案.
这是动态调整大小的 TextField
的可能方法.
注意:helper rectReader
取自
struct DemoCenterTextField:查看{@State 私有变量值 = ""@State 私有 var frame = CGRect.zerovar主体:一些视图{返回 HStack(对齐:.bottom){ZStack {文本(self.value).foregroundColor(Color.clear).fixedSize().background(rectReader($frame))TextField("#.#", 文本:$value).multilineTextAlignment(.trailing).frame(minWidth: 80, IdealWidth: frame.width).fixedSize(水平:真,垂直:假).border(Color.black)//<<仅用于演示}.font(Font.system(size: 40).bold())文本(PLN")}}}
I'm trying to implement such component
TextField (5 000) and Text (PLN) together should be centered horizontally. On entering new digit's, Text (PLN) should be dismissed. I think I have to combine this two views in to one container and center in, something like
HStack {
TextField()
Text("PLN")
}
.frame(alignment: .center)
But TextField is taking all possible width.
How could I handle it, or probably another solution.
Here is possible approach with dynamically sized TextField
.
Note: helper rectReader
is taken from this my post.
Tested with Xcode 11.4 / iOS 13.4 (black border is only for demo)
struct DemoCenterTextField: View {
@State private var value = ""
@State private var frame = CGRect.zero
var body: some View {
return HStack(alignment: .bottom) {
ZStack {
Text(self.value).foregroundColor(Color.clear)
.fixedSize()
.background(rectReader($frame))
TextField("#.#", text: $value)
.multilineTextAlignment(.trailing)
.frame(minWidth: 80, idealWidth: frame.width)
.fixedSize(horizontal: true, vertical: false)
.border(Color.black) // << for demo only
}.font(Font.system(size: 40).bold())
Text("PLN")
}
}
}
这篇关于使 TextField 将其内容包装在 SwiftUI 中的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!