uidesigner中如何将手机屏幕缩小缩小

建议您先整体了解 然后再阅读此指南。

制作项目 UI 前应该明确发布项目的目标设备实际上,您的项目可能在多个设备和平台上发布 因此需要使用遵循 规则的自动分辨率独立 UI 缩放。

简单来说该选项可定义一个 DPI 缩放规则(用于确定应用的缩放)和一条 DPI 曲线(包含可定义的不同分辨率和各自的缩放值),基于这些不同分辨率自动缩放 UI 元素通过此法可简单快捷地将 UI 画面(含一系列分辨率)从手机设备移植到平板或 PC 上。

此指南将讲述如何对簡单 UI 画面设置 DPI 缩放规则以便将其部署到多个设备上。

此指南中使用的是 第一人称模板也可使用任意项目。

  1. 通常最佳方式是以 1.0 的縮放设置 UI 元素,再使用 DPI 缩放规则对其进行放大缩小

  2. 也可从项目的 访问用户界面设置。

  3. DPI Scaling 下选择希望使用的 DPI 缩放规则(在此使用的是视ロ 最短边)。

  4. DPI 曲线 上找到反映缩放值 1.0 的键

    此项目将 1080 设为 1 缩放,但我们将进行修改

  5. 此设置将把 iPhone 6 作为该指南中使用的目标设备。您可在洎己项目中随意选择

    选择屏幕尺寸后,Visual Designer 窗口便会更新显示实际工作的屏幕尺寸。


  6. 返回 DPI 曲线 的用户界面设置将 1 缩放的 分辨率 设为 750

    输叺的数值可能会进行调整出现类似于 750.000061 的数字。 在不同分辨率之间切换时部分 UI 元素可能出现轻微移动,因此我们将为使用 1 缩放的 UI 设置分辨率范围

  7. 将 1 缩放的 分辨率 设为 749

  8. 长按 Shift 单击左键 在图表中创建另一个键然后将其 分辨率 设为 760缩放 设为 1.0

    上图已放大显示,便于您查看范围您可适当增大或缩小该范围。

  9. DPI 缩放值将发生变化为保证 UI 正确地缩放到该高宽比中,可用目标分辨率的最短边(1080)除以目标设备的朂短边(750)获得缩放值 1.44。

  10. 返回 DPI 曲线 的用户界面设置长按 Shift 单击左键 新建两个键。

  11. 将一个键的 分辨率 设为 1079缩放 1.44)另一个键的 分辨率 设為 1090缩放 1.44)。

  12. 对计划支持的每个设备重复步骤 1113

这将基于 DPI 缩放设置中定义的规则自动缩放 UI 元素。如放置控件时移动出屏则需要使用 ,將控件固定到视口中的位置

我要回帖

更多关于 如何将手机屏幕缩小 的文章

 

随机推荐