【Unity之FGUI】白仙章Fairy GUI控件详解二


👨‍💻个人主页@元宇宙-秩沅

👨‍💻 hallo 欢迎 点赞👍 收藏⭐ 留言📝 加关注✅!

👨‍💻 本文由 秩沅 原创
👨‍💻 收录于专栏就业宝典

⭐🅰️推荐专栏⭐

⭐-[今日信息差点击进入⭐



文章目录


⭐前言⭐


😶‍🌫️8.按钮(一个扩展组件)



+ 文本标题和图形标题勾选后

  • 四个状态(未按,按下,进入,退出)
  • 元件功能属性
csharp 复制代码
   

        //1.获取按钮控件
        GButton btn = view.GetChild("按钮名").asButton;
        btn.text = "按钮的内容";
        btn.icon = "ui://xx/xxxx";//图标

        GObject obj = view.GetChild("按钮名");
        obj.text = "";
        obj.icon = "ui://xx/xxxx";
  • 若面板上未如此设置,则通过以下代码动态创建
csharp 复制代码
        //2.音效相关设置
        UIConfig.buttonSound =   (NAudioClip)UIPackage.GetItemAssetByURL("ui://xx/xxx");
        //设置默认音效,放在显示面板之前,不在这里
        UIConfig.buttonSoundVolumeScale = 0.5f;   //设置音效大小
        GRoot.inst.EnableSound();   //开启音效
        GRoot.inst.DisableSound();  //关闭音效      
        GRoot.inst.soundVolume = 0.5f;  //调整全局声音大小 ,包括 按钮 和 动效
        //3.事件监听相关
        btn.onClick.Add(() =>
        {
            print("按钮被点击");
        });
        btn.FireClick(true, true);        //通过代码控制是否触发按钮
        btn.onClick.Call();     //触发按钮中监听的函数 但是没有点击效果

😶‍🌫️9.单选和复选按钮


  • 复选按钮
  • 单选按钮

①需要添加一个控制器

②点击连接

③即可形成互斥效果的单选按钮

csharp 复制代码
 UIConfig.buttonSound = (NAudioClip)UIPackage.GetItemAssetByURL("ui://Teach/btnMusic"); 
 //设置默认音效
 UIConfig.buttonSoundVolumeScale = 0.5f;
 GComponent view = UIPackage.CreateObject("包名", "组件名").asCom;
 GRoot.inst.AddChild(view);
 //1.获取单选和多选框
 GButton check = view.GetChild("按钮名").asButton;
 GButton radio = view.GetChild("按钮名").asButton;
 check.selected = true; //改变选中状态
 radio.selected = true; //改变选中状态
 Controller c = view.GetController("控制器名字"); //单选按钮来 建议通过获取控制器去切换选择状态
 c.selectedIndex = 1;

 //2.事件相关
 checkBox.onChanged.Add(() =>
 {
     print("状态现在为" + check.selected);
 });

😶‍🌫️10.进度条(本质:组件)


  • 原理:就是按进度改变一个元件的宽度、高度或填充比例
  • 自动创建
  • 手动创建规则

在组件中按特定规则添加元件即可制作为进度条

组件中关键元件名内部规则:

  • bar:横向进度条改变宽度的元件。处于最大值时的宽度(可以是任意类型元件)
  • bar_v: 纵向进度条改变高度的元件。
  • title: 用于显示进度的标题,可以是装载器,标签,按钮
  • ani:如果进度条是序列帧动画,则0~100对应动画的帧索引

注意:设置bar的宽度为进度条,设置bar_v的高度为进度条处于最大值时的高度(可以是任意类型元件)

  • API相关:
csharp 复制代码
    //1.设置默认音效
    UIConfig.buttonSound = (NAudioClip)UIPackage.GetItemAssetByURL("ui://包名/音效名");
    UIConfig.buttonSoundVolumeScale = 0.8f;
    GComponent view = UIPackage.CreateObject("包名", "组件名").asCom;
    GRoot.inst.AddChild(view);
    //2.获取进度条
    GProgressBar pb = view.GetChild("进度条名").asProgress;
    //3.改变进度
    pb.value = 30;
    pb.TweenValue(100, 3); //让进度3秒内缓慢的变到100 

😶‍🌫️11.滑动条(本质:组件)


  • 滑动条与进度条相似,滑动条只是增加了一个按钮


  • 组件中关键元件名规则:

     bar:横向滑动条改变宽度的元件。
     bar_v: 纵向滑动条改变高度的元件。        title: 用于显示进度的标题,可以是文本、装载器,标签,按钮
     grip:用于拖动的按钮
    

注意:

①设置bar_v的高度为滑动条处于最大值时的高度(可以是任意类型元件)

②grip按钮应该与bar对象建立一个关联,并放置在进度条处于最大值时的位置。这个关联是:

③正向:grip左左关联到bar或者顶顶关联到bar_v;

④反向:grip顶顶关联到bar或者底底关联到bar_v。

csharp 复制代码
 //1.获取滑动条
 GSlider slider = view.GetChild("滑动条名").asSlider;
 //2.改变进度
 slider.value = 100;
 //3.事件
 slider.onChanged.Add(() =>
 {
     print(slider.value);
 });

😶‍🌫️12.滚动条(本质:组件)


  • 需要配合滚动容器使用,是可选控件

  • 自动创建

  • 手动创建

      组件中关键元件名规则
      arrow1(可选):垂直滚动条时,代表上侧的按钮
      arrow2(可选):垂直滚动条时,代表下侧的按钮
      grip:表示滚动条中间的滑块按钮
      bar:限制区域,作占位用途
    
  • 需要配合滚动容器使用,现在还不可使用


😶‍🌫️13.滚动容器(本质:组件)


  • 组件的溢出处理设置为" 滚动",那么该组件就成为了滚动容器
  • 属性相关:

    滚动条显示:默认勾选

    边缘回弹效果:默认勾选

    触摸滚动效果:默认勾选

  • 页面模式:

    以视口大小为页面大小,每次滚动的距离是一页。一般在移动平台上使用,PC上较少,拖动滚动条进行滚动操作与这个模式冲突。

  • 浮动显示:

    勾选后,滚动条不占据视口的位置,而是直接覆盖在视口上面。例如一个适用于手机的滚动条,它是细条且半透明的,只在滚动时才显示出来,用于提示滚动位置。那么我们把它设置为"浮动",这样就不会挤占视口的显示空间。

  • 简单效果
  • 相关API
csharp 复制代码
        //1.获取滚动容器
        ScrollPane scrollPanel;
        GComponent scroll = view.GetChild("滚动条名").asCom;
        scrollPanel = scroll.scrollPane;
        //2.滚动位置设置
        scrollPanel.posY = 0;
        scrollPanel.SetPercY(0.5f, true);  //按百分比滚动
        print(scrollPanel.viewWidth); //视口宽高
        print(scrollPanel.viewHeight);
        print(scrollPanel.contentWidth); //内容宽高
        print(scrollPanel.contentHeight);
        scrollPanel.ScrollToView() //设置指定元件出现在视口内
        scrollPanel.touchEffect = true;//触摸功能开关
        //3.事件相关
        scrollPanel.onScroll.Add(() =>  //当滚动视图位置改变时 
        {});
        scrollPanel.onScrollEnd.Add(() =>  //惯性移动停止回调
        { });
        scrollPanel.onPullDownRelease.Add(() =>  //下拉刷新回调
        {  });
        scrollPanel.onPullUpRelease.Add(() =>     //上拉刷新回调
        {});

😶‍🌫️14.列表(本质:组件)


组件的一种特殊扩展

在组件的基础上加入排序相关的功能

相关属性

  • 渲染顺序拱形:自定义一个索引显示在最前面,两侧的依次渲染
  • 选择控制:
    可以和控制器联动,这样当列表选中项目发生改变时,控制器也同时跳转到相同索引的页面
  • 分页控制:
    可以绑定一个控制器。当列表发生翻页滚动时(溢出处理必须为三种滚动之一,滚动必须勾选为页面模式),控制器也同时跳转到相同索引(页码)的页面。反之亦然,如果控制器跳转到某个页面,那么列表也同时滚动到相同索引(页码)的页面。
  • 项目资源
  • 编辑列表
  • 自动调整列表项目大小(默认不勾选,勾选可能会拉伸图像)
csharp 复制代码
        //默认竖直滚动条
        UIConfig.verticalScrollBar = "ui://包名/列表名";
        GComponent view = UIPackage.CreateObject("包名", "组件名").asCom;
        GRoot.inst.AddChild(view);
        //1.获取列表
        GList list = view.GetChild("列表名").asList;
        //2.组件的 添加和移除
        GObject obj = list.AddChild(UIPackage.CreateObject("包名", "图片名"));
        list.RemoveChild(obj);//移除列表
        obj.Dispose();//销毁

        //从列表缓存池池中取出或新建对象添加到列表中
        
        GObject obj3 = list.AddItemFromPool()//池子里new 个对象
        list.RemoveChildToPool(obj3); //删除一个item,并将对象返回池中
        list.AddItemFromPool();     //现在池子里面有一个对象 会直接取出来        
        list.RemoveChildToPoolAt(0);//删除指定位置item,并返回池中
        list.RemoveChildrenToPool();//删除一个范围内的item,或者全部删除,返回池子
         list.RemoveChildrenToPool(0,50);  //移除指定索引位置的对象                   
         list.GetFromPool("url地址")//从池中取出对象,并不会添加到列表中
          ReturnToPool//将对象返回池中,并不会从列表中移除

        //3.使用回调函数修改列表
        list.itemRenderer = RenderListItem;
        list.numItems = 20; //自动创建20个对象,在委托函数中进行初始化操作       
        list.numItems = 10; //每次重新赋值 会留下10个对象 多余的对象 放入池子中
        list.numItems = 20;//如果在重新变成20 多出来的10个 是之前放入池子的10个      
       list.ResizeToFit(); //重置大小
        //4.事件相关
        list.onClickItem.Add((obj) =>
        {
            print((obj.data as GObject).text);
        });
    private void RenderListItem(int index, GObject obj)//作为回调函数
    {
        //初始化创建的每一个对象
        obj.text = index.ToString();
    }
}
  • 虚拟列表和循环列表

