On my view, I’ve a picture that I at all times with to show and a few textual content beneath it which ought to be vertically scrollable. This textual content might be brief or lengthy.
If the textual content is brief, I want to have picture and textual content centered on the display, but when the textual content is lengthy, picture might be pushed to the highest, so textual content can get extra room.
That is my code beneath with which I’m noticing that even for smaller textual content, scroll view pushes all the weather to the highest of the display.
struct ContentView: View {
let longText: String = "Lorem Ipsum is just dummy textual content of the printing and typesetting trade. Lorem Ipsum has been the trade's normal dummy textual content ever for the reason that 1500s, when an unknown printer took a galley of sort and scrambled it to make a kind specimen e book. It has survived not solely 5 centuries, but in addition the leap into digital typesetting, remaining primarily unchanged. It was popularised within the Nineteen Sixties with the discharge of Letraset sheets containing Lorem Ipsum passages, and extra lately with desktop publishing software program like Aldus PageMaker together with variations of Lorem Ipsum. Lorem Ipsum is just dummy textual content of the printing and typesetting trade. Lorem Ipsum has been the trade's normal dummy textual content ever for the reason that 1500s, when an unknown printer took a galley of sort and scrambled it to make a kind specimen e book. It has survived not solely 5 centuries, but in addition the leap into digital typesetting, remaining primarily unchanged. It was popularised within the Nineteen Sixties with the discharge of Letraset sheets containing Lorem Ipsum passages, and extra lately with desktop publishing software program like Aldus PageMaker together with variations of Lorem Ipsum. Lorem Ipsum is just dummy textual content of the printing and typesetting trade. Lorem Ipsum has been the trade's normal dummy textual content ever for the reason that 1500s, when an unknown printer took a galley of sort and scrambled it to make a kind specimen e book. It has survived not solely 5 centuries, but in addition the leap into digital typesetting, remaining primarily unchanged. It was popularised within the Nineteen Sixties with the discharge of Letraset sheets containing Lorem Ipsum passages, and extra lately with desktop publishing software program like Aldus PageMaker together with variations of Lorem Ipsum."
let shortText: String = "That is brief textual content"
var physique: some View {
VStack {
Picture(systemName: "photograph").resizable().aspectRatio(contentMode: .match).body(width: 30, peak: 20)
/// Word: This exhibits each components picture and textual content within the heart of the view.
// Textual content(shortText).font(.physique)
// .foregroundStyle(Coloration.main)
// .multilineTextAlignment(.heart)
// .padding(.prime, 20.0)
// .padding([.leading, .trailing], 25.0)
/// Word: Scrollview pushes the picture and textual content on prime.
ScrollView(showsIndicators: false) {
Textual content(shortText).font(.physique)
.foregroundStyle(Coloration.main)
.multilineTextAlignment(.heart)
.padding(.prime, 20.0)
.padding([.leading, .trailing], 25.0)
}
}
.padding(.prime, 20.0)
}
}
Brief textual content with out scroll view (That is what I would like the view to at all times search for brief textual content i.e. even with scroll view):
That is how view seems to be at present with scroll view and brief textual content (I would like picture and textual content to be centered identical to above picture, even when scroll view is current)
View with picture and lengthy textual content (That is as anticipated when lengthy textual content is current)
How can I maintain the picture and textual content centered for smaller texts even with scroll view? Or is there some other strategy to obtain what I would like?