一、新建一个名为TestMiniMap的UserWidget用来使用小地图StaticMiniMap。

二、在左侧“User Created”面板中可以看到除自身以外的其他所有用户创建的UserWidget。把“Static Mini Map”拖放进来,并勾选“Size To Content”。

Static Mini Map只有与小地图逻辑相关的功能(如何移动、如何旋转等等),而小地图怎么使用,则放在“TestMiniMap”中,这样分开比较合理。

二、在Static Mini Map中,使用OverLay作为根节点

  1.添加一个名为MapImageWidget的Image组件用来显示地图缩略图。

  2.添加名为FlagPanel的Canvas Panel作为显示对象小图标的画布,Canvas Panel的子对象可以自由设置坐标点定位。

  3.在运行时往FlagPanel容器动态添加图标,并设置图标位置。

  4.MapImageWidget和FlagPanel的对齐方式都设置为完全填充。

  

  5.MapImageWidget和FlagPanel是完全叠加关系,因此需要父级对象是Overlay组件

三、在StaticMiniMap中完善SetupMap函数。给Image动态设置图片使用Set Brush from Texture函数,Match Size:让Image组件的大小与Texture的大小一致。

四、在TestMiniMap中调用StaticMiniMap的Setup函数,设置需要使用的地图缩略图。fps_MimiMap是导入到UE4中的一张jpg图片。

五、运行游戏,可以看到左上角的地图出来了,但是小地图很大,目前小地图的显示尺寸是512*512,正好是缩略图的尺寸一致。

   1.StaticMiniMap中的SetupMap中勾选了Match Size选项,并且MapImageWidget的对齐方式完全填充。

   

  2.在TestMiniMap中添加的StaticMiniMap的勾选了Size To Content选项

  

  3.因此小地图在运行时呈现出来了的尺寸就是缩略图的尺寸。

六、取消勾选在TestMiniMap中添加的StaticMiniMap的Size To Content选项,并且设置一个合适的Size X和Size Y。再次运行游戏,可以看到小地图尺寸变成了设置的Size X和Size Y了。

[UE4]小地图UI设计的更多相关文章

  1. [UE4]小地图UI放在哪里创建合适?

    在常见的FPS游戏中,玩家死亡以后,还是可以进行聊天和漫游的,因此聊天UI和小地图都应该放在PlayerState中创建

  2. [UE4]小地图接口设计

    一.地图缩略图片 二.要显示的图标及其对应的Actor 三.比例尺 四.对位点,只需要一个对位点就可以了. 函数名称 SetupMap 函数功能 设置地图 参数类型 MapImage:地图缩略图 Ma ...

  3. UI设计--大象无形

      UI设计,大象无形 UI设计,如同优雅的艺术品一样,优秀的UI设计也可以大象无形,大象无形的意思是有意化无意.大象化无形!就是不要显刻意,不要过分的主张,要兼容百态.无形态无框架才能容纳一切形体! ...

  4. Epic Games工程师分享:如何在移动平台上做UE4的UI优化?

    转自:https://blog.csdn.net/debugconsole/article/details/79281290 随着技术的不断升级,高性能的引擎逐渐受到越来越多研发商的青睐,UE4就是其 ...

  5. 缩放因子和UI设计

    一.PPI 1.像素密度PPI:PPI(Pixel Per Inch by diagonal):表示沿着对角线,每英寸所拥有的像素(Pixel)数目. 根据勾股定理(直角三角形两边为a和b,斜边为c, ...

  6. Android 腾讯入门教程( 智能手表UI设计 和 MVC模式 )

    *****注意到mvc 在android 中是如何进行分层分域执行各自的功能.**** 官方推荐的按钮尺寸是48像素 前端之Android入门(1):环境配置 前端之Android入门(2):程序目录 ...

  7. eclipse里打开SWT项目找不到source/design的图形UI设计界面

    因为前天重新装了个新版的eclipse, 结果今天打开一个SWT的项目,突然找不到source/design的图形UI设计的两个切换按钮 我把SWT组件重新装了还是找不到.结果后来发现是因为重装ecl ...

  8. 分享20个最新的免费 UI 设计素材给设计师

    用户界面设计涉及到很多的创意,灵感以及需要与客户进行有效沟通的技能.良好的用户界面是一致的,可以使网站更容易理解和使用.UI设计的重点在于用户体验和互动,同时易于使用对于一个成功的移动应用程序来说非常 ...

  9. UI设计中的48dp定律【转】

    有朋友建议我偶尔写写技术类的文章,所以我打算开始穿插性的写一些偏技术方面的科普文章,尽量往小白能看懂的方向写,今天我来讲讲UI设计中的48dp定律. 那么先说说什么是dp ?其实对于一个非技术人员要把 ...

随机推荐

  1. 【BZOJ1497】【NOI2006】最大获利

    最小割好劲啊 原题: 新的技术正冲击着手机通讯市场,对于各大运营商来说,这既是机遇,更是挑战.THU集团旗下的CS&T通讯公司在新一代通讯技术血战的前夜,需要做太多的准备工作,仅就站址选择一项 ...

  2. CH4901 关押罪犯

    题意 4901 关押罪犯 0x49「数据结构进阶」练习 描述 S 城现有两座监狱,一共关押着N 名罪犯,编号分别为1~N.他们之间的关系自然也极不和谐.很多罪犯之间甚至积怨已久,如果客观条件具备则随时 ...

  3. Oracle数据库的学习

    复制数据库结构到另外一数据库的的语句,首先在数据库创建链接,比如我在131数据库,dblink_018 的018为链接名称,随便取 ,可在此表查看数据库链接 select * from dba_db_ ...

  4. 【添加tomcat里lib下的jar包】eclipse中The project cannot be built until build path errors are resolved

    问题描诉:在eclipse中新建了一个web项目,把myeclipse中正常的项目拷贝到eclipse的src和webcontent目录 然后项目中就出现了× 注意项目中Errors

  5. mac 终端光标在单词之间移动

    https://ruby-china.org/topics/1241#reply16 you can use :  option + b / f not  ctrl  + <- / ->

  6. 家庭记账本web开发

    这个系统的整体结构: GitHub:https://github.com/lq1998lq/Test.git com.action包: package com.action; import java. ...

  7. spring boot 学习资料

    spring boot 学习资料: 学习资料 网址 Spring Boot Cookbook-极客学院 http://wiki.jikexueyuan.com/project/spring-boot- ...

  8. Github使用说明 --整理者米米

    打开百度搜索Git官网下载对应的windows版本 傻瓜式默认安装,点击完成 PS:安装的过程比较慢 安装完成后打开命令行窗口(cmd) 查看版本号------git --version   安装成功 ...

  9. Hive介绍和Hive环境搭建

    一.Hive介绍 Hive包含用户接口.元数据库.解析器和数据仓库等组件组成,其中用户接口包含shell客户端.JDBC.ODBC.Web接口等.元数据库主要是指定义在hive中的表结构信息,一般保存 ...

  10. Ambari安装常见问题

    参考自: http://blog.csdn.net/xingxc111/article/details/70667574 http://blog.csdn.net/xfg0218/article/de ...