Unity3D UGUI运行时实现Editor视窗中的UI编辑功能

实现UGUI运行时Editor视窗中的UI编辑功能

最近在做仿真课件,有个这样的需求,老师希望自己的文本框可以自己编辑,比如自由拉伸,调节大小,其实就是这样一个功能,可以让他进入一个编辑模式,在此模式下可以调整文本框UI,这不就是实现一个UnityEditor视窗中的UI控件调整位置大小的功能嘛,我只能感叹老师真会玩~

UI的布局错综复杂,实时调整UI控件的大小位置要小心,因为我们肯定是要RectTransform中可读写的属性来实现的,必须要搞清楚它们在各种布局下的意义,具体见之前发过的文章 :Unity3D UGUI锚点布局知识
我开始想的是改变AnchorPositon,Rect.x,Rect.y这些属性来改变UI大小,可这样要考虑在不同布局,不同锚点情况下有不同的算法,想想都头皮发麻。。
我在翻看官方文档时无意间发现了这个API RectTransform.SetInsetAndSizeFromParentEdge,详见SetInsetAndSizeFromParentEdge 官方的描述是根据父物体的Edge(某一边)去布局。其中第一个参数就是用于确定基准的边,第二个参数是UI元素的该边界与父物体该边界的距离,第三个元素是设定选定轴上UI元素的大小,让我产生了围绕它来做文章的念头,毕竟懒惰的拿来主义是程序猿的天性,那么现在的思路就很明确了,我们操作先后发生的事件,比如调整左侧边他们的实现步骤就是: 鼠标移动到控件边缘------>可以拖拽调整大小了--------->按下鼠标拖拽左侧边框时用先计算出此时距离父节点右侧边的距离和当前x轴方向上控件大小,算出鼠标x轴方向移动差值,利用这个API调整控件大小-------->松开鼠标操作结束。思路搞清了,代码写起来就简单了,实现效果如下:
在这里插入图片描述
源码见:Resizecomponent

  • 2
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值