Con respecto a uni-app que usa rpx, las fuentes y otros estilos son incompatibles en el iPad

El sábado, finalmente decidí enviar la versión iOS de la aplicación iOS que ya ha desarrollado una versión estable a la App Store para su revisión. Recibí un correo electrónico esta mañana y descubrí que fue rechazada. Uno de los problemas es que hay un problema con la pantalla del iPad que afecta la experiencia del usuario, como se muestra en la siguiente figura.:

Me sentí un poco extraño por un tiempo. Obviamente usé rpx. Estaba bien en el iPhone y otros teléfonos móviles. ¿Por qué las fuentes se volvieron tan infladas en el iPad? Revisé el sitio web oficial de la uni-app y encontré el siguiente pasaje: "

Aquí se debe enfatizar el uso de rpx.

También hay muchos anchos de pantalla en dispositivos móviles, y los diseñadores generalmente solo producen imágenes de acuerdo con el ancho de pantalla de 750px. La ventaja de usar rpx en este momento es que los anchos de pantalla de varios dispositivos móviles no son muy diferentes En comparación con el efecto de zoom de ajuste fino de 750px, el diseño del diseñador se restaura tanto como sea posible.

Sin embargo, una vez separado del dispositivo móvil, en la pantalla de la PC, o en el estado de la pantalla horizontal de la almohadilla, el ancho de la pantalla es mucho mayor que 750. En este momento, el resultado de los cambios de rpx de acuerdo con el ancho de la pantalla está fuera de lo esperado, lo cual es terrible. "

Y se le solicita que configure los siguientes parámetros de rpx en el estilo globeStyle de pages.json:

{
  "globalStyle": {
    "rpxCalcMaxDeviceWidth": 960, // rpx 计算所支持的最大设备宽度,单位 px,默认值为 960
    "rpxCalcBaseDeviceWidth": 375, // rpx 计算使用的基准设备宽度,设备实际宽度超出 rpx 计算所支持的最大设备宽度时将按基准宽度计算,单位 px,默认值为 375
    "rpxCalcIncludeWidth": 750 // rpx 计算特殊处理的值,始终按实际的设备宽度计算,单位 rpx,默认值为 750
  },
}

Pero encontrará que después de agregarlo, no funcionará, y luego funcionará después de configurar rpxCalcMaxDeviceWidth en 0.

Por supuesto, el sitio web oficial de uni-app también tiene una explicación más adelante: "A través de las dos primeras de las configuraciones anteriores, a saber, rpxCalcMaxDeviceWidth y rpxCalcBaseDeviceWidth, puede resolver de manera efectiva el problema de que la interfaz se vuelve extremadamente grande en pantalla ancha después de usar rpx. no lo necesita Si define específicamente los valores de estos dos parámetros, no es necesario que los configure en pages.json, solo mantenga los valores predeterminados de 960 y 375 ".

Específicamente, es necesario adaptar el ancho de la pantalla ajustando los valores de rpxCalcMaxDeviceWidth y rpxCalcBaseDeviceWidth según la situación real.

Enlace original: https://www.xubingtao.cn?p=2650

Siga mi cuenta pública para publicar todo tipo de información útil para usted todos los días.

Supongo que te gusta

Origin blog.csdn.net/xubingtao/article/details/111474266
Recomendado
Clasificación