UGui学习笔记

最新推荐文章于 2023-01-04 16:09:36 发布

肥肉183

最新推荐文章于 2023-01-04 16:09:36 发布

阅读量176

点赞数

分类专栏：学习学习笔记文章标签： unity

本文链接：https://blog.csdn.net/qq_29231163/article/details/111247114

版权

学习笔记同时被 2 个专栏收录

15 篇文章 0 订阅

订阅专栏

学习

3 篇文章 0 订阅

订阅专栏

精解UGUI

Sprite editor

！unity 锚点和轴心点的区别
http://www.cocoachina.com/articles/16570

自适应屏幕
https://blog.csdn.net/qq_15020543/article/details/82595179

GetLocalCorner
https://blog.csdn.net/kira0457/article/details/48639107

父子锚点重合->
子锚点在父锚点中央 -> 子只改变位置
子锚点在父边界—>
锚点在四周-> 子随着父改变大小，保证轴心点到锚点距离相等。

3-3 Sprite Packer -> 现在用Sprite Atlas
{
using UnityEngine.U2D;

SpriteAtlas spriteAtlas = AssetDatabase.LoadAssetAtPath<SpriteAtlas>("Assets/SpriteAtlas/junpingRobotAtlas.spriteatlas");

Sprite a = spriteAtlas.GetSprite("jumping_robot12");

}

3-4 原始图像
{
UI -> RawImage

原样显示图片纹理。

}

3-5 文本
{

Horizontal Overflow  水平换行方法   ->  自动换行，不换行
Vertical Overflow    垂直换行       ->  不显示超出字符串、显示超出范围字符串(Overflow)

富文本  Rich Text    P138   
	{
		粗体   <b> xxx </b>
		斜体   <i> xxx </i>
		颜色   <color=值> xxx </color>     ->  <color=#ff0000> 红色 </color> 	（注意<>内不能有空格，必须每个字都对应） 
		字体大小 <size=值> xxx </size>      ->  <size=70> xxx </size> 
	
	}
	
字体 Font   Text a;   a.Font = xxxx;

}

3-6 遮罩
{
Component -> UI-> Mask

要遮罩的物体-> 放子物体

}

3-7 特效
{
Component -> UI->Effects -> Shadow、Outline

Shadow  阴影特效
Outline 轮廓特效
Position As UV1 ?

}

3-8 UI渲染与性能
{
资源变更中-> 材质的变更是非常缓慢的处理称为SetPass
-> 提高渲染性能-> 减少SetPass的次数

渲染优化->P155  减少材质，纹理的变更。  UI元素尽量集中于一个纹理图集。
		元素的移动{移动前 取消勾选PixelPerfect  移动后勾选PixelPerfect 防止重新生成顶点}

优化工具P156 : Game视窗的Stats

	Windows -> Profiler
	
	Windows -> Frame Debugger

}

4-1 交互UI元素状态
{
P160
4状态： Normal Hightlighted Pressed Disaabled
}

4-2 事件
{ P163

按钮  ->  On Click()

Slider ->  OnValueChange(Single) 

button.onClick.AddListener(函数名)    ->  此处的函数不能带参数，否则报错。

！！实现带参函数添加监听事件需借用lambda方法。   button.onClick.AddListener(()=>函数名(parameter))；
Tip 简单功能直接使用lambda实现
button.onClick.AddListener(()=>
{
	print(..)
	...
	..
	//注意不能return。
});


Event Trigger组件
	设置非既定事件监听器，比如点击图片打开网站。
	添加Event Trigger组件
	
	
	注意场景中必须存在EventSystem ！！！！！！！！

}

4-3 按钮
{
添加监听事件: button.onClick.AddListener(函数名)
}
4-4 切换开关 Toggle
{
On Value Changed 将对象SetActive方法传入，就可实现对物体对象开启关闭的操作。

toggle.onValueChanged.AddListener(OnToggle->方法名);

Toggle Transition(切换过渡): ->  切换状态渐变->  视觉优化效果



public void Toggle(bool value)
{
	...
}	

切换开关组:
	开关组内Toggle同时只有一个可以处于激发状态-> 实现单选按钮。
	
创建空对象，添加ToggleGroup组件。
创建Toggle对象若干，设为ToggleGroup子物体，全选Toggle，将ToggleGroup物体设置为其Group对象。

}

4-5 滑块 Slider
{
UI -> Slider

Fill Rect ->   填充对象。 设置为None则可没有Fill Rect的滑块。
Handle Rect -> 滑块对象。 设置为None则可实现无滑块拖动。


注意添加OnValueChange方法时,添加函数需要包含一个float value 参数

slider.onValueChanged.AddListener(ChangImage);

public void ChangImage(float value);

}

