微信小程序界面要适配

2020-09-12
来源:

小程序是一个跨系统的平台,虽然说它不用区分版本的不同,但是小程序在不同的设备上运行,它会出现不同的分辨率,那么如何使用小程序在不同的设备上保持正常的视觉元素,使界面更加适配,这就是小程序进行优化时需要考虑的问题了。


微信小程序界面要适配.jpg


小程序之所以能够在分辨率不同的设备上保证视觉元素的正常显示,那是因为rpx的动态尺寸单位的作用很多人来说都会理解,像素在显示屏上每一个画面都是由无数的点距去形成的,在这个点阵当中每一个点就叫做像素,简称px。


但是随着我们视网膜屏的退出,还有很多高峰屏的普及ps所能代表的实际长度那么就会发生改变,如果单纯的使用px还不能满足需求,那么小程序元素就很难保证在不同设备上的正常显示,即使是同样的px尺寸的元素,在高分屏上的显示要比低分屏上小很多。


在这种情况下,看来小程序需要一个动态的长度单位,这个长度单位还能够对不同的屏幕去进行调整和适配,这样就可以保证所有的元素在不同的屏幕上展示的都是一样的。


在微信的官方文档当中有这么一句话,在iphone6上屏幕宽度为375px,共有750个物理像素,则750rpx=375px=750物理像素。那么e 2px=0.5pm=e物理像素,这就是说明微信小程序的设计师可以把iphone6的界面去作为视角稿的标准。


设计师在设计小程序的时候,就可以直接用iphone6的屏幕尺寸去作为他们的视觉稿尺寸,然后再1px=2rp开x的标准去将设计稿设定为750×1334。


当微信小程序的设计稿在交给程序员之前,小程序的设计师要描述好搞尺寸和单位换算的标准,这样才能够帮助程序员去快速的去实现正常的效果。


其实有很多的小程序界面,适配上也可以看出,微信小程序放到电脑上运行,屏幕的宽度可能会发生改变,我们就以宽度为基准,最后很容易可以看得出元素显示不全面的情况。


虽然说小程序已经基本适应了不同版本的手机型号,但是我们从细节上还可以看得出来,它还是有一些差别,还是可以给用户带来一些不适的体验,所以程序员要对界面进行优化,并且使小程序能够识别不同的屏幕。



北京华网天下,助企业在互联网中扬帆起航!我们提供互联网品牌建设与推广的服务!真诚为您服务!携手合作共赢!本文相关的关键词:北京小程序开发、北京商城小程序开发、北京微信小程序开发定制


分享