devbox
天景科技苑
这个屌丝很懒，什么也没留下！
关注作者
热门标签
热门文章
当前位置:   article > 正文

鸿蒙（OpenHarmony）开发实战：WiFi扫码自动配网_鸿蒙wifi配网

作者：天景科技苑 | 2024-08-08 23:20:39

赞

踩

鸿蒙wifi配网

背景

随着移动互联网的发展,WiFi已成为人们生活中不可或缺的网络接入方式。但在连接WiFi时,用户常需要手动输入一个复杂的密钥,这带来了一定的不便。针对这一痛点,利用QR码连接WiFi的方案应运而生。QR码连接WiFi的工作流程是:商家或公共场所提供含有WiFi密钥的QR码,用户只需使用手机扫一扫即可读取密钥信息并连接WiFi,无需手动输入，这种连接方式大大简化了用户的操作。随着智能手机摄像头识别能力的提升,以及用户需求的引领,利用QR码连接WiFi的方式未来还将得到更广泛的应用,为用户提供更稳定便捷的上网体验。它利用了移动互联网时代的技术优势,解决了传统WiFi连接中的痛点,是一种值得推广的网络连接方式。

效果

页面截图

配网连接中配网连接成功配网连接失败

图片

图片

图片

优势

使用QR码连接WiFi具有以下优势:

  1. 提高了连接成功率,避免因手动输入密钥错误导致的连接失败问题。

  2. 加快了连接速度,扫码相对于手动输入更高效方便。

  3. 提升了用户体验,无需记忆和输入复杂密钥,操作更人性化。

  4. 方便密钥分享和更改,通过更新QR码即可实现。

  5. 在一些需要频繁连接不同WiFi的场景下尤其便利,如酒店、餐厅、机场等。

  6. 一些App可以自动识别WiFi二维码,实现零点击连接。

开发与实现

开发环境

开发平台：windows10、DevEco Studio 3.1 Release 

系统：OpenHarmony 3.2 Release，API9(Full SDK 3.2.11.9) 

设备：SD100（工业平板设备、平台：RK3568、屏幕像素：1920 * 1200）

项目开发

▍需求分析

1、支持相机扫码，并可以解析二维码信息；

2、获取二维码中的wifi连接信息，自动完成网络连接；

3、网络连接成功，则提示用户成功；

4、网络连接失败，则提示用户失败，可以重新连接；

5、UI界面符合OpenHarmony设计原则，应用界面简洁高效、自然流畅。

▍项目流程图

图片

▍界面

说明：从需求上分析，可以有两个界面，一是扫码界面、二是wifi连接等待和显示结果界面。

图片

▍详细开发

一、创建项目

说明：通过DevEco Studio创建一个OpenHarmony的项目。

图片

图片

二、申请权限

说明：在应用中涉及到使用相机和wifi的操作，需要动态申请一些必要的权限，我们可以在 EntryAbility.ts中实现，EntryAbility.ts继承UIAbility，用于管理应用的生面周期，在OnCreate是实例冷启动时触发，在此函数中实现权限申请。具体代码如下：

  1. let permissionList: Array<Permissions> = [
  2.   "ohos.permission.GET_WIFI_INFO",
  3.   "ohos.permission.INTERNET",
  4.   'ohos.permission.CAMERA',
  5.   'ohos.permission.READ_MEDIA',
  6.   'ohos.permission.WRITE_MEDIA',
  7.   'ohos.permission.MEDIA_LOCATION',
  8.   'ohos.permission.LOCATION',
  9.   'ohos.permission.APPROXIMATELY_LOCATION'
  10. ]
  11.  
  12. onCreate(want, launchParam) {
  13.   hilog.info(0x0000, 'testTag', '%{public}s', 'Ability onCreate');
  14.   this.requestPermissions()
  15. }
  16.  
  17. private requestPermissions() {
  18.   let AtManager = abilityAccessCtrl.createAtManager()
  19.   AtManager.requestPermissionsFromUser(this.context, permissionList).then(async (data) => {
  20.     Logger.info(`${TAG} data permissions: ${JSON.stringify(data.permissions)}`)
  21.     Logger.info(`${TAG} data authResult: ${JSON.stringify(data.authResults)}`)
  22.     // 判断授权是否完成
  23.     let resultCount: number = 0
  24.     for (let result of data.authResults) {
  25.       if (result === 0) {
  26.         resultCount += 1
  27.       }
  28.     }
  29.     let permissionResult : boolean = false
  30.     if (resultCount === permissionList.length) {
  31.       permissionResult = true
  32.     }
  33.     AppStorage.SetOrCreate(KEY_IS_PERMISSION, true)
  34.     this.sendPermissionResult(permissionResult)
  35.   })
  36. }
  37.  
  38. sendPermissionResult(result : boolean) {
  39.   let eventData: emitter.EventData = {
  40.     data: {
  41.       "result": result
  42.     }
  43.   };
  44.  
  45.   let innerEvent: emitter.InnerEvent = {
  46.     eventId: EVENT_PERMISSION_ID,
  47.     priority: emitter.EventPriority.HIGH
  48.   };
  49.  
  50.   emitter.emit(innerEvent, eventData);
  51.   Logger.info(`${TAG} sendPermissionResult`)
  52. }
  53.  
  54. onDestroy() {
  55.   Logger.info(`${TAG} onDestroy`)
  56.   emitter.off(EVENT_PERMISSION_ID)
  57. }

代码解析

1、在应用中使用到相机和操作wifi需要根据需要动态申请相关权限，具体的权限用途可以查看：应用权限列表

2、应用动态授权需要使用到@ohos.abilityAccessCtrl (程序访问控制管理)，通过abilityAccessCtrl.createAtManager()获取到访问控制对象 AtManager。

3、通过AtManager.requestPermissionsFromUser() 拉起请求用户授权弹窗，由用户动态授权。

4、授权成功后通过Emitter（@ohos.events.emitter）向主界面发送授权结果。

5、在onDestroy()应用退出函数中取消Emitter事件订阅。

三、首页

说明：首页即为扫码页面，用于识别二维码获取二维码信息，为网络连接准备。所以此页面有有个功能，加载相机和识别二维码。

媒体相机

