小程序的ui框架尺寸

小程序的 UI 设计指南在小程序官方文档中均有介绍，以微信官方设计文档为参照：

1、 小程序布局：小程序的布局主要采用块状结构进行布局，优先采用卡片、列表或网格等布局方式；

2、 小程序 UI 调色：小程序的 UI 调色使用典型的灰色调子，较亮的颜色基调使用明度较浅的颜色；

3、小程序 UI 尺寸：采用 1080px 宽，720px 高的界面设计尺寸，控件尺寸以 8px 为基准单位，即每个控件的间距需以 8px 设计；

4、 小程序 UI 字号：字体最大尺寸 36px，最小尺寸 24px，中等字体尺寸使用 30px。

小程序中的 video 组件是原生组件， 默认宽度300px、高度225px，可通过wxss设置宽高。其中 src 属性默认支持MP4格式，但是实际上还可以支持其他格式。

属性主要有：

src ：要播放视频的资源地址。

initial-time ：指定视频初始播放位置。

danmu-list ：d幕列表。

controls ：是否显示默认播放控件（播放/暂停按钮、播放进度、时间）。

binderror ：视频播放出错时触发。

安卓系统可以支持MP4格式的视频，苹果手机支持m3u8格式的视频。可以通过获取手机的系统，然后判断播放什么格式的视频。

参数主要包括：

brand ：手机品牌；

model ：手机型号；

fontSizeSetting ：用户字体大小设置。以“我-设置-通用-字体大小”中的设置为准，单位 px；

pixelRatio ：设备像素比。

小程序开发尺寸是rpx（responsive pixel），可以实现一稿适配所有屏幕尺寸，小程序编译后，rpx会做一次px换算。换算是以375个物理像素为基准，也就是在一个宽度为375物理像素的屏幕下，1rpx = 1px。这里了解就行，设计稿尺寸375px或750px都没问题。

---