SwiftUI内容是屏幕顶部的显示内容

时间:2019-12-14 22:43:16

标签: swift swiftui

我有一个NavigationView,然后有一个VStack。问题是VStack内部的所有内容都显示在屏幕中间而不是顶部。为什么会这样?

var body: some View {
        VStack {
            VStack(alignment: .leading) {

                if (request?.receiverID ?? "") == userDataViewModel.userID {
                    Text("\(sendertFirstName) wants to ship your package").font(.title)
                } else {
                    Text("You want to ship \(recieverFirstName)'s package").font(.title)
                }

                HStack{
                    Image(systemName: "clock.fill").font(.subheadline)
                    Text("\(createdAt, formatter: DateService().shortTime)").font(.subheadline).foregroundColor(.secondary)
                }

                HStack {
                    VStack(alignment: .leading) {
                        HStack {
                            Image(systemName: "person.fill").font(.subheadline)
                            Text(sendertFirstName).font(.subheadline).foregroundColor(.secondary)
                        }
                    }

                    Spacer()

                    VStack(alignment: .leading) {
                        HStack {
                            Image(systemName: "star.fill")
                            Text(rating).font(.subheadline).foregroundColor(.secondary)
                        }
                    }
                }
            }

            VStack(alignment: .center) {
                HStack {
                    Button("Accept") {
                        //print(self.request.createdAt)
                        //FirestoreService().respondToRequest(request: self.request.documentReference, status: "accepted")
                    }
                    .padding()
                    Button("Decline") {
                        //FirestoreService().respondToRequest(request: self.request.documentReference, status: "declined")
                    }
                    .foregroundColor(.red)
                    .padding()
                }
            }

            ScrollView {
                ForEach(messages) { (message: Message) in
                    if message.senderId == self.userDataViewModel.userID {
                        HStack {
                            Spacer()
                            Text(message.text).font(.subheadline).padding(7.5).background(self.blue).cornerRadius(30).foregroundColor(.white)
                        }.padding(.bottom, 2)
                    } else {
                        HStack {
                            Text(message.text).font(.subheadline).padding(7.5).background(self.gray).cornerRadius(30).foregroundColor(.white)
                            Spacer()
                        }.padding(.bottom, 2)
                    }

                }
            }

            HStack {
                TextField("Message", text: $inputMessage).padding(5).background(self.gray).cornerRadius(30).foregroundColor(.white)

                Button(action: {
                    let msg: [String: Any] = [
                        "text": self.inputMessage,
                        "createdAt": Timestamp(),
                        "senderId": self.userDataViewModel.userID
                    ]

                    self.reference.updateData([
                        "messages": FieldValue.arrayUnion([msg])
                    ])

                    self.messages.append(Message(dictionary: msg))

                    self.inputMessage = ""

                }) {
                    Image(systemName: "arrow.up.circle.fill").foregroundColor(self.blue).font(.title)
                }
            }
            Spacer()
        }
        .padding()
        .border(Color.red)
    }

我希望内容从顶部开始而不是从中间开始。我在这里做什么错了?

enter image description here

2 个答案:

答案 0 :(得分:1)

您不需要NavigationView-现在已完成所有设置,将VStack包裹在NavigationView中两次,大空白是第二个空白导航酒吧。

默认情况下,大多数View仅占用它们所需的空间,它们位于其父视图的中心。因此,如果要将内容放在顶部,则需要将Spacer()添加为VStack的最后一个元素:

var body: some View {
    VStack {
        /* ... */
        Spacer()
    }
}

Spacer是罕见的View之一,它占用父视图提供的所有空间,并将所有内容向上推。

答案 1 :(得分:0)

也许您可以尝试这种方式:

import numpy as np
import cv2
import os

image_path = input("Enter a fully qualified path for an image: ")
#define a function to load an image
def img_loader(img_path):
    exists = os.path.isfile(img_path)
    if exists:
        img = cv2.imread(img_path)
        print("Success! The image path exists")
        return img
    else:
        print("WARNING: The file path you entered was incorrect.")
        return None

load=img_loader(image_path)   
print(load)