相机的启动借鉴社区提供的代码案例：二维码扫码

  • 相机功能在CameraServices中，源码参考CameraServices.ets

  • 获取相机实例使用到媒体相机接口@ohos.multimedia.camera (相机管理)。

  • 首先使用camera.getCameraManager方法获取相机管理器，然后使用cameraManager.getSupportedCameras方法得到设备列表, 这里默认点亮列表中的首个相机；

  • 打开相机：使用 cameraManager.createCameraInput方法创建CameraInput实例，调用open方法打开相机；

  • 获取相机输出流：使用getSupportedOutputCapability查询相机设备在模式下支持的输出能力，然后使用createPreviewOutput创建相机输出流。

  • 获取拍照输出流，使用@ohos.multimedia.image接口的 createImageReceiver 方法创建ImageReceiver实例，并通过其getReceivingS_urfaceId()获取S_urfaceId，通过CameraManager.createPhotoOutput()函数构建拍照输出流，并将imageReceive 的 S_urfaceId与其建立绑定关系。

  • 获取相片输出：首先使用createCaptureSession方法创建捕获会话的实例，然后使用beginConfig方法配置会话，接下来使用addInput方法添加一个摄像头输入流，使用addOutput添加一个摄像头和相机照片的输出流，使用commitConfig方法提交会话配置后，调用会话的start方法开始捕获相片输出。

  • 这里也可以使用相机预览流获取图像数据，但在界面上需要预览，所以这里需要构建两条预览流，一条预览流用于显示，在XComponent组件中渲染，另外一条预览流用于获取头像数据用于解析，根据实践发现，开启两条预览流后，相机帧率为：7fsp，表现为预览卡顿，所以为提升预览效果，使用定时拍照的方式获取图像数据。

  • 获取图像的在SaveCameraAsset.ets中实现，扫码页面启动后每间隔1.5s调用PhotoOutput.capture()实现拍照，通过imageReceiver.on('imageArrival')接收图片，使用imageReceiver.readNextImage()获取图像对象，通过Image.getComponent()获取图像缓存数据。

具体实现代码：

