Unity基础之UI插件

c#快捷键
ctrl+k+d-格式化
跟组件绑定的事件要自己写单独的函数
进到新工程里先把当前场景保存一下:Assets->Create->Folder->Scene(用来存当前场景)
1.创建画布:右键->Create->UI->Canvas(此时会自动出来EventSystem组件,内含Event                       System(Script)和Standalone Input Module(Script)用来处理事件的发送,接收等)
2.Canvas中Render Mode渲染模式:有Overlay(覆盖屏幕),Camera(相机视角),World三种)
3.Overlay两个特点:映射方式:会按一个像素对应一个单位长度的方式设置画布大小,此模式不需要u摄像机,永远出现在所有摄像机的最前面。【正式的游戏界面】Rect Transform里的属性无法修改
创建Canvas的主物体:Canvas->右键UI->Image
Anchors:锚点
Canvas Renderer:画布渲染器(不可修改)

*Image (script)(用来设置图片组件)中
图片转化成sprite(精灵图)拖到image里:两种情况
裁剪成多张图片:选中图片-》Texture Type-》Sprite (2D and UI)-》Sprite Mode-》Multiple(多张)-》Sprite Editor(编辑)->三角-》type-》Grid By Cell count-》几列几行-》slice-》插-》apple
如果是单张:选中图片-》Texture Type-》Sprite (2D and UI)-》Sprite Editor(编辑)->apple
然后,在Image-》点击生成的图片(拖)-》√Image (script)-》Source Image-》None (sprite)


Source Image:原图片 
想让一张图片再UGUI中使用必须Texture Type->Sprite(2D and uI)想使用哪张图片就把哪张图片拖到Image (script)->Source Image->None (Material材质)
或者Set Native size(设置本地大小:原图大小)
Color:起颜色叠加作用
Preserve Aspect:保持原本宽高比时勾上
Image Type:图片类型(四种)
simple:简单模式(系统默认)
Tiled:堆叠模式
Sliced:切片模式。点图片->Sprite Mode->Multiple->Apply
Filled:填充模式
Fill Method:填充方法  
Horizontal:水平
Vertical:竖直
Radial 360:360度的放射状
Fill Origin:填充的初始位置
Fill Amount:填充的比列/数量  
Bottom:底部
Clockwise:填充时的方向(勾上顺时针,不勾逆时针)
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;

public class TestImageFilled : MonoBehaviour
{
    //冷却时间
    public folat coldTime = 2;
    //当前图片的Image组件
    Image selfImage;
    // Start is called before the first frame update
    void Start()
    {
        //获取当前图片的Image组件
        selfImage = this.GetComponent<Image>();
        //设置当前图片类型为填充
        selfImage.type = Image.Type.Filed;
        //设置当前图片的填充方法
        selfImage.fillMethod = selfImage.FillMethod.Radial1360;
        //设置当前图片的填充初始位置
        selfImage.fill0rigin = 2;
        //设置当前图片的填充比例
        selfImage.fillAmount = 0;

    }

    // Update is called once per frame
    void Update()
    {
        //如果填充比例小于1
        if(selfImage.fillAmount < 1)
        {

            selfImage.fillAmount += (1.0F/coldTime*coldTime.deltaTime);
        }
    }
}


*Text组件
Text (Script):文字属性
Character:字体相关
Font:字体(选中需要的字体拖进框中)
windows提供常见字体:C:\Windows\Fonts(.OTF或.TTF)
Font Style:字体风格
    Normal:正常
    Bold:加粗
    ltalic:斜体
    Bold And Italic:加粗斜体
Line Spacing:行边距
Rich Text:副文本编辑(可对部分内容进行加粗或斜体)
例如:
<b>New Text大家好New</b> <i>Text大家好</i><color="red">New Text大家好</color>
Paragraph:段落
   Alignment:对齐
Align By Geometr:按几何体对齐
Horizontal Overflow:水平方向溢出
    wrap:回卷,换行
Vertical Overflow:垂直方向溢出
    Truncate:截短(竖直方向能显示多少就显示多少)
Best Fit:自适应(勾上可设字体大小范围)
Material:材质
Raycast Target:再射线机制中当前文本框是否作为射线的目标(默认打勾,是)

