ios – Scroll view pushes parts to the highest of the display

ios – Scroll view pushes parts to the highest of the display


On my view, I’ve a picture that I all the time with to show and a few textual content under it which must be vertically scrollable. This textual content may very well 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 will be pushed to the highest, so textual content can get extra room.

That is my code under 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 solely dummy textual content of the printing and typesetting trade. Lorem Ipsum has been the trade's commonplace dummy textual content ever for the reason that 1500s, when an unknown printer took a galley of kind and scrambled it to make a kind specimen e book. It has survived not solely 5 centuries, but additionally the leap into digital typesetting, remaining basically unchanged. It was popularised within the Nineteen Sixties with the discharge of Letraset sheets containing Lorem Ipsum passages, and extra not too long ago with desktop publishing software program like Aldus PageMaker together with variations of Lorem Ipsum. Lorem Ipsum is solely dummy textual content of the printing and typesetting trade. Lorem Ipsum has been the trade's commonplace dummy textual content ever for the reason that 1500s, when an unknown printer took a galley of kind and scrambled it to make a kind specimen e book. It has survived not solely 5 centuries, but additionally the leap into digital typesetting, remaining basically unchanged. It was popularised within the Nineteen Sixties with the discharge of Letraset sheets containing Lorem Ipsum passages, and extra not too long ago with desktop publishing software program like Aldus PageMaker together with variations of Lorem Ipsum. Lorem Ipsum is solely dummy textual content of the printing and typesetting trade. Lorem Ipsum has been the trade's commonplace dummy textual content ever for the reason that 1500s, when an unknown printer took a galley of kind and scrambled it to make a kind specimen e book. It has survived not solely 5 centuries, but additionally the leap into digital typesetting, remaining basically unchanged. It was popularised within the Nineteen Sixties with the discharge of Letraset sheets containing Lorem Ipsum passages, and extra not too long ago 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: "picture").resizable().aspectRatio(contentMode: .match).body(width: 30, top: 20)

    /// Word: This exhibits each parts picture and textual content within the heart of the view.
//            Textual content(shortText).font(.physique)
//                .foregroundStyle(Coloration.main)
//                .multilineTextAlignment(.heart)
//                .padding(.high, 20.0)
//                .padding([.leading, .trailing], 25.0)
            
    /// Word: Scrollview pushes the picture and textual content on high.
            ScrollView(showsIndicators: false) {
                Textual content(shortText).font(.physique)
                    .foregroundStyle(Coloration.main)
                    .multilineTextAlignment(.heart)
                    .padding(.high, 20.0)
                    .padding([.leading, .trailing], 25.0)
            }
        }
        .padding(.high, 20.0)
    }
}

Quick textual content with out scroll view (That is what I need the view to all the time search for brief textual content i.e. even with scroll view):

enter image description here

That is how view appears to be like presently with scroll view and brief textual content (I need picture and textual content to be centered identical to above picture, even when scroll view is current)

enter image description here

View with picture and lengthy textual content (That is as anticipated when lengthy textual content is current)

enter image description here

How can I maintain the picture and textual content centered for smaller texts even with scroll view? Or is there some other technique to obtain what I need?

author avatar
roosho Senior Engineer (Technical Services)
I am Rakib Raihan RooSho, Jack of all IT Trades. You got it right. Good for nothing. I try a lot of things and fail more than that. That's how I learn. Whenever I succeed, I note that in my cookbook. Eventually, that became my blog. 
rooshohttps://www.roosho.com
I am Rakib Raihan RooSho, Jack of all IT Trades. You got it right. Good for nothing. I try a lot of things and fail more than that. That's how I learn. Whenever I succeed, I note that in my cookbook. Eventually, that became my blog. 

Related Articles

LEAVE A REPLY

Please enter your comment!
Please enter your name here


Latest Articles

author avatar
roosho Senior Engineer (Technical Services)
I am Rakib Raihan RooSho, Jack of all IT Trades. You got it right. Good for nothing. I try a lot of things and fail more than that. That's how I learn. Whenever I succeed, I note that in my cookbook. Eventually, that became my blog.