Only know that the preform is used to generate objects? See how I use unity to generate UI prefabs

Recommended reading

• CSDN Home page

• GitHub Open source address

• Unity3D Plug in sharing

• Jane book address

• My personal blog

• QQ Group ：1040082875

One 、 Preface

This article introduces , How to use UI The prefabrication of , Instantiate the preform , And what is given to the prefabricated body when the prefabricated body is generated UI Properties can be set .

Two 、 Set up the scene

2-1  Prefabrication

such as , We want to make a human management software , Set up the scene ：

Make the information display of each person ：

Be careful ： to Content Added a GirdLayoutGroup Components are used to control the position of child nodes , Added a ContentSizeFitter Used for automatic capacity expansion Content The size of the component

New script PersonItem.cs Script , Edit code ：

using UnityEngine;
using UnityEngine.UI;

public class PersonItem : MonoBehaviour
{
 public Text ID;
 public Text Name; 
 public Text Sex; 
 public Text Age; 
 public Text Post;
 public Text Work;
 public Button ViewInfo;
 public Image Backgroud;
}


This script is attached to the prefabricated body , It is mainly used to control the information of prefabricated body ：

Then drag the prefabricated body from the scene to the Resources Make a prefabricated body in the folder ：

2-2  New personnel pop-up

Add an event to the close button ：

Click the close button , It hides the panel

2-2  Display personnel details pop-up

close button , The same can be ：

3、 ... and 、 Implementation code

Create a new one PersonControl.cs Script ：

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

public class PersonControl : MonoBehaviour
{
 public PersonItem PersonItemParfabs;// Personnel prefabrication
 public Transform PersonParent;// Personnel parent node

 public GameObject PopupAddInfo;// Popup   Add information
 public InputField InputName;
 public Dropdown DropSex;
 public InputField InputAge;
 public InputField InputPost;
 public InputField InputWorkExp;
 public Button BtnAddInfo;// Popup   Add information to all components

 public GameObject PopupShowInfol;// Popup   display information
 public Text Name;
 public Text Sex;
 public Text Age;
 public Text Post;
 public Text WorkExp;// All components of the information to be displayed in the pop-up window

 public Button AddPerson;// Add people button
 private int ID = 0;

 void Start()
 {
 // Initialize and close all pop-up windows
 PopupAddInfo.SetActive(false);
 PopupShowInfol.SetActive(false);

 // Add button event
 AddPerson.onClick.AddListener(() =>
 {
 PopupAddInfo.SetActive(true);
 });

 BtnAddInfo.onClick.AddListener(AddInfoEvent);
 }

 private void AddInfoEvent()
 {
 ID++;
 PersonItem item = Instantiate(PersonItemParfabs, Vector3.zero, Quaternion.identity, PersonParent);
 item.ID.text = ID.ToString();
 item.Name.text = InputName.text;
 item.Sex.text = DropSex.captionText.text;
 item.Age.text = InputAge.text;
 item.Post.text = InputPost.text;
 item.Work.text = InputWorkExp.text;
 item.ViewInfo.onClick.AddListener(() => ShowInfo(item.Name.text, item.Sex.text, item.Age.text, item.Post.text, item.Work.text));
 item.Backgroud.color = ID % 2 == 1 ? Color.blue : Color.red;// Distinguish by parity   Is the background presentation blue or red   A ternary expression is used
 PopupAddInfo.SetActive(false);
 }

 private void ShowInfo(string name, string sex, string age, string post, string work)
 {
 PopupShowInfol.SetActive(true);
 Name.text = name;
 Sex.text = sex;
 Age.text = age;
 Post.text = post;
 WorkExp.text = work;
 }
}


Attach script to Canvas On the object , Then drag the corresponding object to the corresponding PersonControl In the card slot of the script ：

Run the program ：

Four 、 an account of happenings after the event being told

The overall interface is ugly , But the overall function is to achieve

There are three main points ：1、 Fabrication of prefabricated body , And write scripts attached to the prefabricated body to use the information of the prefabricated body 2、 Generate   When prefabricating , Set the information of the script mounted on the preform 3、 display information , It is necessary to generate prefabricated bodies , Bind the buttons on the prefabricated body to events , Then pass the parameters to the function , Display