鸿蒙版(ArkTs) 贪吃蛇，包含无敌模式 最高分 暂停和继续功能;
效果图如下：
代码如下：

// 所有import语句必须放在文件开头
import router from '@ohos.router';
import promptAction from '@ohos.promptAction';
// Add this import at the top with other imports
// Remove the problematic import
// import { Gradient, GradientDirection } from '@ohos.arkui.graphics';

// 在文件开头添加Preferences导入
import preferences from '@ohos.data.preferences';

// 移除@Entry装饰器
@Entry
@Component
struct Tsc {
  @State snake: Array<[number, number]> = [[5, 5], [5, 6], [5, 7]];
  @State food: [number, number] = [10, 10];
  @State private _moveDirection: number = 3;
  @State score: number = 0;
  @State highScore: number = 0;
  private prefs?: preferences.Preferences; // Use optional type instead of undefined

  @State isInvincible: boolean = false;
  @State foodColor: Color = Color.Red;
  @State snakeHeadColor: Color = Color.Green;
  private gridSize: number = 20;
  private timer: number = 0;
  @State isPlaying: boolean = false;

  // 添加generateFood方法
  generateFood() {
    const gridCells = 12;
    let newFood: [number, number] = [0, 0];
    let validPositionFound = false;
    
    const allPositions: Array<[number, number]> = [];
    for (let x = 0; x < gridCells; x++) {
      for (let y = 0; y < gridCells; y++) {
        allPositions.push([x, y]);
      }
    }
    
    allPositions.sort(() => Math.random() - 0.5);
    
    for (const pos of allPositions) {
      const isOverlap = this.snake.some(segment => 
        segment[0] === pos[0] && segment[1] === pos[1]
      );
      
      if (!isOverlap) {
        newFood = pos;
        validPositionFound = true;
        break;
      }
    }
    
    this.food = newFood;
    this.foodColor = Color.Red; // 设置默认食物颜色
  }

  // 重置游戏状态
  resetGame() {
    this.snake = [[5, 5], [5, 6], [5, 7]];
    this._moveDirection = 3;
    this.score = 0;
    this.generateFood();
  }

  startGame() {
    // 先清除之前的定时器
    if (this.timer) {
      clearInterval(this.timer);
    }
    
    this.resetGame();
    this.isPlaying = true;
    this.timer = setInterval(() => {
      this.moveSnake();
    }, 200);
  }

  // 添加生命周期方法
  aboutToAppear() {
    this.loadHighScore();
  }

  // 加载历史最高分
  async loadHighScore() {
    try {
      this.prefs = await preferences.getPreferences(getContext(this), 'snakeGamePrefs');
      const score = await this.prefs.get('highScore', 0);
      this.highScore = Number(score);
    } catch (err) {
      console.error('Failed to load high score:', err);
    }
  }

  // 保存历史最高分
  async saveHighScore(score: number) {
    try {
      if (this.prefs) { // Add null check
        await this.prefs.put('highScore', score);
        await this.prefs.flush();
      }
    } catch (err) {
      console.error('Failed to save high score:', err);
    }
  }

  endGame() {
    clearInterval(this.timer);
    this.isPlaying = false;
    // 更新历史最高分
    if (this.score > this.highScore) {
      this.highScore = this.score;
      this.saveHighScore(this.highScore);
    }
    promptAction.showToast({
      message: '游戏结束！',
      duration: 2000
    });
  }

  stopGame() {
    clearInterval(this.timer);
    this.isPlaying = false;
    if (this.score > this.highScore) {
      this.highScore = this.score;
      this.saveHighScore(this.highScore);
    }
  }

  moveSnake() {
    if (!this.isPlaying) return;

    let head: [number, number] = [this.snake[0][0], this.snake[0][1]];
    
    switch (this._moveDirection) {
      case 0: head[1] -= 1; break;
      case 1: head[1] += 1; break;
      case 2: head[0] -= 1; break;
      case 3: head[0] += 1; break;
    }

    // 修正边界检测逻辑
    const gridCells = 12; // 与显示区域保持一致
    if (head[0] < 0 || head[0] >= gridCells || 
        head[1] < 0 || head[1] >= gridCells) {
      if (!this.isInvincible) {
        this.endGame();
        return;
      }
      head[0] = (head[0] + gridCells) % gridCells;
      head[1] = (head[1] + gridCells) % gridCells;
    }

    if (head[0] === this.food[0] && head[1] === this.food[1]) {
      this.score += 10;
      this.generateFood();
      // 吃到食物时，只添加新头部，不删除尾部
      this.snake = [head, ...this.snake];
    } else {
      // 没吃到食物时，移动蛇身
      this.snake.pop();
      this.snake = [head, ...this.snake];
    }
  }

  // 添加暂停游戏方法
  @State isPaused: boolean = false; // 添加暂停状态
  
  // 修改暂停游戏方法
  pauseGame() {
    clearInterval(this.timer);
    this.isPlaying = false;
    this.isPaused = true;
  }
  