*计时器

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;
using UnityEngine.WSA;
using System;

public class TimerText : MonoBehaviour
{
    //当前文本框的字体文件
    public Font targetFont;
    //当前文本框的text组件
    private Text selfText;
    //计时器
    private float timer;
    // Start is called before the first frame update
    void Start()
    {
        //获取当前文本框的text组件
        selfText = this.GetComponent<Text>();
        //指定字体
        selfText.font = targetFont;
        //指定字号
        selfText.fontSize = 40;
        //指定字体格式
        selfText.fontStyle = FontStyle.Normal;
        //指定字体颜色
        selfText.color = Color.red;
        //指定字体的对齐格式
        selfText.alignment = TextAnchor.MiddleCenter;


        //是否支持富文本编辑
        selfText.supportRichText = true;
        //初始时即使为0
        timer = 0;


    }

    // Update is called once per frame
    void Update()
    {
        //计时器逐帧计时
        timer += Time.deltaTime;
        //将以秒为单位的计时转换为TimeSpan类型
        TimeSpan tempTimeSpan = new TimeSpan(0, 0, (int)timer);
        //显示当前的计时
        selfText.text = tempTimeSpan.Hours.ToString("00") + ":" +
           "<color=\"yellow\">" + tempTimeSpan.Minutes.ToString("00") +"</color>"+ ":" +
            "<color=\"cyan\">" + tempTimeSpan.Seconds.ToString("00") + "</color>";


    }
}

*按钮组件:Button (script)
Interactable:视图可交互
Transition:过渡,指多个状态的随意切换


  Normal Color:普通时的状态
  Highlighted Color:高亮时的状态
  Pressed Color:按下按钮时的状态
  Disabled Color:禁用时的状态
  Fade Duration:颜色渐变的周期
  Color Multiplier:颜色放大倍数(会使颜色变浅)

Button:
Transition:sprite swap
Target Graphic:正常状态
  Animation:动画的过度
Auto Generate Anir ation;自动产生动画->新建文件夹为:Anim->新建文件夹,名字随意(用来存储动画 )
这时主栏会自动添加一个Animator(动画)组件

Window->Animation->Animation
Normal:正常
再做一个跟 之前按钮效果一模一样的按钮:UI->Button->Button(Script)里Transition:Animation->add...  搜Animation->把之前的拖到Animation的Controller里

Navigation:ui导航(当一个界面中存在多个按钮的时候允许使用键盘上的上下左右键在多个按钮之间进行选择切换)
Explicit:自定义
on click:
通过界面添加:点击+可添加函数
首先要配置物体的接受对象。把东西拖动到第二行
使图片变为原始大小Image.Setlativesize
Gameobject.name:点击后变名字
GameObject->SetActive (bool)
变为Gameobject.setActive:布尔类型函数(控制按钮是否禁用)
调整物体在子物体的使用顺序:
RectTransform->SetSiblinglndex (int)
变为RectTransform.setsiblingInde...
想让它第几就n-1
改图片:
lmage->Sprite sprite
变为Image.sprite
想继承于某个画布
RectTransform->SetParent (Transform)->把父级画布拖动到框中
通过脚本:

using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class EventTestButton : MonoBehaviour
{
    // Start is called before the first frame update
    void Start()
    {
        
    }

    // Update is called once per frame
    void Update()
    {
        
    }
    //方法,当前按钮被点击之后的操作
    public void EventTestButtonClick()
    {

        print("该按钮被点击");
    }


}

再点击+->EventTestButton.EventTes


    //方法,当前按钮被点击之后的操作
    public void EventTestButtonClick(int m)
    {
        print(m);
    }

    //方法,当前按钮被点击之后的操作
    public void EventTestButtonClick(string str)
    {

        print(str);
    }

 //方法,当前按钮被点击之后的操作
 public void EventTestButtonClick(GameObject target)
 {
     //名字,位置,内容
     print(target.name);
     print(target.transform.position);
     print(target.GetComponent<Text>().text);
 }


替换
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;

public class EventTestButton : MonoBehaviour
{
    // Start is called before the first frame update
    void Start()
    {
        this.GetComponent<Button>().onClick.AddListener(EventTestButtonClick);
    }

    // Update is called once per frame
    void Update()
    {
        
    }
    //方法

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值