鸿蒙HarmonyOS项目实战开发：井字过三关小游戏_基于harmonyos的井字棋游戏开发

最新推荐文章于 2024-10-17 16:11:40 发布

2401_84870988

最新推荐文章于 2024-10-17 16:11:40 发布

阅读量999

点赞数 29

分类专栏：程序员文章标签：鸿蒙面试学习

本文链接：https://blog.csdn.net/2401_84870988/article/details/138736766

版权

程序员专栏收录该内容

106 篇文章 0 订阅

订阅专栏

网上学习资料一大堆，但如果学到的知识不成体系，遇到问题时只是浅尝辄止，不再深入研究，那么很难做到真正的技术提升。

需要这份系统化的资料的朋友，可以戳这里获取

一个人可以走的很快，但一群人才能走的更远！不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人，都欢迎加入我们的的圈子（技术交流、学习资源、职场吐槽、大厂内推、面试辅导），让我们一起学习成长！

}
.height(‘80%’)

Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
Button(‘确定’).width(200).height(50).fontSize(30).onClick(() => {
//…
this.controller.close()
})
}.height(‘30%’)

}.width(‘100%’).height(‘80%’)
}.height(‘100%’).width(‘100%’)
}
}

点击游戏规则的弹窗由Text，Text，button组成，具体实现可以参考弹窗1，和源代码

2）棋盘界面

棋盘界面由状态栏（左上图标表示当前由X或者O执行，右上表示自己本局使用X或者O），九宫格棋盘（Grid组件绘制），button按钮组成。

build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
Row({ useAlign: HorizontalAlign.Start }) {
//左上图标
if (this.selfChess === EMPTY) {
Image(this.current_X).height(150).width(‘30%’)
} else if (this.curChess === CIRCLE) {
Image(this.current_O).height(150).width(‘30%’)
} else {
Image(this.current_X).height(150).width(‘30%’)
}
//填充空格
Text(“”).width(‘40%’)
//右上图标
if (this.selfChess === EMPTY) {
Image(this.whiteBg).height(150).width(‘30%’)
} else {
Image(this.selfChess === FORK ? this.self_X : this.self_O).height(150).width(‘30%’)
}
}.height(‘30%’)
Flex() {
//堆叠容器
Stack() {
//绘制九宫格
Grid() {
ForEach(this.gridVis, (item) => {
GridItem() {
//每个子格子当前需要填充的图片
if (item.value === FORK) {
Image(this.fork).backgroundColor(Color.White)
} else if (item.value === CIRCLE) {
Image(this.circle).backgroundColor(Color.White)
} else {
Image(this.whiteBg)
}
}.onClick(() => {
//点触格子触发事件
this.dealPoint(item)
})
}, item => item.id)
}.columnsTemplate(‘1fr 1fr 1fr’).rowsTemplate(‘1fr 1fr 1fr’).columnsGap(3).rowsGap(3).align(Alignment.Center).alignSelf(ItemAlign.Center).backgroundColor(‘#9F5F9F’)

//根据胜负状态显示图片
if (result === YOU_WIN) {
Image( $KaTeX parse error: Expected 'EOF', got '}' at position 49: \dots4).height(224) }̲ else if (resul\dots$ r(“app.media.game_fail”)).width(224).height(224)
} else if (result === TIE) {
Image($r(“app.media.game_tie”)).width(224).height(224)
}
}
}.height(‘50%’)
Row({ useAlign: HorizontalAlign.Center }) {
Button(‘重新开始’).width(200).height(50).fontSize(30).backgroundColor(‘#8E6B23’).onClick(() => {
this.initGame()
})
}.height(‘20%’)
}
}

3.设备认证

设备认证是依赖DeviceManager组件来实现的，详细代码参考源码RemoteDeviceModel.ets

1.创建DeviceManager实例

registerDeviceListCallback(callback) {
if (typeof (this.#deviceManager) === ‘undefined’) {
deviceManager.createDeviceManager(‘com.example.tictactoegame’, (error, value) => {
if (error) return
this.#deviceManager = value;
this.registerDeviceListCallback_(callback);
});
} else {
this.registerDeviceListCallback_(callback);
}
}

2.查询可信设备列表

var list = this.#deviceManager.getTrustedDeviceListSync();
if (typeof (list) != ‘undefined’ && typeof (list.length) != ‘undefined’) {
this.deviceList = list;
}

3.注册设备上下线监听

this.#deviceManager.on(‘deviceStateChange’, (data) => {
switch (data.action) {
case 0:
this.deviceList[this.deviceList.length] = data.device;
this.callback();
if (this.authCallback != null) {
this.authCallback();
this.authCallback = null;
}
break;
case 2:
if (this.deviceList.length > 0) {
for (var i = 0; i < this.deviceList.length; i++) {
if (this.deviceList[i].deviceId === data.device.deviceId) {
this.deviceList[i] = data.device;
break;
}
}
}
this.callback();
break;
case 1:
if (this.deviceList.length > 0) {
var list = [];
for (var i = 0; i < this.deviceList.length; i++) {
if (this.deviceList[i].deviceId != data.device.deviceId) {
list[i] = data.device;
}
}
this.deviceList = list;
}
this.callback();
break;
default:
break;
}
});

