了解更多开源请访问:开源基础软件社区https://ost.51cto.com。需求分析本章我们将实现一个TCP聊天功能,连接指定IP和端口,显示接收到的内容,并具有发送功能。.接口说明Socket连接主要由socket模块提供。具体接口如下表所示。接口名称功能说明constructUDPSocketInstance()创建一个UDPSocket对象。constructTCPSocketInstance()创建一个TCPSocket对象。bind()绑定IP地址和端口。send()发送数据。close()关闭连接。getState()获取套接字状态。connect()连接指定IP地址和端口(仅TCP支持)getRemoteAddress()获取对端Socket地址(仅TCP支持,需要先调用connect方法)on(type:'message')订阅Socket连接的接收消息事件。off(type:'message')取消订阅Socket连接的接收消息事件。on(type:'close')订阅Socket连接的关闭事件。off(type:'close')取消订阅Socket连接的关闭事件。on(type:'error')订阅Socket连接的Error事件。off(type:'error')取消订阅Socket连接的错误事件。on(type:'listening')订阅UDPSocket连接包消息事件(仅UDP支持)。off(type:'listening')取消订阅UDPSocket连接包消息事件(仅UDP支持)。on(type:'connect')订阅TCPSocket的连接事件(仅TCP支持)。off(type:'connect')取消订阅TCPSocket的连接事件(仅TCP支持)。基本套路(参考我之前的家庭医生终端系统)。从'@ohos.net.socket'导入套接字;让tcp=socket.constructTCPSocketInstance();tcp.bind({地址:'0.0.0.0',端口:12121,系列:1},错误=>{如果(错误){console.log('bindfail');return;}console.log('bindsuccess');})tcp.on('message',value=>{console.log("onmessage,message:"+value.message+",remoteInfo:"+value.remoteInfo)letda=resolveArrayBuffer(value.message);letdat_buff=String(da);//在这里处理接收到的数据});//将接收到的数据进行转换数据到文本函数resolveArrayBuffer(message){if(messageinstanceofArrayBuffer){letdataView=newDataView(message)letstr=""for(leti=0;i{console.log('连接成功');flag=true;tcp.send({data:Con_buff},err=>{if(err){console.log('发送失败');返回;}console.log('发送成功');})}).catch(err=>{console.log('连接失败');});}elseif(flag==true){tcp.send({data:Con_buff},err=>{if(err){console.log('发送失败');return;}console.log('发送成功');})}}2.AppStorage与组件同步在管理组件拥有的状态中,已经定义了如何将组件的状态变量与父组件或祖先组件中用@State修饰的状态变量进行同步,主要包括@Prop、@Link、@Consume这一章定义组件变量如何与AppStorage同步,主要提供@StorageLink和@StorageProp装饰器。@StorageLink装饰器组件通过使用@StorageLink(key)装饰的状态变量与AppStorage建立双向数据绑定,key为AppStorage中的属性键值。在创建包含@StorageLink的状态变量的组件时,该状态变量的值将使用AppStorage中的值进行初始化。在UI组件中对@StorageLink的状态变量所做的更改将同步到AppStorage,并从AppStorage同步到任何其他绑定实例,例如PersistentStorage或其他绑定的UI组件。@StorageProp装饰器组件将通过使用@StorageProp(key)装饰的状态变量与AppStorage建立单向数据绑定,key标识AppStorage中的属性键值。当创建包含来自@StoageProp的状态变量的组件时,该状态变量的值将使用来自AppStorage的值进行初始化。AppStorage中属性值的更改会导致绑定的UI组件的状态更新。letvarA=AppStorage.Link('varA')letenvLang=AppStorage.Prop('languageCode')@Entry@ComponentstructComponentA{@StorageLink('varA')varA:number=2@StorageProp('languageCode')lang:字符串='en'privatelabel:string='count'privateaboutToAppear(){this.label=(this.lang==='zh')?'count':'Count'}build(){Row({space:20}){Button(`${this.label}:${this.varA}`).onClick(()=>{AppStorage.Set('varA',AppStorage.Get('varA')+1)})Button(`lang:${this.lang}`).onClick(()=>{if(this.lang==='zh'){AppStorage.Set('languageCode','en')}else{AppStorage.Set('languageCode','zh')}this.label=(this.lang==='zh')?'number':'Count'})}}}即通过AppStorage.Link和@StorageLink,可以实现Text组件和图片组件(等等)的外部动态刷新,这方便我们在全局调用时更新数据。3.UI设计本项目的基本内容可以在预览器中看到,所以先简单设计一下预览器中的UI1。基本界面就不多解释UI了,直接放成品,而我的源码都存在Gitee仓库上,需要的可以自行下载,重点放在程序部分。2、接口绑定首先是接收端的变量绑定。让Rc_message=AppStorage.Link('Rc_message')@StorageLink('Rc_message')Rc_message:String='Messagereceived'Text(`${this.Rc_message}`).width("98%").height("35%").borderStyle(BorderStyle.Solid).borderWidth(8).borderColor(0xAFEEEE).borderRadius(20).fontSize(25)3.TCP回调设置tcp.on('message',value=>{console.log("onmessage,message:"+value.message+",remoteInfo:"+value.remoteInfo)letda=resolveArrayBuffer(value.message);letdat_buff=String(da);AppStorage.Set('Rc_message',dat_buff);//AppStorage.Set('ID_1_stata','rgba(0,109,229,0.95)');});这部分实现了聊天框内的文字刷新。4.IP设置这里我使用的是和州的TCP工具[wstool(luatos.com)](。这里修改IP和端口。5.在模拟器中打开远程模拟器如上。4.实际测试使用模拟器发送.如果TCP工具有接收内容,此时回复,APP端可以接收并显示(目前可能只支持英文接收显示)。5.TCP助手动态图展示如下:更多开源信息请访问:开源基础软件社区https://ost.51cto.com。