Как сделать «гладкую таблицу» в SwiftUI

#swiftui

#swiftui

Вопрос:

У меня есть экран Android, и я хочу скопировать его на экран swiftui ios.

Android: текст гладкий, гравитация слева   сверху. Базовая линия в верхней части

iOS: введите описание изображения здесь

Но я пытаюсь сделать это в swiftui. Как вы видите, у текста нет параметров базовой линии и гравитации, как я делаю это в Android. Помогите мне, пожалуйста, сделать эквивалентный простой экран.

Мой код swiftui:

 struct WeatherView: View {
    var weather: WeatherMainModel

    var body: some View {
        VStack {
            VStack {
                Text("Description: (weather.weather[0].component3())")
                Text("Visibility: (weather.visibility) meters")
                Text("Main: (weather.weather[0].main)")
            }
            VStack {
                Text("Temperature Data")
                HStack {
                    VStack {
                        HStack {
                            Text("Temperature: (temperatureString(value: weather.mainData.temperature))")
                                .font(.system(size: 15))
                            Spacer()
                        }
                        HStack {
                            Text("Temperature fels like: (temperatureString(value: weather.mainData.temperatureFeelsLike))")
                                .font(.system(size: 15))
                            Spacer()
                        }

                    }
                    VStack {
                        HStack {
                            Text("Temperature max: (temperatureString(value: weather.mainData.temperatureMax))")
                                .font(.system(size: 15))
                            Spacer()
                        }
                        HStack {
                            Text("Temperature min: (temperatureString(value: weather.mainData.temperatureMin))")
                                .font(.system(size: 15))
                            Spacer()
                        }
                    }
                }.padding(.horizontal, 5)
            }.cornerRadius(10)
            .overlay(
                RoundedRectangle(cornerRadius: 10).stroke(Color.gray, lineWidth: 1)
            )
            Spacer()
        }.padding(.horizontal)
    }

    private func temperatureString(value: Float) -> String {
        return String(format: "%.2f", value)
    }
}
  

Ответ №1:

Ваши тексты на втором экране отличаются от первого, но я предполагаю, что вы хотели что-то вроде приведенного ниже (можно настроить отступы / интервалы / шрифты)

Подготовлено с помощью Xcode 12.1 / iOS 14.1

ДЕМОНСТРАЦИЯ

 struct DemoView: View {
    var body: some View {
        VStack {
            Text("Description")
            Text("Visibility")
            Text("main")
            VStack {
                Text("Temperature Data")
                HStack(alignment: .top) {
                    Text("Temperature: 38 dsa das das das da sd")
                        .frame(maxWidth: .infinity, alignment: .leading)
                    Text("Temperature Max: 38")
                        .frame(maxWidth: .infinity, alignment: .leading)
                }
                HStack(alignment: .top) {
                    Text("Temperature fels like: 38")
                        .frame(maxWidth: .infinity, alignment: .leading)
                    Text("Temperature Min: 38")
                        .frame(maxWidth: .infinity, alignment: .leading)
                }
            }.padding(.top)
            Spacer()
        }.padding(.horizontal, 8)
    }
}
  

Комментарии:

1. Потрясающе и просто! Большое вам спасибо!