4.设备发现

this.#deviceManager.on(‘deviceFound’, (data) => {
for (let i = 0; i < this.discoverList.length; i++) {
if (that.discoverList[i].deviceId === data.device.deviceId) {
return;
}
}
this.discoverList[this.discoverList.length] = data.device;
this.callback();
});

5.设备认证

authDevice(deviceInfo, callback){
let extraInfo = {
“targetPkgName”: ‘com.example.tictactoegame’,
“appName”: ‘com.example.tictactoegame’,
“appDescription”: ‘com.example.tictactoegame’,
“business”: ‘0’
};
let authParam = {
“authType”: 1,
“appIcon”: ‘’,
“appThumbnail”: ‘’,
“extraInfo”: extraInfo
};
this.#deviceManager.authenticateDevice(deviceInfo, authParam, (err, data) => {
if (err) {
this.authCallback = null;
} else {
this.authCallback = callback;
}
});
}

4.数据管理

分布式数据管理依赖@ohos.data.distributedData模块实现，详细参考源码RemoteDataManager.ets

1.导入该模块

import factory from ‘@ohos.data.distributedData’;

2.创建KVManager实例，用于管理数据库对象

registerDataListCallback(callback) {
let that = this
if (this.kvManager == null) {
try {
const config = {
userInfo: {
userId: ‘0’,
userType: 0
},
bundleName: ‘com.example.tictactoegame’
}
factory.createKVManager(config).then((manager) => {
that.kvManager = manager
that.registerDataListCallback_(callback)
}).catch((err) => {
})
} catch (e) {
}
} else {
this.registerDataListCallback_(callback)
}
}

3.创建并获取KVStore数据库

registerDataListCallback_(callback) {
let that = this
if (that.kvManager == null) {
callback()
return
}
if (that.kvStore == null) {
try {
let options =
{
createIfMissing: true,
encrypt: false,
backup: false,
autoSync: true,
kvStoreType: 1,
securityLevel: 3
}
this.kvManager.getKVStore(this.STORE_ID, options).then((store) => {
that.kvStore = store
that.registerDataListCallback(callback)
}).catch((err) => {
})
} catch (e) {
}
} else {
this.registerDataListCallback(callback)
}
}

4.订阅指定类型的数据变更通知

registerDataListCallback(callback) {
let that = this
if (that.kvManager == null) {
callback()
return
}
this.kvStore.on(‘dataChange’, 1, function(data) {
if (data) {
that.arr = data.updateEntries
callback()
}
})
}

5.添加指定类型键值对到数据库

dataChange(key, value) {
let that = this
try {
that.kvStore.put(JSON.stringify(key), JSON.stringify(value)).then((data) => {
}).catch((err) => {
prompt.showToast({message:‘put err:’+JSON.stringify(value)})
})

} catch (e) {
}
}

5.远程拉起设备app

使用FeatureAbility模块的startAbility接口拉起远程设备app

startAbilityContinuation(deviceId) {
let wantValue = {
bundleName: ‘com.example.tictactoegame’,
abilityName: ‘com.example.tictactoegame.MainAbility’,
deviceId: deviceId,
parameters: {
uri: ‘pages/Fight’
}
};
featureAbility.startAbility({ want: wantValue }).then(() => {
router.replace({ uri: ‘pages/Fight’ })
});
}

6.棋局胜负判定

对于棋盘中的任一个格子只存在已落子和未落子两种状态，我们把这两种状态定义为1和0，则九宫格可以看成是一个只有9位的二进制数，胜利状态有八种情况如下，详细代码参考源码Chess.ets：

0b111000000
0b100100100
0b100010001
0b010010010
0b001001001
0b000111000
0b000000111
0b001010100

胜负判定实现如下

isWin() {
let x = this.result_X
let o = this.result_O
if (448 == (x & 448) || 292 == (x & 292) || 273 == (x & 273) || 146 == (x & 146) || 73 == (x & 73) || 56 == (x & 56) || 7 == (x & 7) || 84 == (x & 84)){
this.allIsTrue()
return FORK
}
if (448 == (o & 448) || 292 == (o & 292) || 273 == (o & 273) || 146 == (o & 146) || 73 == (o & 73) || 56 == (o & 56) || 7 == (o & 7) || 84 == (o & 84)) {
this.allIsTrue()
return CIRCLE
}
let res = 0;
for (let i = 0; i < 9; i++) {
if (this.used[i] == false) {
res = 1
break
}
}
if (res === 1) {
return CONTINUE
}
return EMPTY
}