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

2024-05-28 10:44
文章标签 详解 unity 控件 gui fairy fgui 白仙章

本文主要是介绍【Unity之FGUI】白仙章Fairy GUI控件详解二，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

在这里插入图片描述

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

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

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

⭐🅰️推荐专栏⭐

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

文章目录

    • ⭐前言⭐
      • 😶‍🌫️8.按钮（一个扩展组件）
      • 😶‍🌫️9.单选和复选按钮
      • 😶‍🌫️10.进度条（本质：组件）
      • 😶‍🌫️11.滑动条（本质：组件）
      • 😶‍🌫️12.滚动条（本质：组件）
      • 😶‍🌫️13.滚动容器（本质：组件）
      • 😶‍🌫️14.列表（本质：组件）
      • 😶‍🌫️15.下拉框（本质：组件）
    • 🪶（==快捷键==）
    • ⭐🅰️⭐

⭐前言⭐

😶‍🌫️8.按钮（一个扩展组件）

在这里插入图片描述
在这里插入图片描述+ 文本标题和图形标题勾选后
在这里插入图片描述

  • 四个状态（未按，按下，进入，退出）
    在这里插入图片描述
  • 元件功能属性
    在这里插入图片描述
   //1.获取按钮控件GButton btn = view.GetChild("按钮名").asButton;btn.text = "按钮的内容";btn.icon = "ui://xx/xxxx";//图标GObject obj = view.GetChild("按钮名");obj.text = "";obj.icon = "ui://xx/xxxx";

在这里插入图片描述

  • 若面板上未如此设置，则通过以下代码动态创建
        //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.单选和复选按钮

在这里插入图片描述

  • 复选按钮
    在这里插入图片描述
  • 单选按钮

①需要添加一个控制器
在这里插入图片描述
②点击连接
在这里插入图片描述
③即可形成互斥效果的单选按钮
在这里插入图片描述

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相关：
    //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。

 //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
        //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.列表（本质：组件）

组件的一种特殊扩展
在组件的基础上加入排序相关的功能
在这里插入图片描述
相关属性

  • 渲染顺序拱形：自定义一个索引显示在最前面，两侧的依次渲染
  • 选择控制：
    可以和控制器联动，这样当列表选中项目发生改变时，控制器也同时跳转到相同索引的页面
  • 分页控制：
    可以绑定一个控制器。当列表发生翻页滚动时（溢出处理必须为三种滚动之一，滚动必须勾选为页面模式），控制器也同时跳转到相同索引（页码）的页面。反之亦然，如果控制器跳转到某个页面，那么列表也同时滚动到相同索引（页码）的页面。
  • 项目资源
    在这里插入图片描述
  • 编辑列表
    在这里插入图片描述
  • 自动调整列表项目大小（默认不勾选，勾选可能会拉伸图像）
    在这里插入图片描述
        //默认竖直滚动条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.必须要定义itemRenderer2.必须要开启滚动相关3.一开始就要把项目资源设置好 或者 我们可以通过代码设置项目资源

list.defaultItem = "通过url地址去关联项目资源";
  • 开启虚拟列表
         list.SetVirtual();
  • 循环列表只支持 单行或者单列布局，不支持流动布局和分页布局

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

        list.SetVirtualAndLoop();list.numItems = 20;

😶‍🌫️15.下拉框（本质：组件）

  • 自动创建
    在这里插入图片描述
    在这里插入图片描述

  • 手动创建

1.弹出组件的构成：背景图（与list宽高关联）+垂直滚动列表（命名为list并关联好项目资源）
2.button 下拉框需要一个按钮控制器（下拉框点击展开时，保持在down页，收回时保持在up也或over页）
3.title 可以是普通文本、富文本、标签、按钮

在这里插入图片描述

  • 相关API
  //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#专题篇】—核心章题单实践练习

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

在这里插入图片描述

这篇关于【Unity之FGUI】白仙章Fairy GUI控件详解二的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！


http://www.chinasem.cn/article/1010341。

相关文章

Spring Security基于数据库验证流程详解

Spring Security基于数据库验证流程详解

