关灯闭灯游戏

开灯闭灯: 创建几乘几的按钮(灯), 通过点击任意的按钮实现本身和其所对应的上下左右的按钮状态发生改变(关灯, 闭灯).

1.创建几乘几的按钮(灯), 给每个button一个tag值

#define WIDTH [UIScreen mainScreen].bounds.size.width
#define HEIGHT [UIScreen mainScreen].bounds.size.height

// 设置行列的按钮的个数
#define o 11
#define q 11

NSInteger count = 100;
for (int i = 0; i < q; i++) {
for (int j = 0; j < o; j++) {
UIButton *button = [UIButton buttonWithType:UIButtonTypeRoundedRect];
button.tag = count;
button.frame = CGRectMake(WIDTH / o * j, WIDTH / o * i + 100, WIDTH / o - 3, WIDTH / o - 3);
button.backgroundColor = [UIColor greenColor];
[button addTarget:self action:@selector(buttonAction:) forControlEvents:UIControlEventTouchUpInside];
[_window addSubview:button];
count += 100;
}
}



2.判断所点击的按钮. (可以用其坐标或其中心点来获取其对应上下左右的按钮, 这里利用tag进行判断,所以还要注意按钮组成方阵的按钮组, 最上一排所对应的上面没有按钮, 同样其最左面, 右面, 下面没有相应的按钮).

- (void)buttonAction:(UIButton *)sender{
NSUInteger buttonTag = sender.tag;
if (buttonTag > o * 100) {
UIButton *upButton = (UIButton *)[_window viewWithTag:buttonTag - o * 100];
[self upButtonBackgroundColorForSelectedButton:upButton];
}

if (buttonTag > 100 && buttonTag % (o * 100) != 100) {
UIButton *leftButton = (UIButton *)[_window viewWithTag:buttonTag - 100];
[self leftButtonBackgroundColorForSelectedButton:leftButton];
}

UIButton *downButton = (UIButton *)[_window viewWithTag:buttonTag + o * 100];
if (buttonTag % (o * 100) != 0) {
UIButton *rightButton = (UIButton *)[_window viewWithTag:buttonTag + 100];
[self rightButtonBackgroundColorForSelectedButton:rightButton];
}

[self clickButtonBackgroundColorForSelectedButton:sender];
[self downButtonBackgroundColorForSelectedButton:downButton];
}



3.改变点击按钮后, 对需要改变的按钮进行改变颜色(关灯闭灯的状态) 

- (void)clickButtonBackgroundColorForSelectedButton:(UIButton *)button{
if (button.backgroundColor == [UIColor greenColor]) {
button.backgroundColor = [UIColor redColor];
}else{
button.backgroundColor = [UIColor greenColor];
}
}
- (void)upButtonBackgroundColorForSelectedButton:(UIButton *)upButton{
if (upButton.backgroundColor == [UIColor greenColor]) {
upButton.backgroundColor = [UIColor redColor];
}else{
upButton.backgroundColor = [UIColor greenColor];
}
}

- (void)downButtonBackgroundColorForSelectedButton:(UIButton *)downButton{
if (downButton.backgroundColor == [UIColor greenColor]) {
downButton.backgroundColor = [UIColor redColor];
}else{
downButton.backgroundColor = [UIColor greenColor];
}
}

- (void)leftButtonBackgroundColorForSelectedButton:(UIButton *)leftButton{
if (leftButton.backgroundColor == [UIColor greenColor]) {
leftButton.backgroundColor = [UIColor redColor];
}else{
leftButton.backgroundColor = [UIColor greenColor];
}
}

- (void)rightButtonBackgroundColorForSelectedButton:(UIButton *)rightButton{
if (rightButton.backgroundColor == [UIColor greenColor]) {
rightButton.backgroundColor = [UIColor redColor];
}else{
rightButton.backgroundColor = [UIColor greenColor];
}
}



  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
好的,以下是用uniapp写一个关灯游戏的代码: <template> <view class="container"> <view class="title">关灯游戏</view> <view class="board"> <view class="row" v-for="(row, rowIndex) in board" :key="rowIndex"> <view class="cell" v-for="(cell, cellIndex) in row" :key="cellIndex" :class="{ on: cell }" @click="toggle(rowIndex, cellIndex)"></view> </view> </view> <view class="btn" @click="reset">重新开始</view> </view> </template> <script> export default { data() { return { board: [ [true, true, true, true, true], [true, true, true, true, true], [true, true, true, true, true], [true, true, true, true, true], [true, true, true, true, true] ] } }, methods: { toggle(row, col) { this.board[row][col] = !this.board[row][col] if (row > 0) this.board[row - 1][col] = !this.board[row - 1][col] if (row < 4) this.board[row + 1][col] = !this.board[row + 1][col] if (col > 0) this.board[row][col - 1] = !this.board[row][col - 1] if (col < 4) this.board[row][col + 1] = !this.board[row][col + 1] if (this.checkWin()) { setTimeout(() => { uni.showToast({ title: '你赢了!', icon: 'success' }) }, 500) } }, checkWin() { return this.board.every(row => row.every(cell => !cell)) }, reset() { this.board = [ [true, true, true, true, true], [true, true, true, true, true], [true, true, true, true, true], [true, true, true, true, true], [true, true, true, true, true] ] } } } </script> <style> .container { display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100vh; } .title { font-size: 36px; font-weight: bold; margin-bottom: 20px; } .board { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 300px; height: 300px; background-color: #eee; border-radius: 10px; padding: 10px; } .row { display: flex; flex-direction: row; } .cell { width: 50px; height: 50px; background-color: #fff; border: 1px solid #ccc; margin: 5px; border-radius: 5px; } .cell.on { background-color: #333; } .btn { margin-top: 20px; padding: 10px 20px; background-color: #333; color: #fff; border-radius: 5px; cursor: pointer; } </style>

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值