On Day #1, I learned the basics of the Swift UI such as VStack, HStack and ZStack. Also, used struct to group the code and make it simple.
import SwiftUI
struct ContentView: View {
var body: some View {
ZStack{
LinearGradient(gradient: Gradient(colors: [.blue,.white]), startPoint: .topLeading, endPoint: .bottomLeading)
.ignoresSafeArea(.all)
VStack{
Text("Cupertino, CA")
.font(.system(size: 32, weight: .medium, design: .rounded))
.foregroundColor(.white)
.padding()
VStack(spacing: 10){
Image(systemName: "cloud.sun.fill")
.renderingMode(.original)
.resizable()
.aspectRatio(contentMode: .fit)
.frame(width: 180, height: 180)
Text("76°")
.font(.system(size: 70, weight: .medium, design: .rounded))
.foregroundColor(.white)
HStack{
WeatherDayView(DayOfWeek: "TUE", Weather: "cloud.sun.fill", temperature: 74)
WeatherDayView(DayOfWeek: "WED", Weather: "cloud.fog.fill", temperature: 71)
WeatherDayView(DayOfWeek: "THR", Weather: "cloud.heavyrain.fill", temperature: 66)
WeatherDayView(DayOfWeek: "FRI", Weather: "cloud.drizzle.fill", temperature: 64)
WeatherDayView(DayOfWeek: "SAT", Weather: "cloud.fog.fill", temperature: 68)
}
}
Spacer()
}
}
}
}
struct ContentView_Previews: PreviewProvider {
static var previews: some View {
ContentView()
}
}
struct WeatherDayView: View {
var DayOfWeek: String
var Weather: String
var temperature: Int
var body: some View {
VStack{
Text(DayOfWeek)
.font(.system(size: 20, weight: .medium, design:.rounded))
.foregroundColor(.white)
Image(systemName: Weather)
.renderingMode(.original)
.resizable()
.aspectRatio(contentMode: .fit)
.frame(width: 40, height: 40)
Text("\\(temperature)°")
.font(.system(size: 20, weight: .medium, design:.rounded))
.foregroundColor(.white)
}
}
}