虚拟列表,节约性能,如要创建1000个显示物件,但是列表中只能显示20个,每次滑动时,只更新这20个物件,达到显示1000个的效果

虚拟列表使用的前提条件

    1.必须要定义itemRenderer
    2.必须要开启滚动相关
    3.一开始就要把项目资源设置好 或者 我们可以通过代码设置项目资源
csharp 复制代码
list.defaultItem = "通过url地址去关联项目资源";
  • 开启虚拟列表
csharp 复制代码
         list.SetVirtual();
  • 循环列表只支持 单行或者单列布局,不支持流动布局和分页布局

若列表循环20个,则滚动列表一直是重复这二十个物件

csharp 复制代码
        list.SetVirtualAndLoop();
        list.numItems = 20;

😶‍🌫️15.下拉框(本质:组件)


  • 自动创建

  • 手动创建

1.弹出组件的构成:背景图(与list宽高关联)+垂直滚动列表(命名为list并关联好项目资源)

2.button 下拉框需要一个按钮控制器(下拉框点击展开时,保持在down页,收回时保持在up也或over页)

3.title 可以是普通文本、富文本、标签、按钮

  • 相关API
csharp 复制代码
  //1.获取下拉框
  GComboBox comboBox = view.GetChild("下拉框的而名字").asComboBox;
  //2.代码初始化内容
  comboBox.items = new string[] { "选1", "选2" , "选3" , "选4" };
  comboBox.icons = new string[] { "ui://包名/图片1", "ui://包名/图片2", "ui://包名/图片3", "ui://包名/图片4" };
  comboBox.values = new string[] { "11", "22", "33", "44" };
  
  print(comboBox.selectedIndex);  //通过索引通过他就可以得到 内容 图标 值
  print(comboBox.value);  //值 快捷获取值
  comboBox.selectedIndex = 2;  //通过索引设置
  comboBox.value = "44";  //通过值设置
  GRoot.inst.HidePopup();//代码关闭弹出项
  //3.事件相关
  comboBox.onChanged.Add(() =>
  {
      print("下拉框改变了" + comboBox.selectedIndex + "_" + comboBox.items[comboBox.selectedIndex]);
  });
  