CameraService
  1. import camera from '@ohos.multimedia.camera';
  2. import image from '@ohos.multimedia.image';
  3. import SaveCameraAsset from './SaveCameraAsset'
  4. import { QRCodeScanConst, SCAN_TYPE } from './QRCodeScanConst'
  5. import { Logger } from '@ohos/common'
  6. import common from '@ohos.app.ability.common'
  7. let TAG: string = 'CameraService'
  8. /**
  9.  * 拍照保存图片回调
  10.  */
  11. export interface FunctionCallBack {
  12.   onCaptureSuccess(thumbnail: image.PixelMap, resourceUri: string): void
  13.   onCaptureFailure(): void
  14.   onRecordSuccess(thumbnail: image.PixelMap): void
  15.   onRecordFailure(): void
  16.   /**
  17.    * 缩略图
  18.    */
  19.   thumbnail(thumbnail: image.PixelMap): void
  20.   /**
  21.    * AI 识别结果
  22.    * @param result 识别结果
  23.    */
  24.   aiResult(result: string): void
  25. }
  26. export interface PreviewCallBack {
  27.   onFrameStart()
  28.   onFrameEnd()
  29. }
  30. export interface MetaDataCallBack {
  31.   onRect(rect: camera.Rect)
  32. }
  33. export default class CameraService {
  34.   private static instance: CameraService = null
  35.   private mCameraManager: camera.CameraManager = null
  36.   private mCameraCount: number = 0 // 相机总数
  37.   private mCameraMap: Map<string, Array<camera.CameraDevice>> = new Map()
  38.   private mCurCameraDevice: camera.CameraDevice = null
  39.   private mCameraInput: camera.CameraInput = null
  40.   private mPreviewOutput: camera.PreviewOutput = null
  41.   private mPreviewOutputByImage: camera.PreviewOutput = null
  42.   private mPhotoOutput: camera.PhotoOutput = null
  43.   private mSaveCameraAsset: SaveCameraAsset = new SaveCameraAsset()
  44.   private mCaptureSession: camera.CaptureSession
  45.   private mMetadataOutput: camera.MetadataOutput
  46.   private constructor() {
  47.   }
  48.   /**
  49.    * 单例
  50.    */
  51.   public static getInstance(): CameraService {
  52.     if (this.instance === null) {
  53.       this.instance = new CameraService()
  54.     }
  55.  
  56.     return this.instance
  57.   }
  58.   /**
  59.    * 初始化
  60.    */
  61.   public async initCamera(): Promise<number> {
  62.     Logger.info(`${TAG} initCamera`)
  63.     if (this.mCameraManager === null) {
  64.       this.mCameraManager = camera.getCameraManager(AppStorage.Get('context'))
  65.       // 注册监听相机状态变化
  66.       this.mCameraManager.on('cameraStatus', (cameraStatusInfo) => {
  67.         Logger.info(`${TAG} camera Status: ${JSON.stringify(cameraStatusInfo)}`)
  68.       })
  69.       // 获取相机列表
  70.       let cameras: Array<camera.CameraDevice> = this.mCameraManager.getSupportedCameras()
  71.       if (cameras) {
  72.         this.mCameraCount = cameras.length
  73.         Logger.info(`${TAG} mCameraCount: ${this.mCameraCount}`)
  74.         if (this.mCameraCount === 0) {
  75.           return this.mCameraCount
  76.         }
  77.         for (let i = 0; i < cameras.length; i++) {
  78.           Logger.info(`${TAG} --------------Camera Info-------------`)
  79.           const tempCameraId: string = cameras[i].cameraId
  80.           Logger.info(`${TAG} camera_id: ${tempCameraId}`)
  81.           Logger.info(`${TAG} cameraPosition: ${cameras[i].cameraPosition}`)
  82.           Logger.info(`${TAG} cameraType: ${cameras[i].cameraType}`)
  83.           const connectionType = cameras[i].connectionType
  84.           Logger.info(`${TAG} connectionType: ${connectionType}`)
  85.           // 判断本地相机还是远程相机
  86.           if (connectionType === camera.ConnectionType.CAMERA_CONNECTION_BUILT_IN) {
  87.             // 本地相机
  88.             this.displayCameraDevice(QRCodeScanConst.LOCAL_DEVICE_ID, cameras[i])
  89.           } else if (connectionType === camera.ConnectionType.CAMERA_CONNECTION_REMOTE) {
  90.             // 远程相机 相机ID格式 ：deviceID__Camera_cameraID 例如：3c8e510a1d0807ea51c2e893029a30816ed940bf848754749f427724e846fab7__Camera_lcam001
  91.             const cameraKey: string = tempCameraId.split('__Camera_')[0]
  92.             Logger.info(`${TAG} cameraKey: ${cameraKey}`)
  93.             this.displayCameraDevice(cameraKey, cameras[i])
  94.           }
  95.         }
  96.         // todo test 选择首个相机
  97.         this.mCurCameraDevice = cameras[0]
  98.         Logger.info(`${TAG} mCurCameraDevice: ${this.mCurCameraDevice.cameraId}`)
  99.       }
  100.     }
  101.     return this.mCameraCount
  102.   }
  103.   /**
  104.    * 处理相机设备
  105.    * @param key
  106.    * @param cameraDevice
  107.    */
  108.   private displayCameraDevice(key: string, cameraDevice: camera.CameraDevice) {
  109.     Logger.info(`${TAG} displayCameraDevice ${key}`)
  110.     if (this.mCameraMap.has(key) && this.mCameraMap.get(key)?.length > 0) {
  111.       Logger.info(`${TAG} displayCameraDevice has mCameraMap`)
  112.       // 判断相机列表中是否已经存在此相机
  113.       let isExist: boolean = false
  114.       for (let item of this.mCameraMap.get(key)) {
  115.         if (item.cameraId === cameraDevice.cameraId) {
  116.           isExist = true
  117.           break
  118.         }
  119.       }
  120.       // 添加列表中没有的相机
  121.       if (!isExist) {
  122.         Logger.info(`${TAG} displayCameraDevice not exist , push ${cameraDevice.cameraId}`)
  123.         this.mCameraMap.get(key).push(cameraDevice)
  124.       } else {
  125.         Logger.info(`${TAG} displayCameraDevice has existed`)
  126.       }
  127.     } else {
  128.       let cameras: Array<camera.CameraDevice> = []
  129.       Logger.info(`${TAG} displayCameraDevice push ${cameraDevice.cameraId}`)
  130.       cameras.push(cameraDevice)
  131.       this.mCameraMap.set(key, cameras)
  132.     }
  133.   }
  134.  
  135.  /**
  136.    * 创建相机输入流
  137.    * @param cameraIndex 相机下标
  138.    * @param deviceId 设备ID
  139.    */
  140.   public async createCameraInput(cameraIndex?: number, deviceId?: string) {
  141.     Logger.info(`${TAG} createCameraInput`)
  142.     if (this.mCameraManager === null) {
  143.       Logger.error(`${TAG} mCameraManager is null`)
  144.       return
  145.     }
  146.     if (this.mCameraCount <= 0) {
  147.       Logger.error(`${TAG} not camera device`)
  148.       return
  149.     }
  150.     if (this.mCameraInput) {
  151.       this.mCameraInput.close()
  152.     }
  153.     if (deviceId && this.mCameraMap.has(deviceId)) {
  154.       if (cameraIndex < this.mCameraMap.get(deviceId)?.length) {
  155.         this.mCurCameraDevice = this.mCameraMap.get(deviceId)[cameraIndex]
  156.       } else {
  157.         this.mCurCameraDevice = this.mCameraMap.get(deviceId)[0]
  158.       }
  159.     }
  160.     Logger.info(`${TAG} mCurCameraDevice: ${this.mCurCameraDevice?.cameraId}`)
  161.     try {
  162.       this.mCameraInput = this.mCameraManager.createCameraInput(this.mCurCameraDevice)
  163.       Logger.info(`${TAG} mCameraInput: ${JSON.stringify(this.mCameraInput)}`)
  164.       this.mCameraInput.on('error', this.mCurCameraDevice, (error) => {
  165.         Logger.error(`${TAG} CameraInput error: ${JSON.stringify(error)}`)
  166.       })
  167.       await this.mCameraInput.open()
  168.     } catch (err) {
  169.       if (err) {
  170.         Logger.error(`${TAG} failed to createCameraInput`)
  171.       }
  172.     }
  173.   }
  174.   /**
  175.    * 释放相机输入流
  176.    */
  177.   public async releaseCameraInput() {
  178.     Logger.info(`${TAG} releaseCameraInput`)
  179.     if (this.mCameraInput) {
  180.       try {
  181.         await this.mCameraInput.close()
  182.         Logger.info(`${TAG} releaseCameraInput closed`)
  183.       } catch (err) {
  184.         Logger.error(`${TAG} releaseCameraInput ${err}}`)
  185.       }
  186.       this.mCameraInput = null
  187.     }
  188.   }
  189.  
  190.   /**
  191.    * 创建相机预览输出流
  192.    */
  193.   public async createPreviewOutput(s_urfaceId: string, callback?: PreviewCallBack) {
  194.     Logger.info(`${TAG} createPreviewOutput s_urfaceId ${s_urfaceId}`)
  195.     if (this.mCameraManager === null) {
  196.       Logger.error(`${TAG} createPreviewOutput mCameraManager is null`)
  197.       return
  198.     }
  199.     // 获取当前相机设备支持的输出能力
  200.     let cameraOutputCap = this.mCameraManager.getSupportedOutputCapability(this.mCurCameraDevice)
  201.     if (!cameraOutputCap) {
  202.       Logger.error(`${TAG} createPreviewOutput getSupportedOutputCapability error}`)
  203.       return
  204.  
  205.  }
  206.     Logger.info(`${TAG} createPreviewOutput cameraOutputCap ${JSON.stringify(cameraOutputCap)}`)
  207.     let previewProfilesArray = cameraOutputCap.previewProfiles
  208.     let previewProfiles: camera.Profile
  209.     if (!previewProfilesArray || previewProfilesArray.length <= 0) {
  210.       Logger.error(`${TAG} createPreviewOutput previewProfilesArray error}`)
  211.       previewProfiles = {
  212.         format: 1,
  213.         size: {
  214.           width: QRCodeScanConst.DEFAULT_WIDTH,
  215.           height: QRCodeScanConst.DEFAULT_HEIGHT
  216.         }
  217.       }
  218.     } else {
  219.       Logger.info(`${TAG} createPreviewOutput previewProfile length ${previewProfilesArray.length}`)
  220.       previewProfiles = previewProfilesArray[0]
  221.     }
  222.     Logger.info(`${TAG} createPreviewOutput previewProfile[0] ${JSON.stringify(previewProfiles)}`)
  223.     try {
  224.       this.mPreviewOutput = this.mCameraManager.createPreviewOutput(previewProfiles, s_urfaceId)
  225.       Logger.info(`${TAG} createPreviewOutput success`)
  226.       // 监听预览帧开始
  227.       this.mPreviewOutput.on('frameStart', () => {
  228.         Logger.info(`${TAG} createPreviewOutput camera frame Start`)
  229.         if (callback) {
  230.           callback.onFrameStart()
  231.         }
  232.       })
  233.       this.mPreviewOutput.on('frameEnd', () => {
  234.         Logger.info(`${TAG} createPreviewOutput camera frame End`)
  235.         if (callback) {
  236.           callback.onFrameEnd()
  237.         }
  238.       })
  239.       this.mPreviewOutput.on('error', (error) => {
  240.         Logger.error(`${TAG} createPreviewOutput error: ${error}`)
  241.       })
  242.     } catch (err) {
  243.       Logger.error(`${TAG} failed to createPreviewOutput ${err}`)
  244.     }
  245.   }
  246.   /**
  247.    *  释放预览输出流
  248.    */
  249.   public async releasePreviewOutput() {
  250.     Logger.info(`${TAG} releaseCamera PreviewOutput`)
  251.     if (this.mPreviewOutput) {
  252.       await this.mPreviewOutput.release()
  253.       Logger.info(`${TAG} releaseCamera PreviewOutput release`)
  254.       this.mPreviewOutput = null
  255.     }
  256.   }
  257.   /**
  258.    * 创建拍照输出流
  259.    */
  260.   public async createPhotoOutput(functionCallback: FunctionCallBack) {
  261.     Logger.info(`${TAG} createPhotoOutput`)
  262.     if (!this.mCameraManager) {
  263.       Logger.error(`${TAG} createPhotoOutput mCameraManager is null`)
  264.       return
  265.     }
  266.     // 通过宽、高、图片格式、容量创建ImageReceiver实例
  267.     const receiver: image.ImageReceiver = image.createImageReceiver(QRCodeScanConst.DEFAULT_WIDTH, QRCodeScanConst.DEFAULT_HEIGHT, image.ImageFormat.JPEG, 8)
  268.     const imageS_urfaceId: string = await receiver.getReceivingS_urfaceId()
  269.     Logger.info(`${TAG} createPhotoOutput imageS_urfaceId: ${imageS_urfaceId}`)
  270.     let cameraOutputCap = this.mCameraManager.getSupportedOutputCapability(this.mCurCameraDevice)
  271.     Logger.info(`${TAG} createPhotoOutput cameraOutputCap ${cameraOutputCap}`)
  272.     if (!cameraOutputCap) {
  273.       Logger.error(`${TAG} createPhotoOutput getSupportedOutputCapability error}`)
  274.       return
  275.     }
  276.  
  277.  let photoProfilesArray = cameraOutputCap.photoProfiles
  278.     let photoProfiles: camera.Profile
  279.     if (!photoProfilesArray || photoProfilesArray.length <= 0) {
  280.       // 使用自定义的配置
  281.       photoProfiles = {
  282.         format: camera.CameraFormat.CAMERA_FORMAT_JPEG,
  283.         size: {
  284.           width: QRCodeScanConst.DEFAULT_WIDTH,
  285.           height: QRCodeScanConst.DEFAULT_HEIGHT
  286.         }
  287.       }
  288.     } else {
  289.       Logger.info(`${TAG} createPhotoOutput photoProfile length ${photoProfilesArray.length}`)
  290.       photoProfiles = photoProfilesArray[0]
  291.     }
  292.     Logger.info(`${TAG} createPhotoOutput photoProfile ${JSON.stringify(photoProfiles)}`)
  293.     try {
  294.       this.mPhotoOutput = this.mCameraManager.createPhotoOutput(photoProfiles, imageS_urfaceId)
  295.       Logger.info(`${TAG} createPhotoOutput mPhotoOutput success`)
  296.       // 保存图片
  297.       this.mSaveCameraAsset.saveImage(receiver, functionCallback)
  298.     } catch (err) {
  299.       Logger.error(`${TAG} createPhotoOutput failed to createPhotoOutput ${err}`)
  300.     }
  301.   }
  302.   /**
  303.    * 释放拍照输出流
  304.    */
  305.   public async releasePhotoOutput() {
  306.     Logger.info(`${TAG} releaseCamera PhotoOutput`)
  307.     if (this.mPhotoOutput) {
  308.       await this.mPhotoOutput.release()
  309.       Logger.info(`${TAG} releaseCamera PhotoOutput release`)
  310.       this.mPhotoOutput = null
  311.     }
  312.   }
  313.   public async createSession() {
  314.     Logger.info(`${TAG} createSession`)
  315.     this.mCaptureSession = await this.mCameraManager.createCaptureSession()
  316.     Logger.info(`${TAG} createSession mCaptureSession ${this.mCaptureSession}`)
  317.     this.mCaptureSession.on('error', (error) => {
  318.       Logger.error(`${TAG} CaptureSession error ${JSON.stringify(error)}`)
  319.     })
  320.     try {
  321.       this.mCaptureSession?.beginConfig()
  322.       this.mCaptureSession?.addInput(this.mCameraInput)
  323.  
  324.       if (this.mPreviewOutputByImage != null) {
  325.         Logger.info(`${TAG} createSession addOutput PreviewOutputByImage`)
  326.         this.mCaptureSession?.addOutput(this.mPreviewOutputByImage)
  327.       }
  328.  
  329.       if (this.mPreviewOutput != null) {
  330.         Logger.info(`${TAG} createSession addOutput PreviewOutput`)
  331.         this.mCaptureSession?.addOutput(this.mPreviewOutput)
  332.       }
  333.       if (this.mPhotoOutput != null) {
  334.         Logger.info(`${TAG} createSession addOutput PhotoOutput`)
  335.         this.mCaptureSession?.addOutput(this.mPhotoOutput)
  336.       }
  337.       if (this.mMetadataOutput != null) {
  338.         Logger.info(`${TAG} createSession addOutput mMetadataOutput`)
  339.  
  340.   this.mCaptureSession?.addOutput(this.mMetadataOutput)
  341.       }
  342.     } catch (err) {
  343.       if (err) {
  344.         Logger.error(`${TAG} createSession beginConfig fail err:${JSON.stringify(err)}`)
  345.       }
  346.     }
  347.     try {
  348.       await this.mCaptureSession?.commitConfig()
  349.     } catch (err) {
  350.       if (err) {
  351.         Logger.error(`${TAG} createSession commitConfig fail err:${JSON.stringify(err)}`)
  352.       }
  353.     }
  354.     try {
  355.       await this.mCaptureSession?.start()
  356.     } catch (err) {
  357.       if (err) {
  358.         Logger.error(`${TAG} createSession start fail err:${JSON.stringify(err)}`)
  359.       }
  360.     }
  361.     if (this.mMetadataOutput) {
  362.       this.mMetadataOutput.start().then(() => {
  363.         Logger.info(`${TAG} Callback returned with metadataOutput started`)
  364.       }).catch((err) => {
  365.         Logger.error(`${TAG} Failed to metadataOutput start ${err.code}`)
  366.       })
  367.     }
  368.     Logger.info(`${TAG} createSession mCaptureSession start`)
  369.   }
  370.   public async releaseSession() {
  371.     Logger.info(`${TAG} releaseCamera Session`)
  372.     if (this.mCaptureSession) {
  373.       await this.mCaptureSession.release()
  374.       Logger.info(`${TAG} releaseCamera Session release`)
  375.       this.mCaptureSession = null
  376.     }
  377.   }
  378.   /**
  379.    * 拍照
  380.    */
  381.   public async takePicture() {
  382.     Logger.info(`${TAG} takePicture`)
  383.     if (!this.mCaptureSession) {
  384.       Logger.info(`${TAG} takePicture session is release`)
  385.       return
  386.     }
  387.     if (!this.mPhotoOutput) {
  388.       Logger.info(`${TAG} takePicture mPhotoOutput is null`)
  389.       return
  390.     }
  391.     try {
  392.       const photoCaptureSetting: camera.PhotoCaptureSetting = {
  393.         quality: camera.QualityLevel.QUALITY_LEVEL_HIGH,
  394.         rotation: camera.ImageRotation.ROTATION_0,
  395.         location: {
  396.           latitude: 0,
  397.           longitude: 0,
  398.           altitude: 0
  399.         },
  400.         mirror: false
  401.       }
  402.       await this.mPhotoOutput.capture(photoCaptureSetting)
  403.     } catch (err) {
  404.       Logger.error(`${TAG} takePicture err:${JSON.stringify(err)}`)
  405.     }
  406.   }
  407.   /**
  408.  
  409. * 获取设备的相机列表
  410.    * @param deviceId 设备ID
  411.    */
  412.   public getDeviceCameras(deviceId: string): Array<camera.CameraDevice> {
  413.     Logger.info(`${TAG} getDeviceCameras ${deviceId} size ${this.mCameraMap.size}`)
  414.     return this.mCameraMap.get(deviceId)
  415.   }
  416.   public getCameraCount(): number {
  417.     return this.mCameraCount
  418.   }
  419.   /**
  420.    * 释放相机
  421.    */
  422.   public async releaseCamera(): Promise<boolean> {
  423.     Logger.info(`${TAG} releaseCamera`)
  424.     let result: boolean = false
  425.     let tempStartTime: number = new Date().getTime()
  426.     try {
  427.       await this.releaseCameraInput()
  428.       await this.releasePhotoOutput()
  429.       await this.releasePreviewOutput()
  430.       await this.releaseSession()
  431.       result = true
  432.     } catch (err) {
  433.       Logger.error(`${TAG} releaseCamera fail ${JSON.stringify(err)}`)
  434.     }
  435.     let tempTime: number = new Date().getTime() - tempStartTime
  436.     Logger.info(`${TAG} releaseCamera finish time: ${tempTime}`)
  437.     return result
  438.   }
  439.   public async selectPic() {
  440.     Logger.info("getSingleImageFromAlbum start")
  441.     let context = AppStorage.Get('context') as common.UIAbilityContext
  442.     let abilityResult = await context.startAbilityForResult({
  443.       bundleName: 'com.ohos.photos',
  444.       abilityName: 'com.ohos.photos.MainAbility',
  445.       parameters: {
  446.         uri: 'singleselect' // 只选取单个文件
  447.       }
  448.     })
  449.     if (abilityResult.want === null || abilityResult.want === undefined) {
  450.       Logger.info("getSingleImageFromAlbum end. abilityResult.want is null.")
  451.       return null
  452.     }
  453.     if (abilityResult.want.parameters === null || abilityResult.want.parameters === undefined) {
  454.       Logger.info("getSingleImageFromAlbum end. abilityResult.want.parameters is null.")
  455.       return null
  456.     }
  457.     let images = abilityResult.want.parameters['select-item-list']
  458.     let imageUri = images[0]
  459.     Logger.info("getSingleImageFromAlbum end. uri:" + imageUri)
  460.     return imageUri
  461.   }
  462. }