  // 修改恢复游戏方法
  resumeGame() {
    this.isPlaying = true;
    this.isPaused = false;
    this.timer = setInterval(() => {
      this.moveSnake();
    }, 200);
  }

  build() {
    Column() {
      Button('返回首页')
        .width(100)
        .height(40)
        .fontSize(16)
        .alignSelf(ItemAlign.Start)
        .margin(10)
        .onClick(() => {
          router.pushUrl({
            url: 'pages/Index'
          })
        })

      // 添加历史最高分显示
      Row() {
        Text(`当前得分: ${this.score}`)
          .fontSize(20)
        Text(`最高分: ${this.highScore}`)
          .fontSize(20)
          .margin({ left: 20 })
      }
      .margin({ bottom: 10 })

      // 修改按钮布局
      Row() {
        if (!this.isPlaying && !this.isPaused) {
          Button('开始游戏')
            .width(100)
            .height(35)
            .fontSize(14)
            .margin(5)
            .onClick(() => {
              this.startGame();
            })
        } else if (this.isPlaying) {
          Button('暂停')
            .width(100)
            .height(35)
            .fontSize(14)
            .margin(5)
            .onClick(() => {
              this.pauseGame();
            })
        } else if (this.isPaused) {
          Button('继续')
            .width(100)
            .height(35)
            .fontSize(14)
            .margin(5)
            .onClick(() => {
              this.resumeGame();
            })
        }
        Button('重新开始')
          .width(100)
          .height(35)
          .fontSize(14)
          .margin(5)
          .onClick(() => {
            this.startGame();
          })
        Button('结束游戏')
          .width(100)
          .height(35)
          .fontSize(14)
          .margin(5)
          .onClick(() => {
            this.stopGame();
          })
      }
      .margin({ top: 10 })

      Stack() {
        Circle({ width: this.gridSize, height: this.gridSize })
          .fill(this.foodColor)
          // 使用固定颜色描边
          .stroke(Color.Gray)
          .strokeWidth(2)
          // 添加阴影效果模拟渐变
          .shadow({
            radius: 3,
            color: Color.White,
            offsetX: 1,
            offsetY: 1
          })
          .position({
            x: this.food[0] * this.gridSize,
            y: this.food[1] * this.gridSize
          })
        ForEach(this.snake, (segment: [number, number], index: number) => {
          if (index === 0) {
            Rect({ width: this.gridSize, height: this.gridSize })
              .fill(this.snakeHeadColor)
              .radius(5)
              .position({
                x: segment[0] * this.gridSize,
                y: segment[1] * this.gridSize
              })
          } else {
            // 每节蛇身使用食物颜色
            Circle({ width: this.gridSize, height: this.gridSize })
              .fill(this.foodColor)
              .position({
                x: segment[0] * this.gridSize,
                y: segment[1] * this.gridSize
              })
          }
        })
      }
      .width(this.gridSize * 12)
      .height(this.gridSize * 12)
      .border({ width: 1, color: Color.Black })
      .clip(true) // 添加裁剪确保内容不会超出边框
      .margin({ bottom: 10 })

      Column() {
        Button('上')
          .width(80)
          .height(50)
          .fontSize(18)
          .margin(5)
          .onClick(() => { this._moveDirection = 0; })

        Row() {
          Button('左')
            .width(80)
            .height(50)
            .fontSize(18)
            .margin(5)
            .onClick(() => { this._moveDirection = 2; })
          Button('右')
            .width(80)
            .height(50)
            .fontSize(18)
            .margin(5)
            .onClick(() => { this._moveDirection = 3; })
        }
        
        Button('下')
          .width(80)
          .height(50)
          .fontSize(18)
          .margin(5)
          .onClick(() => { this._moveDirection = 1; })
      }
      .margin({ top: 10 })

      Row() {
        Text('无敌模式:')
          .fontSize(18)
          .fontColor(this.isInvincible ? Color.Red : Color.Black)
          .margin({ right: 10 })
        Toggle({ type: ToggleType.Switch, isOn: this.isInvincible })
          .width(40)
          .height(24)
          .onChange((isOn: boolean) => {
            this.isInvincible = isOn;
          })
        Text(this.isInvincible ? '开启' : '关闭')
          .fontSize(18)
          .fontColor(this.isInvincible ? Color.Red : Color.Black)
          .margin({ left: 10 })
      }
      .margin({ top: 20 })
      .padding(10)
      .borderRadius(10)
      .backgroundColor('#f0f0f0')
      .margin({ top: 10 })
    }
    .width('100%')
    .height('100%')
    .backgroundColor('#E0F7FA')
    .onKeyEvent((event: KeyEvent) => {
      if (event.type === KeyType.Down) {
        switch (event.keyCode) {
          case 19: if (this._moveDirection !== 1) this._moveDirection = 0; break;
          case 20: if (this._moveDirection !== 0) this._moveDirection = 1; break;
          case 21: if (this._moveDirection !== 3) this._moveDirection = 2; break;
          case 22: if (this._moveDirection !== 2) this._moveDirection = 3; break;
        }
      }
    })
  }
}