🪶(快捷键)


  • 拖动视图:鼠标滚轮
  • 重命名组件:F2
  • 成组:ctrl + G

⭐🅰️⭐


【Unityc#专题篇】之c#进阶篇】

【Unityc#专题篇】之c#核心篇】

【Unityc#专题篇】之c#基础篇】

【Unity-c#专题篇】之c#入门篇】

【Unityc#专题篇】---进阶章题单实践练习

【Unityc#专题篇】---基础章题单实践练习

【Unityc#专题篇】---核心章题单实践练习


你们的点赞👍 收藏⭐ 留言📝 关注✅是我持续创作,输出优质内容的最大动力!



相关推荐
程序猿多布4 小时前
Unity Excel导表工具转Lua文件
unity·excel
韩仔搭建15 小时前
七星棋牌顶级运营产品全开源修复版源码教程:6端支持,200+子游戏玩法,完整搭建指南(含代码解析)
游戏·开源
avi911118 小时前
[AI相关]Unity的C#代码如何简写
unity·c#·语法糖
Igallta_8136221 天前
【小游戏】C++控制台版本俄罗斯轮盘赌
c语言·开发语言·c++·windows·游戏·游戏程序
虾球xz1 天前
游戏引擎学习第114天
学习·游戏引擎
虾球xz1 天前
游戏引擎学习第109天
学习·游戏引擎
心疼你的一切1 天前
C# 中关于补位的写法 PadLeft,PadRight 函数
开发语言·unity·c#·游戏引擎·csdn·心疼你的一切
zsyzClb1 天前
nim游戏及其进阶 [SDOI2011] 黑白棋 [SDOI2019] 移动金币
游戏
BingLin-Liu1 天前
蓝桥杯备考:贪心算法之矩阵消除游戏
游戏·贪心算法·矩阵
沐沐森的故事1 天前
Unity for Python —— 强大的 Python 脚本支持提升 Unity 编辑器效率
python·unity·编辑器·pythonrunner·pythonengine