Spring Security 校验流程图 相关解释说明（认真看哦） AbstractAuthenticationProcessingFilter 抽象类 /*** 调用 #requiresAuthentication(HttpServletRequest, HttpServletResponse) 决定是否需要进行验证操作。* 如果需要验证，则会调用 #attemptAuthentica
阅读更多...
OpenHarmony鸿蒙开发（ Beta5.0）无感配网详解

OpenHarmony鸿蒙开发（ Beta5.0）无感配网详解

1、简介 无感配网是指在设备联网过程中无需输入热点相关账号信息，即可快速实现设备配网，是一种兼顾高效性、可靠性和安全性的配网方式。 2、配网原理 2.1 通信原理 手机和智能设备之间的信息传递，利用特有的NAN协议实现。利用手机和智能设备之间的WiFi 感知订阅、发布能力，实现了数字管家应用和设备之间的发现。在完成设备间的认证和响应后，即可发送相关配网数据。同时还支持与常规Sof
阅读更多...
6.1.数据结构-c/c++堆详解下篇（堆排序，TopK问题）

6.1.数据结构-c/c++堆详解下篇（堆排序，TopK问题）

上篇：6.1.数据结构-c/c++模拟实现堆上篇（向下，上调整算法，建堆，增删数据）-CSDN博客 本章重点 1.使用堆来完成堆排序 2.使用堆解决TopK问题 目录 一.堆排序 1.1 思路 1.2 代码 1.3 简单测试 二.TopK问题 2.1 思路(求最小)： 2.2 C语言代码（手写堆） 2.3 C++代码（使用优先级队列 priority_queue）
阅读更多...
Java 创建图形用户界面（GUI）入门指南（Swing库 JFrame 类）概述

Java 创建图形用户界面（GUI）入门指南（Swing库 JFrame 类）概述

概述 基本概念 Java Swing 的架构 Java Swing 是一个为 Java 设计的 GUI 工具包，是 JAVA 基础类的一部分，基于 Java AWT 构建，提供了一系列轻量级、可定制的图形用户界面（GUI）组件。 与 AWT 相比，Swing 提供了许多比 AWT 更好的屏幕显示元素，更加灵活和可定制，具有更好的跨平台性能。 组件和容器 Java Swing 提供了许多
阅读更多...
K8S（Kubernetes）开源的容器编排平台安装步骤详解

K8S（Kubernetes）开源的容器编排平台安装步骤详解

K8S（Kubernetes）是一个开源的容器编排平台，用于自动化部署、扩展和管理容器化应用程序。以下是K8S容器编排平台的安装步骤、使用方式及特点的概述： 安装步骤： 安装Docker：K8S需要基于Docker来运行容器化应用程序。首先要在所有节点上安装Docker引擎。 安装Kubernetes Master：在集群中选择一台主机作为Master节点，安装K8S的控制平面组件，如AP
阅读更多...
嵌入式Openharmony系统构建与启动详解

嵌入式Openharmony系统构建与启动详解

大家好，今天主要给大家分享一下，如何构建Openharmony子系统以及系统的启动过程分解。 第一：OpenHarmony系统构建      首先熟悉一下，构建系统是一种自动化处理工具的集合，通过将源代码文件进行一系列处理，最终生成和用户可以使用的目标文件。这里的目标文件包括静态链接库文件、动态链接库文件、可执行文件、脚本文件、配置文件等。      我们在编写hellowor
阅读更多...
LabVIEW FIFO详解

LabVIEW FIFO详解

在LabVIEW的FPGA开发中，FIFO（先入先出队列）是常用的数据传输机制。通过配置FIFO的属性，工程师可以在FPGA和主机之间，或不同FPGA VIs之间进行高效的数据传输。根据具体需求，FIFO有多种类型与实现方式，包括目标范围内FIFO（Target-Scoped）、DMA FIFO以及点对点流（Peer-to-Peer）。 FIFO类型 **目标范围FIFO（Target-Sc
阅读更多...
019、JOptionPane类的常用静态方法详解

019、JOptionPane类的常用静态方法详解

目录 JOptionPane类的常用静态方法详解 1. showInputDialog()方法 1.1基本用法 1.2带有默认值的输入框 1.3带有选项的输入对话框 1.4自定义图标的输入对话框 2. showConfirmDialog()方法 2.1基本用法 2.2自定义按钮和图标 2.3带有自定义组件的确认对话框 3. showMessageDialog()方法 3.1
阅读更多...
脏页的标记方式详解

脏页的标记方式详解

脏页的标记方式 一、引言 在数据库系统中，脏页是指那些被修改过但还未写入磁盘的数据页。为了有效地管理这些脏页并确保数据的一致性，数据库需要对脏页进行标记。了解脏页的标记方式对于理解数据库的内部工作机制和优化性能至关重要。 二、脏页产生的过程 当数据库中的数据被修改时，这些修改首先会在内存中的缓冲池（Buffer Pool）中进行。例如，执行一条 UPDATE 语句修改了某一行数据，对应的缓
阅读更多...
lvgl8.3.6 控件垂直布局 label控件在image控件的下方显示

lvgl8.3.6 控件垂直布局 label控件在image控件的下方显示

在使用 LVGL 8.3.6 创建一个垂直布局，其中 label 控件位于 image 控件下方，你可以使用 lv_obj_set_flex_flow 来设置布局为垂直，并确保 label 控件在 image 控件后添加。这里是如何步骤性地实现它的一个基本示例： 创建父容器：首先创建一个容器对象，该对象将作为布局的基础。设置容器为垂直布局：使用 lv_obj_set_flex_flow 设置容器
阅读更多...

Copyright China编程 23002807@qq.com

沪ICP备2023033072号-2