✨本人自己开发的开源项目：土拨鼠充电系统

✨踩坑不易，还希望各位大佬支持一下，在GitHub给我点个 Start ⭐⭐👍👍

✍GitHub开源项目地址👉：https://github.com/cheinlu/groundhog-charging-system

一、背景

屏幕属性提供管理显示设备的一些基础能力，包括获取默认显示设备的信息，获取所有显示设备的信息以及监听显示设备的插拔行为。

不同屏幕大小的宽/高是不一样的，本文主要通过@ohos.display来获取屏幕的宽高属性

二、屏幕属性的几种方法

1、getDefaultDisplaySync(): Display👉👉获取当前默认的display对象

2、getAllDisplays(callback: AsyncCallback<Array<Display>>): void👉👉获取当前所有的display对象，使用callback异步回调。

3、getAllDisplays(): Promise<Array<Display>>👉👉获取当前所有的display对象，使用Promise异步回调。

三、获取屏幕宽高

使用getDefaultDisplaySync(): Display方法，来得到不同屏幕大小的宽高属性

3.1、Display属性

名称	类型	可读	可写	说明
id	number	是	否	显示设备的id号。
name	string	是	否	显示设备的名称。
alive	boolean	是	否	显示设备是否启用。
state	DisplayState	是	否	显示设备的状态。
refreshRate	number	是	否	显示设备的刷新率。
rotation	number	是	否	显示设备的屏幕旋转角度。 值为0时，表示显示设备屏幕旋转为0°； 值为1时，表示显示设备屏幕旋转为90°； 值为2时，表示显示设备屏幕旋转为180°； 值为3时，表示显示设备屏幕旋转为270°。
width	number	是	否	显示设备的屏幕宽度，单位为像素。
height	number	是	否	显示设备的屏幕高度，单位为像素。
densityDPI	number	是	否	显示设备的屏幕密度，表示每英寸点数。一般取值160，480等。
densityPixels	number	是	否	显示设备的逻辑密度，是像素单位无关的缩放系数。一般取值1，3等。
scaledDensity	number	是	否	显示设备的显示字体的缩放因子。通常与densityPixels相同。
xDPI	number	是	否	x方向中每英寸屏幕的确切物理像素值。
yDPI	number	是	否	y方向中每英寸屏幕的确切物理像素值。

3.2、获取屏幕宽高

 具体代码：

import display from '@ohos.display';@Entry
@Component
struct DisplayPage {@State screenWidth: number = -1;@State screenHeight: number = -1aboutToAppear(): void {let data = display.getDefaultDisplaySync();//屏幕宽this.screenWidth = px2vp(data.width)//屏幕高this.screenHeight = px2vp(data.height)}build() {Column() {Text(`屏幕宽:${this.screenWidth}`).fontSize(20).fontWeight(FontWeight.Bold)Text(`屏幕高:${this.screenHeight}`).fontSize(20).fontWeight(FontWeight.Bold)}.width('100%').margin({ top: 100 })}
}

实际效果： 

3.3、封装成工具类使用

说明：在实际项目中，页面中画UI时都会涉及获取屏幕宽度，便考虑封装成工具类，页面中使用时再引入

3.3.1、创建ScreenUtils文件

在项目中新建utils目录，目录内新建ScreenUtils文件，用于工具类书写

ScreenUtils文件具体代码

import display from '@ohos.display'export class ScreenUtils {//屏幕数据private defaultDisplay: display.Display | null = nullprivate static instance: ScreenUtils;private constructor(){this.defaultDisplay = display.getDefaultDisplaySync()}public static getInstance(): ScreenUtils {if (!ScreenUtils.instance) {ScreenUtils.instance = new ScreenUtils();}return ScreenUtils.instance;}//屏幕宽度--px单位getScreenWidthPx(): number {return this.defaultDisplay?.width ?? -1}//屏幕宽度--px单位转换成vp单位，鸿蒙适配vp单位getScreenWidthVp(): number {return px2vp(this.getScreenWidthPx())}//屏幕高度--px单位getScreenHeightPx(): number {return this.defaultDisplay?.height ?? -1}//屏幕高度--vp单位getScreenHeightVp(): number {return px2vp(this.getScreenHeightPx())}
}

3.3.2、组件中引入ScreenUtils文件使用

import { ScreenUtils } from '../utils/ScreenUtils'@Entry
@Component
struct DisplayPage {private screenWidth = ScreenUtils.getInstance().getScreenWidthVp()private screenHeight = ScreenUtils.getInstance().getScreenHeightVp()build() {Column() {Text(`屏幕宽:${this.screenWidth}`).fontSize(20).fontWeight(FontWeight.Bold)Text(`屏幕高:${this.screenHeight}`).fontSize(20).fontWeight(FontWeight.Bold)}.width('100%').margin({ top: 100 })}
}