小程序大图片缺少右边线

小程序大图片缺少右边线的解决方法：用1张2倍图做罩拍缺适配。

1、通过动态设置image宽高来实物辩现：先在data中用变量表示小图贺敏标初始宽高，并绑定到image组件上。

2、再通过wx.getSystemInfo获取手机可使用窗口宽度，那么小图标的宽度=原宽*屏宽/设计图宽，长=原长*屏宽/设计图宽，再用this.setData()修改变量。

就是小程序上方由胶囊占据的bar，就叫titleBar。

因为我们可以在胶囊左侧写标题和其他一些东西。这些东西要跟胶囊中线对齐。

首先我没段们要撑起statusBar的高度，也就是最顶部的那个bar。这个bar的高度很容易取得。

uni.getMenuButtonBoundingClientRect().top取得的是胶囊距离视口顶部的距离，减掉statusBar的高度，就是胶囊离statusBar下沿的距离。这个距离乘以2，加上胶囊自身高度，就是titleBar的蠢明高度。

见红色部分。

开发者工具中会有略微错位，无妨，以真机为准。

我们希望胶囊左侧空白区域与胶囊有间距，而且间距最好是等于胶囊到枯档誉右边边线的距离。这个前提下，左侧空白区域的宽度怎么算？

写成组件就是这样：

用法：

演示如何使用作用域插槽：

官方文档介绍：

因余闭此我竖汪裂们可以得知，任何手机屏幕宽度都是 750 rpx，手机陵樱屏幕的高度则可以由宽高比计算得出。在模拟器中你可以看到 iPhone 7, iPhone 7 Plus 和 iPhone X 的宽高比。

---