MacOS向けのAppを制作しています。
SliderをFormの中で使うとラベル部分と、スライダー部分で横に2分割されてしまいます。
下の写真が問題の現象。

結局解決策がわからず、Formを使うことを諦め、以下のようになんちゃってFormをVstackで作ることにしました。
結果的に以下のようにSliderを幅いっぱいに表示することができるようになりました。

いかになんちゃってFormのセクションの役割をするVStackを貼っておきます。
struct CustomVStack<Content: View>: View {
let content: Content
init(@ViewBuilder content: () -> Content) {
self.content = content()
}
var body: some View {
VStack(alignment: .leading, content: {
content
})
.padding(.vertical, 12)
.padding(.horizontal, 8)
.frame(maxWidth: .infinity)
.overlay(
RoundedRectangle(cornerRadius: 4)
.stroke(Color.gray, lineWidth: 0.5)
)
}
}
使用するときは以下のように別Viewから呼び出してあげればOKです。
CustomVStack {
TextField("Text", text: $inputText)
.font(.body)
SizeSlider(textSize: $textSize)
ColorPicker("Color", selection: $textColor)
}
CustomVStack {
FolderColorPicker(folderColor: $folderColor)
}
coiai
この記事もおすすめ
株式会社coiaiは、「想像できることを美しく実現」を掲げ、XR・Web・アプリ・システム開発およびDX支援を行う会社です。 創業2022年、東京都練馬区に本社を置き、要件のヒアリングからPoC(概念実証)、本番運用まで一貫して伴走します。 まずはお気軽にご相談ください。
主なご相談内容
詳しい会社情報は会社概要ページでご覧いただけます。