來買雙鞋子吧!!
Published in
8 min readMar 26, 2022
Money 遊戲!!
那就來買鞋子吧!!!
人生其中一個夢想就是擁有一整片的鞋牆
畫面長這樣
用到的功能:
- UISegmentedControl 選擇鞋子
- UIImageView 顯示鞋子圖片
- UILabel顯示金額、顯示文字
- UIStepper 要付的金額
- UIButton 購買按鈕
能觸發的IBAction有
- 點選UISegmentedControl 會更新圖片及價格
- 點選UIStepper 會修正數量及總金額
- 點選UIButton 可以 看有沒有買到
來看看操作吧
更新圖片及價格
var image = ["Air Jordan 1",
"Air Jordan 2",
"Air Jordan 3",
"Air Jordan 4",
"Air Jordan 5",
"Air Jordan 6"]
var price = ["5500",
"5600",
"6050",
"8505",
"3195",
"7020"]@IBAction func changeSegmentedControl(_ sender: UISegmentedControl) {
let selectNumber = sender.selectedSegmentIndex
changeImage(number: selectNumber)
}//點選segmentedControl 異動圖片及價錢
func changeImage(number: Int) {
shoeImage.image = UIImage(named: image[number])
shoePrice.text = price[number]
//重置已輸入的金額
restart()
}
UIStepper 會修正數量及總金額
//價錢數量
@IBOutlet weak var thousandQty: UILabel!
@IBOutlet weak var fiveHunderQty: UILabel!
@IBOutlet weak var oneHunderQty: UILabel!
@IBOutlet weak var fiftyQty: UILabel!
@IBOutlet weak var tenQty: UILabel!
@IBOutlet weak var fiveQty: UILabel!
@IBOutlet weak var totalPrice: UILabel!
//價格加減功能
@IBOutlet weak var thousadnStepper: UIStepper!
@IBOutlet weak var fiveHunderStepper: UIStepper!
@IBOutlet weak var oneHunderStepper: UIStepper!
@IBOutlet weak var fiftyStepper: UIStepper!
@IBOutlet weak var tenStepper: UIStepper!
@IBOutlet weak var fiveStepper: UIStepper! //點增加金額 觸發點
@IBAction func changeStepper(_ sender: UIStepper) {
//接值動作
thousandQtyNumber = Int(thousadnStepper.value)
fiveHunderQtyNumber = Int(fiveHunderStepper.value)
oneHunderQtyNumber = Int(oneHunderStepper.value)
fiftyQtyNumber = Int(fiftyStepper.value)
tenQtyNumber = Int(tenStepper.value)
fiveQtyNumber = Int(fiveStepper.value)
//顯示於label (String = Int)
thousandQty.text = "\(thousandQtyNumber)"
fiveHunderQty.text = "\(fiveHunderQtyNumber)"
oneHunderQty.text = "\(oneHunderQtyNumber)"
fiftyQty.text = "\(fiftyQtyNumber)"
tenQty.text = "\(tenQtyNumber)"
fiveQty.text = "\(fiveQtyNumber)"
//加總動作
sumTotal()
}//計算總金額
func sumTotal() {
let total = thousandQtyNumber*1000 + fiveHunderQtyNumber*500 + oneHunderQtyNumber*100 + fiftyQtyNumber*50
+ tenQtyNumber*10 + fiveQtyNumber*5
totalPrice.text = "\(total)"
}
購買按鈕
//購買按鈕 觸發點
@IBAction func buy(_ sender: UIButton) {
//原價 shoePirce.text
//已付金額 total.text
if shoePrice.text != nil && totalPrice.text != nil {
if totalPrice.text == "\(shoePrice.text!)" {
print("買成功")
alert(status:1)
//如果購買成功,會跳下一個商品(若是最後一個,會再跳回去第一個)
var number = Segmen.selectedSegmentIndex
var nextNumber : Int
if number == image.count - 1 {
nextNumber = 0
} else {
nextNumber = Segmen.selectedSegmentIndex + 1
}
Segmen.selectedSegmentIndex = nextNumber
changeImage(number: nextNumber)
//changeSegmentedControl()
} else if totalPrice.text! < "\(shoePrice.text!)" {
alert(status:2)
} else {
alert(status:3)
}
}
}//通知訊息
func alert(status: Int) {
var title : String
var message : String
switch status {
case 1 :
title = "成功!!"
message = "購買成功囉!!!"
case 2 :
title = "失敗!!"
message = "錢不夠喔~~"
default:
title = "注意!!"
message = "拍謝不能找錢TAT"
}
//print(message)
//本體
let alert = UIAlertController(title: title, message: message, preferredStyle: .alert)
//按鈕
let okAction = UIAlertAction(title: "OK", style: .default) { (okAction) in
alert.dismiss(animated: true, completion: nil)
}
//將按鈕加入本體
alert.addAction(okAction)
//persend出來
present(alert,animated: true,completion: nil)
}
操作流程
附上我的GitHub
ps: 圖片皆是google,也只用在自己Demo部分,沒有其他用途,謝謝。