// // RoomControlView.swift // fiveConstant // // Created by 李建 on 2023/2/13. // import SwiftUI struct RoomControlView: View { @Environment(\.presentationMode) var presentationMode: Binding @EnvironmentObject var proState: ProgressState @State var roomInfo: RoomInfo var modeIcons = ["snow", "sun.max", "drop.degreesign.slash", "fanblades", "wind", "drop.degreesign"] var controller:RoomController var body: some View { VStack(spacing: 30) { // 标题栏 HStack { Button(action: { self.presentationMode.wrappedValue.dismiss() }, label: { Image(systemName: "chevron.left") .foregroundColor(.gray) }) Spacer() Text("\(roomInfo.name!)") .font(.title3).bold() Spacer() Image(systemName: "ellipsis") .font(.title2.bold()) } // 滑动温度调节器 CircularSliderView(roomInfo: roomInfo).onDragEnd { value in controller.SetTemp(value: value) } // 信息条 HStack { VStack(spacing: 11) { Image(systemName: "thermometer.medium") .foregroundColor(Color("MainColor")) .font(.title2) Text("\(roomInfo.temperature!)℃") .foregroundColor(Color("SecondColor")) } Divider() .frame(height: 50) .padding() VStack(spacing: 11) { Image(systemName: "drop.degreesign") .foregroundColor(Color("MainColor")) .font(.title2) Text("\(roomInfo.humidity!)%") .foregroundColor(Color("SecondColor")) } Divider() .frame(height: 50) .padding() VStack(spacing: 11) { Image(systemName: "aqi.medium") .foregroundColor(Color("MainColor")) .font(.title2) Text("\(roomInfo.air_quality!)") .foregroundColor(Color("SecondColor")) } Divider() .frame(height: 50) .padding() VStack(spacing: 11) { Image(systemName: "carbon.dioxide.cloud") .foregroundColor(Color("MainColor")) .font(.title2) Text("\(roomInfo.co2)") .foregroundColor(Color("SecondColor")) } } // 风速调节器 HStack { Image(systemName: "fanblades.fill") .foregroundColor(Color("SecondColor")) ZStack(alignment: .leading) { HStack { ForEach(1..<6, id: \.self) {index in Capsule() .fill(roomInfo.fan_speed! >= index ? Color("MainColor") :.gray.opacity(0.5)) .frame(height: 14) .animation(.easeInOut, value: roomInfo.fan_speed! >= index) .onTapGesture { roomInfo.fan_speed = index controller.SetFanSpeed(value: index) } } } } } .padding(.leading, 20) .padding(.trailing, 20) // 模式调节 ScrollView(.horizontal, showsIndicators: false) { HStack(spacing: 14) { ForEach(modeIcons.indices, id: \.self) { index in ModeButtonView(icon: modeIcons[index], roomData: $roomInfo, mode: index + 1).onTapGesture { roomInfo.mode = index + 1 controller.SetMode(value: index + 1) } } } } // 底部按钮 HStack { Button { } label: { Image(systemName: "power") .foregroundColor(.white) .font(.title) .frame(maxWidth: .infinity, maxHeight: 80) .background(roomInfo.power! ? Color("SecondColor") : .gray) .cornerRadius(10) .onTapGesture { if roomInfo.power! { controller.PowerOff() } else { controller.PowerOn() } } } Button { } label: { Image(systemName: "clock") .foregroundColor(.white) .font(.title) .frame(width: 100) .frame(maxHeight: 80) .background(Color(hex: 0xE9F2F2).cornerRadius(10)) } } Spacer() } .navigationBarBackButtonHidden(true) .padding() } } struct RoomControlView_Previews: PreviewProvider { static let json = """ {"record_id":"1t7svi03170copjp9iimtd3z005isbfj","name":"样板间","home_id":"1t7svi01jj7copaplj7q47n170kd6hw6","home_name":"李建的家","is_master":true,"control_number":"1","user_id":"","power":true,"set_temp":27,"air_quality":10,"co2":800,"temperature":7,"humidity":40,"mode":3,"fan_speed":4,"fan_value":1,"timer_status":false,"duration":0} """.data(using: .utf8)! static var previews: some View { let decoder = JSONDecoder() let product = try? decoder.decode(RoomInfo.self, from: json) RoomControlView(roomInfo: product!, controller: RoomController(roomId: "1t7svi03170copjp9iimtd3z005isbfj", gatewayId: "", controlNumber: "1")) .environmentObject(ProgressState()) } } struct ModeButtonView: View { var icon: String = "" @Binding var roomData: RoomInfo var mode: Int var body: some View { ZStack { RoundedRectangle(cornerRadius: 10) .fill(mode == roomData.mode! ? Color("MainColor") :Color(hex: 0xF0F5F6)) Image(systemName: icon) .font(.title) .foregroundColor(mode == roomData.mode! ? .white : Color(hex:0xC4C2C2)) } .frame(width: 70, height: 70) } }