当前位置: 首页 > news >正文

UE5发布Android屏幕适配实践(Blueprint)

之前发了一个文章UE5屏幕适配,后续做项目中又遇到问题,对DPI Scale又有了理解,所以又写了这篇文章。https://mp.csdn.net/mp_blog/creation/editor/133337134icon-default.png?t=N7T8https://mp.csdn.net/mp_blog/creation/editor/133337134

 DPI Scale Rule使用Shortest Side,如果设置Resolution=375,Scale=1,那么我们适配的范围应该是大于这个值,如下图所示,那么我们要适配的屏幕的分辨率在这个范围内,ui会自动的缩放。

一、首先我们要在375分辨率的尺寸下布置ui

二、需要放大的Image可以通过viewport scale这个参数进行计算。

例如有个背景图片原始尺寸300x400,当屏幕分辨率为750x1334的时候,viewport scale的值为750/375=2,viewport size获得设备屏幕的分辨率大小,这时候我们要放大图片,如下图所示先通过Render Scale放大,放大后起始点会偏移,所以然后通过RenderTransform设置起始的位置为左上角0,0点,Canvas Map包含一个可以放大的背景Image组件。

三、背景图片可以拖拽移动,原来想直接背景图片放到scrollbox中,但是ue5的控件要么支持横向拖拽,要么支持纵向拖拽,所以我这里使用计算坐标并移动的方式。

背景图片设置到Image_Background上,背景图片上的子组件,添加到CanvasMap上,这样在适配不同屏幕大小,背景图片的大小可以适配,背景图片上的子组件用的相对坐标在放大图片时也不会影响子附件坐标。

核心方法是,需要先计算出要移动的目标点坐标,然后由现在canvasmap的位置移动到目标位置。

绿色框为手机显示的范围,背景图片是大于屏幕的范围,那么我们根据屏幕大小viewport size和背景图片canvas map的大小计算差值分别是x和y,这个是就是图片移动的距离。

下面是手势计算,当手指按下的位置和手指抬起的位置差值大于100的时候,认为是轻扫的手势。

然后是判断方向上下左右。

然后是计算移动的距离,这时候就会用到Viewport Scale,最后还要增加一个-号,因为背景坐标的起始点是0,0,移动的方向是向负坐标移动。

http://www.lryc.cn/news/195968.html

相关文章:

  • Spanner: Google’s Globally Distributed Database
  • Java基础——了解进制和位运算
  • mybatisplus 自定义mapper加多表联查结合分页插件查询时出现缺失数据的问题
  • 陪诊系统|陪诊软件革新陪诊体验解决病患难题
  • [Tkinter 教程08] Canvas 图形绘制
  • ES6 Symbol 数据结构
  • Redis常用数据类型、Redis常用命令
  • ERP系统是如何运作的?erp管理系统操作流程
  • springBoot复杂对象表示和lombok的使用
  • 如何选择最适合你的LLM优化方法:全面微调、PEFT、提示工程和RAG对比分析
  • Jenkins实现CI/CD发布(Ansible/jenkins共享库/gitlab)
  • 使用navicat查看类型颜色
  • iOS 中,Atomic 修饰 NSString、 NSArray,也会线程不安全
  • 2023医药微信公众号排名榜top100汇总合集
  • 基于YOLO算法的单目相机2D测量(工件尺寸和物体尺寸)三
  • Cython编译文件出错
  • WPF 用户控件依赖注入赋值
  • leetcode-48.旋转图像
  • antd的RangePicker设置默认值,默认近七天(andt+react)
  • 大数据可视化模块竞赛Vue项目文件结构与注意事项
  • 户外运动盛行,运动品牌如何利用软文推广脱颖而出?
  • 2024年孝感市建筑类中级职称申报资料私企VS国企
  • OpenResty安装
  • 通过stream对list集合中对象的多个字段进行去重
  • 招投标系统软件源码,招投标全流程在线化管理
  • css设置文本溢出隐藏...
  • 【小尘送书-第八期】《小团队管理:如何轻松带出1+1>2的团队》
  • 【网络协议】聊聊ifconfig
  • python项目之AI动物识别工具的设计与实现(django)
  • 全流量安全分析发现内部系统外联异常