Complete Challenge 1

> Use the techniques you learned in project 2 to draw a thin gray line around the buttons view, to make it stand out from the rest of the UI. I ended up making some slightly different tweaks -- but ensuring that the buttons stand out nonetheless.
CypherPoet · Mar 15, 2019 · 2897464 · 2897464
1 parent 6ef95fe
commit 2897464
Show file tree

Hide file tree

Showing 3 changed files with 63 additions and 12 deletions.
diff --git a/day-036/project/Seven Swifty Words/Seven Swifty Words.xcodeproj/project.pbxproj b/day-036/project/Seven Swifty Words/Seven Swifty Words.xcodeproj/project.pbxproj
@@ -7,6 +7,7 @@
 	objects = {
 
 /* Begin PBXBuildFile section */
+		F3258955223C3FEE00015642 /* Style.swift in Sources */ = {isa = PBXBuildFile; fileRef = F3258954223C3FEE00015642 /* Style.swift */; };
 		F3E26D6D223929A600AE182D /* Assets.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = F3E26D64223929A600AE182D /* Assets.xcassets */; };
 		F3E26D6F223929A600AE182D /* AppDelegate.swift in Sources */ = {isa = PBXBuildFile; fileRef = F3E26D68223929A600AE182D /* AppDelegate.swift */; };
 		F3E26D70223929A600AE182D /* Home.storyboard in Resources */ = {isa = PBXBuildFile; fileRef = F3E26D6B223929A600AE182D /* Home.storyboard */; };
@@ -17,6 +18,7 @@
 /* End PBXBuildFile section */
 
 /* Begin PBXFileReference section */
+		F3258954223C3FEE00015642 /* Style.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = Style.swift; sourceTree = "<group>"; };
 		F3C4952521F69881002853B6 /* Seven Swifty Words.app */ = {isa = PBXFileReference; explicitFileType = wrapper.application; includeInIndex = 0; path = "Seven Swifty Words.app"; sourceTree = BUILT_PRODUCTS_DIR; };
 		F3E26D64223929A600AE182D /* Assets.xcassets */ = {isa = PBXFileReference; lastKnownFileType = folder.assetcatalog; path = Assets.xcassets; sourceTree = "<group>"; };
 		F3E26D66223929A600AE182D /* Info.plist */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.plist.xml; path = Info.plist; sourceTree = "<group>"; };
@@ -81,6 +83,7 @@
 			isa = PBXGroup;
 			children = (
 				F3E26D66223929A600AE182D /* Info.plist */,
+				F3258954223C3FEE00015642 /* Style.swift */,
 			);
 			path = "Supporting Files";
 			sourceTree = "<group>";
@@ -184,6 +187,7 @@
 			buildActionMask = 2147483647;
 			files = (
 				F3E26D6F223929A600AE182D /* AppDelegate.swift in Sources */,
+				F3258955223C3FEE00015642 /* Style.swift in Sources */,
 				F3E26D71223929A600AE182D /* HomeViewController.swift in Sources */,
 			);
 			runOnlyForDeploymentPostprocessing = 0;

diff --git a/day-036/project/Seven Swifty Words/Source/Controllers/Home/HomeViewController.swift b/day-036/project/Seven Swifty Words/Source/Controllers/Home/HomeViewController.swift
@@ -35,11 +35,26 @@ class HomeViewController: UIViewController {
         }
     }
 
