HarmonyOS鸿蒙Next系统有api方法把Length转换为单位为vp的number值吗？

HarmonyOS鸿蒙Next系统有api方法把Length转换为单位为vp的number值吗？

/**

  • Length 转换为单位是vp的number
  • @param context ApplicationContext
  • @param length string | number | Resource;
  • @param parentVpLength 父组件的Length，单位是vp
  • @returns 单位是vp的number */ export function lengthToVp(context:common.ApplicationContext,length:Length,parentVpLength:number):number{ if(typeof length == ‘number’){ return length }else if(typeof length == ‘string’){ //…太多种情况了，系统有方法可以直接把Length 转为单位是vp的值吗？ }else { return context.resourceManager.getNumber(length.id) } }

let parentVpLength = 100 let length = ‘80%’ let result: number = lengthToVp(context,length,parentVpLength)

let length1 = ‘100px’ let result1: number = lengthToVp(context,length,parentVpLength)

let length2 = $r(‘app.float.test_length’) let result2: number = lengthToVp(context,length,parentVpLength)

系统有如上lengthToVp()类似的方法可以把Length转换为vp的值吗？


更多关于HarmonyOS鸿蒙Next系统有api方法把Length转换为单位为vp的number值吗？的实战教程也可以访问 https://www.itying.com/category-93-b0.html

6 回复

没有找到系统的Lenght转number方法，自己写一个吧：

/**
 * Length 转换为单位是vp的number
 * @param context         ApplicationContext
 * @param length          string | number | Resource;
 * @param parentVpLength  父组件的Length，单位是vp
 * @returns  单位是vp的number
 */
export function lengthToVp(context:common.ApplicationContext,length:Length,parentVpLength:number):number{
  if(typeof length == 'number'){
    return length
  }else if(typeof length == 'string'){
    return stringToVp(length,parentVpLength)
  }else {
    //resourceManager.getNumber 返回的单位是px，需要转换为vp
    return px2vp(context.resourceManager.getNumber(length.id))
  }
}

//判断字符串是否是数字
function isNumeric(value:string) {
  return /^[+-]?\d+(\.\d+)?$/.test(value);
}

/**
 * Length 转换为单位是vp的number
 * @param length          string;
 * @param parentVpLength  父组件的Length，单位是vp
 * @returns  单位是vp的number
 */
export function stringToVp(length:string,parentVpWidth:number):number{
  let lenStr:string
  if(length.endsWith('%')){
    lenStr = length.slice(0,-1);
    if(isNumeric(lenStr)){
      return Number(lenStr)/100*parentVpWidth
    }
  }
  else if(length.endsWith('vp')){
    lenStr = length.slice(0,-2);
    if(isNumeric(lenStr)){
      return Number(lenStr)
    }
  }
  else if(length.endsWith('lpx')){
    lenStr = length.slice(0,-3);
    if(isNumeric(lenStr)) {
      return px2vp(lpx2px(Number(lenStr)))
    }
  }
  else if(length.endsWith('px')){
    lenStr = length.slice(0,-2);
    if(isNumeric(lenStr)) {
      return px2vp(Number(lenStr))
    }
  }
  else if(length.endsWith('fp')){
    lenStr = length.slice(0,-2);
    if(isNumeric(lenStr)) {
      return px2vp(fp2px(Number(lenStr)))
    }
  }
  else if(isNumeric(length)){
      return Number(length)
  }
  throw Error(`${length} is not supported`)
}

测试：

Button('test')
  .onClick(() =>{
    const parentLength = 100
    const context = this.context.getApplicationContext()
    console.info('60%: '+lengthToVp(context,"60%",parentLength))
    console.info('60: '+lengthToVp(context,"60",parentLength))
    console.info('60vp: '+lengthToVp(context,"60vp",parentLength))
    console.info('60fp: '+lengthToVp(context,"60fp",parentLength))
    console.info('60px: '+lengthToVp(context,"60px",parentLength))
    console.info('60lpx: '+lengthToVp(context,"60lpx",parentLength)+"")
    console.info('number_60: '+lengthToVp(context,$r('app.float.number_60'),parentLength))
    console.info('vp_60: '+lengthToVp(context,$r('app.float.vp_60'),parentLength))
    console.info('fp_60: '+lengthToVp(context,$r('app.float.fp_60'),parentLength))
    console.info('px_60: '+lengthToVp(context,$r('app.float.px_60'),parentLength))
  })

打印：

60%: 60
60: 60
60vp: 60
60fp: 60
60px: 20
60lpx: 30.11111111111111
number_60: 20
vp_60: 60
fp_60: 60
px_60: 20

更多关于HarmonyOS鸿蒙Next系统有api方法把Length转换为单位为vp的number值吗？的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


像素单位

概述

像素单位用于表示长度。HarmonyOS支持以下几种像素单位：

  • px：屏幕像素点。
  • vp：视窗像素，一种虚拟像素单位。一个vp等于屏幕分辨率为240dpi时的一个像素点。当屏幕分辨率低于240dpi时，一个vp大于一个像素点；当屏幕分辨率高于240dpi时，一个vp小于一个像素点。
  • fp：固定像素，一种虚拟像素单位。一个fp等于屏幕分辨率为160dpi时的一个像素点。当屏幕分辨率低于160dpi时，一个fp大于一个像素点；当屏幕分辨率高于160dpi时，一个fp小于一个像素点。

常见单位换算

  • 1px = 1/96英寸
  • 1vp = 1/240英寸
  • 1fp = 1/160英寸

当为string类型时：需要显式指定像素单位，如’10px’，也可设置百分比字符串，如’100%’。

当为string类型时可以使用Number()函数将string字符串转换为数字（字符串须为纯数字如’10’）。 参考文档：https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/ts-types-V5#length

若外部传入为’100%'字符串类型：

可以通过如下方法 Number.parseInt(‘100%’)

输出100，建议修改默认单位vp为%

你好。

没必要通过数值Length和父类的vp数值，计算得到当前的控件vp数值。

可以通过控件提供的onAreaChange()

HarmonyOS Next系统提供长度单位转换的API。可以使用convertPx2vp方法将像素(px)转换为虚拟像素(vp)。但系统没有直接转换Length对象为vp的API，需要先获取px值再进行转换。示例代码：

import { Length } from '@ohos.uitoolkit';
let length = new Length('100px');
let vpValue = length.convertPx2vp(length.getValue());

注意Length对象需先明确单位类型。

在HarmonyOS Next中，可以使用Dimension模块的vp2px和px2vp方法进行单位转换，但没有直接提供将Length转换为vp值的API。对于字符串类型的Length，需要自行解析处理：

  1. 对于百分比字符串(如"80%")：
if (length.endsWith('%')) {
  return parseFloat(length) * parentVpLength / 100;
}
  1. 对于px单位字符串(如"100px")：
if (length.endsWith('px')) {
  const pxValue = parseFloat(length);
  return px2vp(pxValue);
}

  1. 对于纯数字字符串或数字，直接返回即可。

  2. 对于Resource资源，使用resourceManager获取数值。

目前系统没有提供直接转换所有Length类型到vp的单一API，需要开发者根据不同类型分别处理。

回到顶部