SaveCameraAsset
  1. import image from '@ohos.multimedia.image'
  2. import { FunctionCallBack } from './CameraService'
  3. import { Logger } from '@ohos/common'
  4. import CodeRuleUtil from '../utils/CodeRuleUtil'
  5.  
  6.  
  7. const TAG: string = 'SaveCameraAsset'
  8.  
  9. /**
  10.  * 保存相机拍照的资源
  11.  */
  12. export default class SaveCameraAsset {
  13.   constructor() {
  14.  
  15.   }
  16.  
  17.   /**
  18.    *  保存拍照图片
  19.    * @param imageReceiver 图像接收对象
  20.    * @param thumbWidth 宽度
  21.    * @param thumbHeight 高度
  22.    * @param callback 回调
  23.    */
  24.   public saveImage(imageReceiver: image.ImageReceiver, callback: FunctionCallBack) {
  25.     console.info(`${TAG} saveImage`)
  26.     let buffer = new ArrayBuffer(4096)
  27.     const imgWidth: number = imageReceiver.size.width
  28.     const imgHeight: number = imageReceiver.size.height
  29.     Logger.info(`${TAG} saveImage size ${JSON.stringify(imageReceiver.size)}`)
  30.     // 接收图片回调
  31.     imageReceiver.on('imageArrival', async () => {
  32.       console.info(`${TAG} saveImage ImageArrival`)
  33.       // 使用当前时间命名
  34.       imageReceiver.readNextImage((err, imageObj: image.Image) => {
  35.         if (imageObj === undefined) {
  36.           Logger.error(`${TAG} saveImage failed to get valid image error = ${err}`)
  37.           return
  38.         }
  39.         // 根据图像的组件类型从图像中获取组件缓存 4-JPEG类型
  40.         imageObj.getComponent(image.ComponentType.JPEG, async (errMsg, imgComponent) => {
  41.           if (imgComponent === undefined) {
  42.             Logger.error(`${TAG} getComponent failed to get valid buffer error = ${errMsg}`)
  43.             return
  44.           }
  45.           if (imgComponent.byteBuffer) {
  46.             Logger.info(`${TAG} getComponent imgComponent.byteBuffer ${imgComponent.byteBuffer.byteLength}`)
  47.             buffer = imgComponent.byteBuffer
  48.             // todo 内置解码库不开源
  49.             let resultRGB: string = qr.decode(buffer)
  50.             Logger.info(`${TAG} AI uimg result RGB ${resultRGB}`)
  51.             if (callback) {
  52.               callback.aiResult(CodeRuleUtil.getRuleResult(resultRGB))
  53.             }
  54.           } else {
  55.             Logger.info(`${TAG} getComponent imgComponent.byteBuffer is undefined`)
  56.           }
解码

说明：解码使用内部的解码库因为不开源，非常抱歉，当然可以使用开源解码可以，如jsqr、zxing

  1. "dependencies": {
  2.     "jsqr": "^1.4.0",
  3.     "@ohos/zxing": "^2.0.0"
  4.   }
四、配网协议

说明：处于通用性考虑，需要对配网的二维码解析约定一个协议，也就是约定联网二维码数据的格式：##ssid##pwd##securityType

  • ssid ：热点的SSID，编码格式为UTF-8。

  • pwd ：热点的密钥

  • securityType ：加密类型，这可以参看wifiManager.WifiSecurityType

在项目中也提供了协议解析类AnalyticResult.ts，具体代码如下：

  1. /**
  2.  * 结果解析类
  3.  */
  4. export type ResultType = {
  5.   ssid: string,
  6.   pwd: string,
  7.   securityType : number
  8. }
  9.  
  10. const SEPARATOR: string = '##'
  11.  
  12. export class Analytic {
  13.   constructor() {
  14.  
  15.   }
  16.  
  17.   getResult(msg: string): ResultType {
  18.     let result: ResultType = null
  19.     if (msg && msg.length > 0 && msg.indexOf(SEPARATOR) >= 0) {
  20.       let resultArr: string[] = msg.split(SEPARATOR)
  21.       if (resultArr.length >= 4) {
  22.         result = {
  23.           ssid: resultArr[1],
  24.           pwd: resultArr[2],
  25.           securityType: parseInt(resultArr[3])
  26.         }
  27.       }
  28.     }
  29.     return result
  30.   }
  31. }
五、配网页面

说明：通过对配网二维码的解析获取到热点的ssid、密钥、加密类型，就可以通过@ohos.wifiManager(WLAN)提供的网络连接接口实现配网。因为网络连接需要调用系统的一些验证流程，需要消耗一些时间，为了优化交互，需要一个网络连接等待界面ConnectPage.ets，界面截图如下：

具体代码如下：

  1. import { WifiConnectStatus } from '../model/Constant'
  2. import router from '@ohos.router';
  3. import { Logger } from '@ohos/common'
  4. import wifi from '@ohos.wifiManager';
  5. import { ResultType } from '../model/AnalyticResult'
  6. import { WifiModel } from '../model/WifiModel'
  7. /**
  8.  * 网络连接页面
  9.  */
  10. const TAG: string = '[ConnectPage]'
  11. const MAX_TIME_OUT: number = 60000 // 最大超时时间
  12. @Entry
  13. @Component
  14. struct ConnectPage {
  15.   @State mConnectSsid: string = ''
  16.   @State mConnectStatus: WifiConnectStatus = WifiConnectStatus.CONNECTING
  17.   @State mConnectingAngle : number = 0
  18.   @State mConnectFailResource : Resource = $r('app.string.connect_wifi_fail')
  19.   private linkedInfo: wifi.WifiLinkedInfo = null
  20.   private mWifiModel: WifiModel = new WifiModel()
  21.   private mTimeOutId: number = -1
  22.   private mAnimationTimeOutId : number = -1
  23.   async aboutToAppear() {
  24.     Logger.info(`${TAG} aboutToAppear`)
  25.     this.showConnecting()
  26.     let wifiResult: ResultType = router.getParams()['wifiResult']
  27.     Logger.info(`${TAG} wifiResult : ${JSON.stringify(wifiResult)}`)
  28.     // 如果wifi是开的，就记录下状态，然后扫描wifi，并获取连接信息
  29.     if (!wifi.isWifiActive()) {
  30.       Logger.info(TAG, 'enableWifi')
  31.       try {
  32.         wifi.enableWifi()
  33.       } catch (error) {
  34.         Logger.error(`${TAG} wifi enable fail, ${JSON.stringify(error)}`)
  35.       }
  36.     }
  37.     await this.getLinkedInfo()
  38.     // 启动监听
  39.     this.addListener()
  40.     if (wifiResult == null) {
  41.       Logger.info(TAG, 'wifiResult is null')
  42.       this.mConnectFailResource = $r('app.string.scan_code_data_error')
  43.       this.mConnectStatus = WifiConnectStatus.FAIL
  44.     } else {
  45.       this.mConnectSsid = wifiResult.ssid
  46.       Logger.info(`${TAG} connect wifi ${this.mConnectSsid}`)
  47.       this.disposeWifiConnect(wifiResult)
  48.     }
  49.   }
  50.   /**
  51.    * 启动超时任务
  52.    */
  53.   startTimeOut(): void {
  54.     Logger.info(TAG, `startTimeOut`)
  55.     this.mTimeOutId = setTimeout(() => {
  56.       // 如果超过1分钟没有连接上网络，则认为网络连接超时
  57.       try {
  58.         this.mConnectFailResource = $r('app.string.connect_wifi_fail')
  59.         this.mConnectStatus = WifiConnectStatus.FAIL
  60.         wifi.disconnect();
  61.       } catch (error) {
  62.         Logger.error(TAG, `failed,code:${JSON.stringify(error.code)},message:${JSON.stringify(error.message)}`)
  63.       }
  64.     }, MAX_TIME_OUT)
  65.   }
  66.   /**
  67.    * 取消超时任务
  68.    */
  69.   cancelTimeOut() {
  70.     Logger.info(TAG, `cancelTimeOut id:${this.mTimeOutId}`)
  71.     if (this.mTimeOutId >= 0) {
  72.       clearTimeout(this.mTimeOutId)
  73.       this.mTimeOutId = -1
  74.     }
  75.   }
  76.   // 监听wifi的变化
  77.   addListener() {
  78.     // 连接状态改变时，修改连接信息
  79.     wifi.on('wifiConnectionChange', async state => {
  80.       Logger.info(TAG, `wifiConnectionChange: ${state}`)
  81.       // 判断网络是否连接 0=断开  1=连接
  82.       if (state === 1) {
  83.         this.mConnectStatus = WifiConnectStatus.SUCCESS
  84.         this.cancelTimeOut()
  85.       }
  86.       await this.getLinkedInfo()
  87.     })
  88.     // wifi状态改变时，先清空wifi列表，然后判断是否是开启状态，如果是就扫描
  89.     wifi.on('wifiStateChange', state => {
  90.       Logger.info(TAG, `wifiStateLisener state: ${state}`)
  91.     })
  92.   }
  93.   // 获取有关Wi-Fi连接的信息,存入linkedInfo
  94.   async getLinkedInfo() {
  95.     try {
  96.       let wifiLinkedInfo = await wifi.getLinkedInfo()
  97.  
  98.   if (wifiLinkedInfo === null || wifiLinkedInfo.bssid === '') {
  99.         this.linkedInfo = null
  100.         return
  101.       }
  102.       this.linkedInfo = wifiLinkedInfo
  103.     } catch (err) {
  104.       Logger.info(`getLinkedInfo failed err is ${JSON.stringify(err)}`)
  105.     }
  106.   }
  107.   /**
  108.    * 处理wifi连接
  109.    * @param wifiResult
  110.    */
  111.   disposeWifiConnect(wifiResult: ResultType): void {
  112.     this.mConnectStatus = WifiConnectStatus.CONNECTING
  113.     if (this.linkedInfo) {
  114.       // 说明wifi已经连接，需要确认需要连接的wifi和已连接的wifi是否为相同
  115.       let linkedSsid: string = this.linkedInfo.ssid;
  116.       if (linkedSsid === wifiResult.ssid) {
  117.         Logger.info(`${TAG} The same ssid`);
  118.         this.mConnectStatus = WifiConnectStatus.SUCCESS
  119.         return;
  120.       }
  121.       // 如果wifi不同，则先断开网络连接，再重新连接
  122.       try {
  123.         wifi.disconnect();
  124.         this.connectWifi(wifiResult.ssid, wifiResult.pwd, wifiResult.securityType)
  125.       } catch (error) {
  126.         Logger.error(TAG, `failed,code:${JSON.stringify(error.code)},message:${JSON.stringify(error.message)}`)
  127.       }
  128.     } else {
  129.       this.connectWifi(wifiResult.ssid, wifiResult.pwd, wifiResult.securityType)
  130.     }
  131.   }
  132.   private connectWifi(ssid: string, pwd: string, securityType : number) {
  133.     this.startTimeOut()
  134.     this.mWifiModel.connectNetwork(ssid, pwd, securityType)
  135.   }
  136.   async gotoIndex() {
  137.     try {
  138.       let options: router.RouterOptions = {
  139.         url: "pages/Index"
  140.       }
  141.       await router.replaceUrl(options)
  142.     } catch (error) {
  143.       Logger.error(`${TAG} go to index fail, err: ${JSON.stringify(error)}`)
  144.     }
  145.   }
  146.   showConnecting() {
  147.     this.mConnectingAngle = 0
  148.     this.mAnimationTimeOutId = setTimeout(() => {
  149.       this.mConnectingAngle = 360
  150.     }, 500)
  151.   }
  152.   closeConnecting() {
  153.     if (this.mAnimationTimeOutId > -1) {
  154.       clearTimeout(this.mAnimationTimeOutId)
  155.     }
  156.   }
  157.   aboutToDisappear() {
  158.     wifi.off('wifiConnectionChange')
  159.  
  160.    wifi.off('wifiStateChange')
  161.     this.cancelTimeOut()
  162.     this.closeConnecting()
  163.   }
  164.   build() {
  165.     Column() {
  166.       // back
  167.       Row() {
  168.         Image($r('app.media.icon_back'))
  169.           .width(30)
  170.           .height(30)
  171.           .objectFit(ImageFit.Contain)
  172.           .onClick(() => {
  173.             router.back()
  174.           })
  175.       }
  176.       .width('90%')
  177.       .height('10%')
  178.       .justifyContent(FlexAlign.Start)
  179.       .alignItems(VerticalAlign.Center)
  180.       Stack() {
  181.         // 背景
  182.         Column() {
  183.           Image($r('app.media.bg_connect_wifi'))
  184.             .width('100%')
  185.             .height('100%')
  186.             .objectFit(ImageFit.Contain)
  187.             .rotate({
  188.               x: 0,
  189.               y: 0,
  190.               z: 1,
  191.               centerX: '50%',
  192.               centerY: '49%',
  193.               angle: this.mConnectingAngle
  194.             })
  195.             .animation({
  196.               duration: 2000, // 动画时长
  197.               curve: Curve.Linear, // 动画曲线
  198.               delay: 0, // 动画延迟
  199.               iterations: -1, // 播放次数
  200.               playMode: PlayMode.Normal // 动画模式
  201.             })
  202.         }
  203.         Column({ space: 20 }) {
  204.           if (this.mConnectStatus === WifiConnectStatus.SUCCESS) {
  205.             // 连接成功
  206.             Image($r('app.media.icon_connect_wifi_success'))
  207.               .width(80)
  208.               .height(80)
  209.               .objectFit(ImageFit.Contain)
  210.             Text($r('app.string.connect_wifi_success'))
  211.               .fontSize(32)
  212.               .fontColor($r('app.color.connect_wifi_text'))
  213.             Text(this.mConnectSsid)
  214.               .fontSize(22)
  215.               .fontColor($r('app.color.connect_wifi_text'))
  216.           } else if (this.mConnectStatus === WifiConnectStatus.FAIL) {
  217.             // 连接失败
  218.             Image($r('app.media.icon_connect_wifi_fail'))
  219.               .width(80)
  220.               .height(80)
  221.               .objectFit(ImageFit.Contain)
  222.             Text(this.mConnectFailResource)
  223.               .fontSize(32)
  224.               .fontColor($r('app.color.connect_wifi_text'))
  225.             Button($r('app.string.reconnect_wifi'))
  226.               .width(260)
  227.               .height(55)
  228.               .backgroundColor($r('app.color.connect_fail_but_bg'))
  229.               .onClick(() => {
  230.                 this.gotoIndex()
  231.               })
  232.           } else {
  233.             // 连接中
  234.  
  235.  
  236.  
  237.  
  238.    Image($r('app.media.icon_connect_wifi'))
  239.               .width(100)
  240.               .height(100)
  241.               .objectFit(ImageFit.Contain)
  242.             Text($r('app.string.connect_wifi_hint'))
  243.               .fontSize(16)
  244.               .fontColor($r('app.color.connect_wifi_text'))
  245.             Text($r('app.string.connecting_wifi'))
  246.               .fontSize(32)
  247.               .fontColor($r('app.color.connect_wifi_text'))
  248.             Text(this.mConnectSsid)
  249.               .fontSize(22)
  250.               .fontColor($r('app.color.connect_wifi_text'))
  251.           }
  252.         }
  253.         .width('100%')
  254.         .height('100%')
  255.         .justifyContent(FlexAlign.Center)
  256.         .alignItems(HorizontalAlign.Center)
  257.       }
  258.       .width('100%')
  259.       .height('80%')
  260.     }
  261.     .width('100%')
  262.     .height('100%')
  263.     .backgroundColor($r('app.color.connect_bg'))
  264.   }
  265. }

整个界面比较简单，主要显示当前的连接状态：连接中、连接成功、连接超时，特别强调连接超时，计划热点最长连接60s，如果在预定时间未连接成功，则显示超时，超时后可以通过重新配网按钮进行重新扫码连接，根据实际测试，在热点未打开状态下扫码连接耗时平均值12s。

亮点

界面中最大的亮点，增加了一个发光圆形的属性动画animation，圆形在2s内绕着z轴旋从0度转到360度。

  1. Image($r('app.media.bg_connect_wifi'))
  2.             .width('100%')
  3.             .height('100%')
  4.             .objectFit(ImageFit.Contain)
  5.             .rotate({
  6.               x: 0,
  7.               y: 0,
  8.               z: 1,
  9.               centerX: '50%',
  10.               centerY: '49%',
  11.               angle: this.mConnectingAngle
  12.             })
  13.             .animation({
  14.               duration: 2000, // 动画时长
  15.               curve: Curve.Linear, // 动画曲线
  16.               delay: 0, // 动画延迟
  17.               iterations: -1, // 播放次数
  18.               playMode: PlayMode.Normal // 动画模式
  19.             })
六、网络自动连接

说明：网络自动连接主要是通过@ohos.wifiManager(WLAN)提供的连接接口实现，具体代码如下：

  1. import wifi from '@ohos.wifiManager'
  2. import { Logger } from '@ohos/common'
  3. const TAG: string = '[WiFiModel]'
  4. export type WifiType = {
  5.   ssid: string,
  6.   bssid: string,
  7.   securityType: wifi.WifiSecurityType,
  8.   rssi: number,
  9.   band: number,
  10.   frequency: number,
  11.   timestamp: number
  12. }
  13. export class WifiModel {
  14.   async getScanInfos(): Promise<Array<WifiType>> {
  15.     Logger.info(TAG, 'scanWifi begin')
  16.     let wifiList: Array<WifiType> = []
  17.     let result: Array<wifi.WifiScanInfo> = []
  18.     try {
  19.       result = await wifi.getScanResults()
  20.     } catch (err) {
  21.       Logger.info(TAG, `scan info err: ${JSON.stringify(err)}`)
  22.       return wifiList
  23.     }
  24.     Logger.info(TAG, `scan info call back: ${result.length}`)
  25.     for (var i = 0; i < result.length; ++i) {
  26.       wifiList.push({
  27.         ssid: result[i].ssid,
  28.         bssid: result[i].bssid,
  29.         securityType: result[i].securityType,
  30.         rssi: result[i].rssi,
  31.         band: result[i].band,
  32.         frequency: result[i].frequency,
  33.         timestamp: result[i].timestamp
  34.       })
  35.     }
  36.     return wifiList
  37.   }
  38.   connectNetwork(wifiSsid: string, psw: string, securityType : number): void {
  39.     Logger.debug(TAG, `connectNetwork bssid=${wifiSsid} securityType:${securityType}`)
  40.     // securityType 加密类型默认：Pre-shared key (PSK)加密类型
  41.     let deviceConfig: wifi.WifiDeviceConfig  = {
  42.       ssid: wifiSsid,
  43.       preSharedKey: psw,
  44.       isHiddenSsid: false,
  45.       securityType: securityType
  46.     }
  47.     try {
  48.       wifi.connectToDevice(deviceConfig)
  49.       Logger.info(TAG, `connectToDevice success`)
  50.     } catch (err) {
  51.       Logger.error(TAG, `connectToDevice fail err is ${JSON.stringify(err)}`)
  52.     }
  53.     try {
  54.       wifi.addDeviceConfig(deviceConfig)
  55.     } catch (err) {
  56.       Logger.error(TAG, `addDeviceConfig fail err is ${JSON.stringify(err)}`)
  57.     }
  58.   }
  59. }

网络连接主要是通过wifi.connectToDevice(deviceConfig)实现，其中：deviceConfig: wifi.WifiDeviceConfig为WLAN配置信息，在连接网络时必填三个参数ssid、preSharedKey、securityType。

  • ssid：热点的SSID

  • preSharedKey：热点密钥

  • securityType：加密类型

注意：在调用connectToDevice()函数连接网络时，如果网络已经连接，则需要先调用disconnect()接口断开网络后再执行。

至此，你已经完成了扫码即可连接网络的应用。

感谢

如果您能看到最后，还希望您能动动手指点个赞，一个人能走多远关键在于与谁同行，我用跨越山海的一路相伴，希望得到您的点赞。

最后

有很多小伙伴不知道学习哪些鸿蒙开发技术？不知道需要重点掌握哪些鸿蒙应用开发知识点？但是又不知道从哪里下手，而且学习时频繁踩坑，最终浪费大量时间。所以本人整理了一些比较合适的鸿蒙（HarmonyOS NEXT）学习路径和一些资料的整理供小伙伴学习

点击领取→纯血鸿蒙Next全套最新学习资料希望这一份鸿蒙学习资料能够给大家带来帮助，有需要的小伙伴自行领取~~

一、鸿蒙（HarmonyOS NEXT）最新学习路线

​

有了路线图，怎么能没有学习资料呢，小编也准备了一份联合鸿蒙官方发布笔记整理收纳的一套系统性的鸿蒙（OpenHarmony ）学习手册（共计1236页）与鸿蒙（OpenHarmony ）开发入门教学视频，内容包含：（ArkTS、ArkUI开发组件、Stage模型、多端部署、分布式应用开发、音频、视频、WebGL、OpenHarmony多媒体技术、Napi组件、OpenHarmony内核、Harmony南向开发、鸿蒙项目实战等等）鸿蒙（HarmonyOS NEXT）…等技术知识点。

获取以上完整版高清学习路线，请点击→纯血版全套鸿蒙HarmonyOS学习资料

二、HarmonyOS Next 最新全套视频教程

​

三、《鸿蒙 (OpenHarmony)开发基础到实战手册》

OpenHarmony北向、南向开发环境搭建

​

四、大厂面试必问面试题

​

五、鸿蒙南向开发技术

​

六、鸿蒙APP开发必备

​

​


完整鸿蒙HarmonyOS学习资料，请点击→纯血版全套鸿蒙HarmonyOS学习资料

总结
总的来说，华为鸿蒙不再兼容安卓，对中年程序员来说是一个挑战，也是一个机会。只有积极应对变化，不断学习和提升自己，他们才能在这个变革的时代中立于不败之地。 

                        

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/天景科技苑/article/detail/950330
推荐阅读
相关标签

Copyright © 2003-2013 www.wpsshop.cn 版权所有，并保留所有权利。

  

闽ICP备14008679号