
设备
rpx换算px (屏幕宽度/750)
px换算rpx (750/屏幕宽度)
iPhone51rpx = 0.42px1px = 2.34rpx
iPhone61rpx = 0.5px1px = 2rpx
iPhone6s1rpx = 0.552px1px = 1.81rpx
微信小程序也支持世陆rem尺寸单位,rem和rpx的换算关系:rem: 规定屏幕宽度为20rem;1rem = (750/20)rpx
注:开发微信小程序时设计师可以用 iPhone6 作为视觉稿的标准。
建议:设计稿使用设备宽度750px比较容易计算750px的话1rpx=1px,这样的话,设计图上量出来的尺寸是多少px就搜陪顷是多少rpx,至于在不同的设备上实际上要换算成多少个rem就交给小程序自己换算
小程序的 UI 设计指南在小程序官方文档中均有介绍,以微信官方设计文档为参照:1、 小程序布局:小程序的布局主要采用块察大状结构进行布局,优先采用卡片、列表或网格等布局方式;
2、 小程序 UI 调色:小程序的 UI 调色使用典型的灰色调子,较亮的颜色基调使用明度较浅的颜色余巧;
3、小程序 UI 尺寸:败毁竖采用 1080px 宽,720px 高的界面设计尺寸,控件尺寸以 8px 为基准单位,即每个控件的间距需以 8px 设计;
4、 小程序 UI 字号:字体最大尺寸 36px,最小尺寸 24px,中等字体尺寸使用 30px。
欢迎分享,转载请注明来源:内存溢出
微信扫一扫
支付宝扫一扫
评论列表(0条)