Embeded AirQualityCell into container view

1Weather.xcodeproj/xcuserdata/dstepanets.xcuserdatad/xcschemes/xcschememanagement.plist

@@ -12,7 +12,7 @@
 		<key>OneWeatherNotificationServiceExtension.xcscheme_^#shared#^_</key>
 		<dict>
 			<key>orderHint</key>
-			<integer>54</integer>
+			<integer>55</integer>
 		</dict>
 		<key>PG (Playground) 1.xcscheme</key>
 		<dict>

1Weather.xcworkspace/xcuserdata/dstepanets.xcuserdatad/xcschemes/xcschememanagement.plist

@@ -9,21 +9,21 @@
 			<key>isShown</key>
 			<false/>
 			<key>orderHint</key>
-			<integer>42</integer>
+			<integer>55</integer>
 		</dict>
 		<key>PG (Playground) 2.xcscheme</key>
 		<dict>
 			<key>isShown</key>
 			<false/>
 			<key>orderHint</key>
-			<integer>43</integer>
+			<integer>56</integer>
 		</dict>
 		<key>PG (Playground) 3.xcscheme</key>
 		<dict>
 			<key>isShown</key>
 			<false/>
 			<key>orderHint</key>
-			<integer>44</integer>
+			<integer>57</integer>
 		</dict>
 		<key>PG (Playground) 4.xcscheme</key>
 		<dict>
@@ -51,7 +51,7 @@
 			<key>isShown</key>
 			<false/>
 			<key>orderHint</key>
-			<integer>1</integer>
+			<integer>54</integer>
 		</dict>
 	</dict>
 </dict>

1Weather/UI/View controllers/Today/Cells/TodayAirQualityCell/TodayAirQualityCell.swift

@@ -17,6 +17,7 @@ private struct AirQualityDataType: CirqueDataType {
 class TodayAirQualityCell: UITableViewCell {
     //Private
     private let headingLabel = UILabel()
+    private let container = UIView()
     private let cirqueView = CirqueView()
     private let valueCircle = CAShapeLayer()
     private let airQualityValueLabel = UILabel()
@@ -29,6 +30,7 @@ class TodayAirQualityCell: UITableViewCell {
         
         prepareCell()
         prepareHeading()
+        prepareContainer()
         prepareAirLabels()
         prepareValueProgress()
         prepareStackView()
@@ -111,17 +113,29 @@ private extension TodayAirQualityCell {
         }
     }
     
+    func prepareContainer() {
+        container.backgroundColor = ThemeManager.currentTheme.containerBackgroundColor
+        container.layer.cornerRadius = 12
+        contentView.addSubview(container)
+        
+        container.snp.makeConstraints { make in
+            make.left.right.equalToSuperview().inset(18)
+            make.top.equalTo(headingLabel.snp.bottom).offset(20)
+            make.bottom.equalToSuperview().inset(15)
+        }
+    }
+    
     func prepareAirLabels() {
         airQualityLabel.lineBreakMode = .byWordWrapping
         airQualityLabel.numberOfLines = 0
         airQualityValueLabel.font = AppFont.SFPro.bold(size: 18)
         airQualityValueLabel.textColor = ThemeManager.currentTheme.secondaryTextColor
-        contentView.addSubview(airQualityValueLabel)
+        container.addSubview(airQualityValueLabel)
         
         airQualityLabel.numberOfLines = 0
         airQualityLabel.lineBreakMode = .byWordWrapping
         airQualityLabel.textAlignment = .left
-        contentView.addSubview(airQualityLabel)
+        container.addSubview(airQualityLabel)
         
         airDescLabel.textAlignment = .left
         airDescLabel.numberOfLines = 0
@@ -129,23 +143,23 @@ private extension TodayAirQualityCell {
         airDescLabel.font = AppFont.SFPro.regular(size: 16)
         airDescLabel.textColor = ThemeManager.currentTheme.secondaryTextColor
         airDescLabel.text = ""
-        contentView.addSubview(airDescLabel)
+        container.addSubview(airDescLabel)
         
         //Constraints
         airQualityValueLabel.snp.makeConstraints { (make) in
-            make.left.equalToSuperview().inset(72)
-            make.top.equalTo(headingLabel.snp.bottom).offset(72).priority(999)
+            make.left.equalToSuperview().inset(54)
+            make.top.equalToSuperview().inset(52).priority(999)
         }
         
         airQualityLabel.snp.makeConstraints { (make) in
             make.left.equalTo(airQualityValueLabel.snp.right).offset(54)
-            make.top.equalTo(headingLabel.snp.bottom).offset(48)
+            make.top.equalToSuperview().inset(28)
 //            make.centerY.equalTo(airQualityValueLabel)
             make.right.equalToSuperview().inset(48)
         }
         
         airDescLabel.snp.makeConstraints { (make) in
-            make.left.right.equalToSuperview().inset(50)
+            make.left.right.equalToSuperview().inset(32)
             make.top.greaterThanOrEqualTo(airQualityLabel.snp.bottom).offset(8)
             // also see prepareValueProgress
         }
@@ -155,13 +169,13 @@ private extension TodayAirQualityCell {
         valueCircle.strokeColor = UIColor(hex: 0xe9ebfc).cgColor
         valueCircle.fillColor = UIColor.clear.cgColor
         valueCircle.lineWidth = 2
-        contentView.layer.addSublayer(valueCircle)
+        container.layer.addSublayer(valueCircle)
 
         cirqueView.lineWidth = 6
         cirqueView.stepSize = 0.01
         cirqueView.roundLineCorners = true
         cirqueView.backgroundColor = .clear
-        contentView.addSubview(cirqueView)
+        container.addSubview(cirqueView)
 
         cirqueView.snp.makeConstraints { (make) in
             make.width.height.equalTo(77)
@@ -177,10 +191,10 @@ private extension TodayAirQualityCell {
         stackView.axis = .vertical
         stackView.distribution = .fillProportionally
         stackView.clipsToBounds = false
-        contentView.addSubview(stackView)
+        container.addSubview(stackView)
         
         stackView.snp.makeConstraints { (make) in
-            make.left.right.equalToSuperview().inset(50)
+            make.left.right.equalToSuperview().inset(27)
             make.top.equalTo(airDescLabel.snp.bottom).offset(15)
             make.bottom.equalToSuperview().inset(15)
         }