4-6 滚动条 Scrollbar
{

}

4-7 滚动视图 Scroll Rect P191
{
{
创建父对象，添加Scroll Rect组件

子对象-> 取名ScrollContent
	如果需要ScrollContent的高度结合滚动内容而调整，则添加 Content Size Fitter 组件。
	Content Size Fitter 的Vertical Fit 组件设置为Preferred Size
	
将子对象拉入父对象Content中

遮盖溢出部分: -》 父对象添加image 和 Mask组件 

添加滚动条  设置 buttom to Top
}

Content 
Horizontal
Movement Type 滚动到顶点时的动作设置:    
	Unrestricted ：  滚动到顶点也一直滚动。
	Elastic:         滚动到顶点还能滚动一定量，之后回弹
	Clamped:         滚动到顶点不可滚动。
	
Inertia :  滚动惯性
	Deceleration Rate 衰减速度。

Scroll Sensitivity ：  滚轮敏感度

Horizontal Scrollbar,Vertical Scrollbar

事件->  On Value Changed(Vector2)

添加Marker对象的监听事件  ，选择 Rect Transform -> Dynamic Vector2 的anchoredPosition

基于Vector2 创建迷你地图。  P201   创建Mini Map  和 Marker  设置相应比例。

}

4-8 输入栏 input Field
{
Placeholder ：预显示文字
Text

TextComponent : 用户输入的文字
Text  ： 初始字符串

Character Limit: 可输入文字限制
Content Type: 输入栏类型  ->   
	Standard: 标准样式。   Autocorrected: 自动校正功能
	intergerNumber : 整数输入栏  Decimal Number：数值输入栏
	Alphanumeric: 字母    Name: 名字(会有大写)
	Email Address：  Password
	Pin: 个人识别码
	
LineType : 
	Single Line			不换行，Enter结束输入
	Multi Line Submit   自动换行，Enter结束输入
	Multi Line Newline  自动换行，Enter换行
	
Input Type：
	Standard
	Auto Correct
	Password

P212

Character Validation:  限制输入文字类型。
	None,integer,Decimal,Alphanumeric,Name,Email Address
	

Input Field事件：
	OnValueChange(String)
	On End Edit(String)

}

4-9 交互组件基本类 p218
{
interactable -> 是否可交互。

过渡-> Normal,Hightlighted,Pressed,Disaabled为四个状态，向各个状态转移时的效果为过渡：
	通过Transition 控制
	{
		Color Tint :  颜色渐变
		SpriteSwap ： 图像过渡
		Animation  :  动画-> 选择auto generate Animation。 
		
	}

导航？

}

5-1 布局元素 p226
{
最小尺寸 Minimum size

推荐尺寸 Preferred size

自适应尺寸 Flexible size

Layout Element:   P228
{
	ignore Layout :  勾选后不把它作为布局元素处理
	Min Width 、 Min Height  最小
	Preferred Width 、 Preferred Height  推荐
	Flexible Width 、 Flexible Height  自适应

}

5-2 布局控制器 P229
{
Layout controller

按照如下顺序来分配布局元素尺寸：
1.最小尺寸
2.推荐尺寸
3.自适应尺寸

Content Size Fitter：  P229
{
}

Aspect Ratio Fitter P230
{
	为布局元素设置宽高比的布局限制器。 固定宽高比。
	
	Aspect Mode ->  
	{
		Width Controls Height,Height controls width 基于设置的宽度或高度控制  高度或宽度
		Fit in parent  自动适应父元素的内侧
		Envelop Parent 自动适应父元素的外侧
	}
	Aspect Ratio : 宽高比

}

5-3 布局组 P233 ！
{
Layout group
-> Horizontal Layout group、Vertical Layout group
->
{
padding 到各边边距
spacing 子元素之间的间距
child Alignment 子元素对齐方式
child force expend 是否强制消去留白
}

	-> Grid Layout Group   网格组件 -> 道具栏
		->
		{
			Cell Size 每个单元的大小。
			padding
			spacing 
			Start Corner: 布局元素开始位置
			Start Axis: 布局元素放置方向
			child Alignment 对齐方式
			Constraint: 网格行列数		
		}

}

5-4 驱动属性 P240
{
无法调整的属性。
}

5-5 自定义布局
{

}

！！6-5 再次利用Cell 的Table View
{
P285

P288

P291 更新Cell

C# LinkedList -> 基于链表的列表。

}