| 【HarmonyOS】如何获取屏幕宽高&父容器的宽高 | 您所在的位置：网站首页 › java获取屏幕宽高 › 【HarmonyOS】如何获取屏幕宽高&父容器的宽高 |
【HarmonyOS】如何获取屏幕宽高&父容器的宽高
|
【关键字】 HarmonyOS、屏幕宽高、父容器宽高、组件通用信息、组件标识 1、写在前面 在鸿蒙应用开发的过程中，需要用到屏幕的宽高，那么我们该如何获取手机屏幕的宽度和高度呢？另外，某个组件的父容器的宽高我们能不能获取到呢？带着这些问题，通过查找相关资料，结合实际的代码进行测试，顺利的获取到了屏幕宽高和父组件的宽高，下面一起来看一下具体该如何实现吧。 2、解决方案 首先是获取屏幕宽高，它的实现较为简单，直接上代码： aboutToAppear(){ // let displayClass = null; try { // displayClass = display.getDefaultDisplaySync() console.info('------>width:'+display.getDefaultDisplaySync().width) // console.info('------>width:'+displayClass.width) // console.info('------>height:'+displayClass.height) console.info('------>height:'+display.getDefaultDisplaySync().height) } catch (exception) { console.error('Failed to obtain the default display object. Code: ' + JSON.stringify(exception)) } }
运行代码，发现日志中确实打印出了屏幕宽高的结果：
那父容器的宽高又该如何获取呢？直接获取好像并没有相关的属性或者方法可以获取到，通过查找API文档，发现可以通过间接的手段来获取父组件的宽高，来具体看一下代码是如何写的： build() { Column() { Column() { Text('我是文本').width(200).height(50).onAppear(()=>{ let jsonStr = getInspectorByKey('111') let data = JSON.parse(jsonStr) let attr = data.$attrs let size = attr.size console.info('------>parent:'+size.width+'---'+size.height) }) }.id('111').width(300).height(300) }.width('100%').height('100%') }
这里首先是给Text这个文本组件的父容器Column组件设置一个id，然后在Text组件加载的回调里面，通过getInspectorByKey(id)这个方法，然后入参传入某个组件的id，这样就可以获取到对应组件的所有属性，然后将返回的JSON格式的字符串转成对象，再通过解析size属性就可以获取到对应组件的宽高啦：
OK，通过上面的方法，我们就可以获取父组件的宽高。 完整代码如下：
3、参考文档 屏幕宽高： https://developer.harmonyos.com/cn/docs/documentation/doc-references-V3/js-apis-display-0000001427585076-V3 父组件宽高： https://developer.harmonyos.com/cn/docs/documentation/doc-references-V3/ts-universal-attributes-component-id-0000001427902440-V3#ZH-CN_TOPIC_0000001574088801__getinspectorbykey9 |
【本文地址】