+    var currentAnswer = "" {
+        didSet {
+            if currentAnswer.isEmpty {
+                currentAnswerField.text = "Tap Lettters To Guess"
+                currentAnswerField.textColor = Style.Color.answerTextPlaceholder
+            } else {
+                currentAnswerField.text = currentAnswer
+                currentAnswerField.textColor = Style.Color.answerText
+            }
+        }
+    }
+
 
     override func viewDidLoad() {
         super.viewDidLoad()
         // Do any additional setup after loading the view, typically from a nib.
 
+        currentAnswer = ""
+
+        setStyles()
         createLetterGroupButtons()
         positionLabels()
         positionAnswerText()
@@ -118,9 +133,21 @@ private extension HomeViewController {
 // MARK: - UI Setup
 
 extension HomeViewController {
+    func setStyles() {
+        view.backgroundColor = Style.Color.background
+        answersLabel.textColor = Style.Color.labelText
+        cluesLabel.textColor = Style.Color.labelText
+        scoreLabel.textColor = Style.Color.labelText
+
+        letterGroupButtonContainer.layer.cornerRadius = 3
+        letterGroupButtonContainer.layer.shadowColor = Style.Color.letterGroupButtonShadow.cgColor
+        letterGroupButtonContainer.layer.shadowOpacity = 0.7
+        letterGroupButtonContainer.layer.shadowRadius = 2
+    }
+
     func createLetterGroupButtons() {
-        let xSpacing = 10
-        let ySpacing = 10
+        let xSpacing = 0
+        let ySpacing = 0
 
         for row in 0...3 {
             for column in 0...4 {
@@ -130,7 +157,7 @@ extension HomeViewController {
 
                 button.frame = CGRect(x: xPos, y: yPos, width: LetterGroupButton.width, height: LetterGroupButton.height)
                 button.titleLabel?.font = UIFont.systemFont(ofSize: 36)
-                button.titleLabel?.textColor = UIColor(hue: 0.68, saturation: 0.52, brightness: 0.88, alpha: 1.00)
+                button.tintColor = Style.Color.letterGroupButton
                 button.addTarget(self, action: #selector(letterGroupTapped), for: .touchUpInside)
 
                 letterGroupButtons.append(button)
@@ -146,7 +173,7 @@ extension HomeViewController {
             scoreLabel.topAnchor.constraint(equalTo: view.layoutMarginsGuide.topAnchor, constant: 16),
             scoreLabel.trailingAnchor.constraint(equalTo: view.layoutMarginsGuide.trailingAnchor, constant: -16),
 
-            cluesLabel.topAnchor.constraint(equalTo: scoreLabel.bottomAnchor, constant: 12),
+            cluesLabel.topAnchor.constraint(equalTo: scoreLabel.bottomAnchor, constant: 0),
             cluesLabel.leadingAnchor.constraint(equalTo: view.layoutMarginsGuide.leadingAnchor, constant: 100),
 
             // make the clues label 60% of the width of our layout margins, minus 100
@@ -161,7 +188,7 @@ extension HomeViewController {
             answersLabel.heightAnchor.constraint(equalTo: cluesLabel.heightAnchor)
         ])
 
-        // Make these the first views to be stretched if needed
+        // Lower the content hugging priority -- making these the first views to be stretched if needed
         cluesLabel.setContentHuggingPriority(UILayoutPriority(1), for: .vertical)
         answersLabel.setContentHuggingPriority(UILayoutPriority(1), for: .vertical)
     }
@@ -190,8 +217,8 @@ extension HomeViewController {
             clearButton.centerXAnchor.constraint(equalTo: view.centerXAnchor, constant: 100),
             clearButton.heightAnchor.constraint(equalToConstant: 44),
 
-            letterGroupButtonContainer.widthAnchor.constraint(equalToConstant: 750),
-            letterGroupButtonContainer.heightAnchor.constraint(equalToConstant: 320),
+            letterGroupButtonContainer.widthAnchor.constraint(equalToConstant: CGFloat(LetterGroupButton.width * 5)),
+            letterGroupButtonContainer.heightAnchor.constraint(equalToConstant: CGFloat(LetterGroupButton.height * 4)),
             letterGroupButtonContainer.topAnchor.constraint(equalTo: submitButton.bottomAnchor, constant: 12),
             letterGroupButtonContainer.bottomAnchor.constraint(equalTo: view.layoutMarginsGuide.bottomAnchor, constant: -32),
         ])
@@ -205,10 +232,10 @@ private extension HomeViewController {
     func addCorrectAnswer(indexOfMatch: Int) {
         var answerStrings = answersLabel.text!.components(separatedBy: "\n")
 
-        answerStrings[indexOfMatch] = currentAnswerField.text!
+        answerStrings[indexOfMatch] = currentAnswer
         answersLabel.text = answerStrings.joined(separator: "\n")
 
-        currentAnswerField.text = ""
+        currentAnswer = ""
     }
 
 
@@ -264,7 +291,7 @@ private extension HomeViewController {
 
 
     func clearAnswer() {
-        currentAnswerField.text = ""
+        currentAnswer = ""
 
         activatedButtons.forEach { $0.isHidden = false }
         activatedButtons.removeAll()
@@ -286,7 +313,7 @@ extension HomeViewController {
      to display the answer itself, rather than its letter count
      */
     @IBAction func submitTapped(_ sender: Any) {
-        guard let currentAnswer = currentAnswerField.text else { return }
+        guard !currentAnswer.isEmpty else { return }
 
         if let indexOfMatch = solutionWords.firstIndex(of: currentAnswer) {
             activatedButtons.removeAll()  // remove all from our array -- but keep them "hidden" on the UI
@@ -301,7 +328,7 @@ extension HomeViewController {
     @objc func letterGroupTapped(_ sender: UIButton) {
         guard let buttontext = sender.titleLabel?.text else { return }
 
-        currentAnswerField.text = currentAnswerField.text?.appending(buttontext)
+        currentAnswer += buttontext
         activatedButtons.append(sender)
         sender.isHidden = true
     }

diff --git a/day-036/project/Seven Swifty Words/Source/Supporting Files/Style.swift b/day-036/project/Seven Swifty Words/Source/Supporting Files/Style.swift
@@ -0,0 +1,20 @@
+//
+//  Style.swift
+//  Seven Swifty Words
+//
+//  Created by Brian Sipple on 3/15/19.
+//  Copyright © 2019 Brian Sipple. All rights reserved.
+//
+
+import UIKit
+
+enum Style {
+    enum Color {
+        static let background = #colorLiteral(red: 0.1557853222, green: 0.1640332043, blue: 0.2117108405, alpha: 1)
+        static let labelText = #colorLiteral(red: 0.9994066358, green: 0.3798269629, blue: 0.5379426479, alpha: 1)
+        static let letterGroupButton = #colorLiteral(red: 0.4665188789, green: 0.4245759249, blue: 0.8790055513, alpha: 1)
+        static let letterGroupButtonShadow = #colorLiteral(red: 0.9994066358, green: 0.3798269629, blue: 0.5379426479, alpha: 1)
+        static let answerTextPlaceholder = #colorLiteral(red: 0.5362107158, green: 0.5363042355, blue: 0.5361984372, alpha: 1)
+        static let answerText = #colorLiteral(red: 0.8912534118, green: 0.8914031386, blue: 0.8912337422, alpha: 1)
+    }
+}