Concernant uni-app utilisant rpx, les polices et autres styles sont incompatibles sur l'iPad

Samedi, j'ai finalement décidé de soumettre la version iOS de l'application iOS qui a déjà développé une version stable à l'App Store pour examen. J'ai reçu un e-mail ce matin et j'ai trouvé qu'il avait été rejeté. L'un des problèmes est que il y a un problème avec l'affichage de l'iPad qui affecte l'expérience utilisateur, comme indiqué dans la figure ci-dessous.:

Je me suis senti un peu étrange pendant un moment. J'ai évidemment utilisé rpx. C'était correct sur l'iPhone et d'autres téléphones portables. Pourquoi les polices sont-elles devenues si gonflées sur l'iPad? J'ai vérifié le site Web officiel d'uni-app et j'ai trouvé le passage suivant: "

L'utilisation de rpx doit être soulignée ici.

Il existe également de nombreuses largeurs d'écran sur les appareils mobiles, et les concepteurs ne produisent généralement des images qu'en fonction de la largeur d'écran de 750 pixels. L'avantage d'utiliser rpx à ce stade est que les largeurs d'écran des différents appareils mobiles ne sont pas très différentes.Par rapport à l'effet de zoom de réglage fin 750px, le design du designer est restauré autant que possible.

Cependant, une fois séparé de l'appareil mobile, dans l'écran du PC, ou dans l'état de l'écran horizontal du pavé, car la largeur de l'écran est bien supérieure à 750. À ce stade, le résultat des changements de rpx en fonction de la largeur de l'écran est sérieusement hors des attentes, ce qui est terrible. "

Et il est invité à configurer les paramètres suivants de rpx dans le globeStyle de pages.json:

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

Mais vous constaterez qu'après l'ajout, cela ne fonctionnera pas, puis cela fonctionnera après avoir défini rpxCalcMaxDeviceWidth sur 0.

Bien sûr, le site Web officiel uni-app a également une explication plus tard: "Grâce aux deux premières des configurations ci-dessus, à savoir rpxCalcMaxDeviceWidth et rpxCalcBaseDeviceWidth, vous pouvez résoudre efficacement le problème que l'interface devient extrêmement énorme sous écran large après avoir utilisé rpx. Si vous n'en avez pas besoin Si vous définissez spécifiquement les valeurs de ces deux paramètres, vous n'avez pas besoin de les configurer dans pages.json, conservez simplement les valeurs par défaut de 960 et 375. "

Plus précisément, il est nécessaire d'adapter la largeur de l'écran en ajustant les valeurs de rpxCalcMaxDeviceWidth et rpxCalcBaseDeviceWidth en fonction de la situation réelle.

Lien d'origine: https://www.xubingtao.cn?p=2650

Suivez mon compte public pour publier toutes sortes d'informations utiles pour vous chaque jour.

Je suppose que tu aimes

Origine blog.csdn.net/xubingtao/article/details/111474266
conseillé
Classement