[UE5] ListView uses the blueprint method of DataTable data

[UE5] ListView uses the blueprint method of DataTable data

ListView is a user interface control in Unreal Engine used to display scrollable lists. It can be used to display large amounts of data and provides a variety of features and customization options to meet different needs.

DataTable is a data table structure in Unreal Engine, used to store and manage complex data. It can be used to save character attributes, item information, level data, etc. in the game.

Here we introduce how to use blueprint to read the attribute content in DataTable through ListView.

1.Creation of DataTable

1. Create structure

Create a structure to define the fields of the DataTable

Right-click the mouse in the blank space of the content, select Blueprints→Structure, and after naming it (here named MyData), you can define the field, here The fields are the fields of the DataTable data table

2. CreateDataTable

Also right-click the mouse in the blank space and select Miscellaneous→DataTable. The PickRowStructure window will appear. Let us select a structure. We select the name corresponding to the structure created above.

Name the data table (here named MyDataTable). Here you can see that the fields in the created data table are the structures we defined before.

3) Data import

Create a csv table and map the header names to the fields of the structure.

The first column of the csv must be a numerical sort column. It cannot be the field name of the structure, otherwise it will be lost (if the Chinese is garbled, change the encoding format of the csv to UTF-8)

Similarly, you can also export an empty data table to csv

Re-edit the CSV table and import it again

Modify the SourceFile path of DataTableDetails to change the address of the imported table

2.Creation of ListView

1) Create UI controls

2) Create ListView

Drag in the control as shown below, and it will prompt you to create an Entry.

Entry is a list that is a sub-UI blueprint for each row. Select ListView, find ListEntries under the Details window, click the plus sign of EntryWidgetClass to create an Entry or select an already created Entry

3) Create Entry

After creation, you can see that the ListView displays normally.

3.DataTable data binding

1) Create a data blueprint class

When assigning a value to Entry, you need to create a blueprint class that saves a row of DataTable data, that is, ltem

SelectBuleprintClass

Select Object (named MyDataInfo)

Create variables that can correspond to fields in the DataTable table

The created variables are checked for instanceEditable (editable instance) and ExposeOnSpawn (exposed when generated) for blueprint assignment.

2) Create an assignment function for Entry

Name the new function (UpdateData)

Add an input node, the type is the data blueprint class (MyDataInfo) created above

3) Initialize ListView

Select ListView and add OnEntryInitialized in Events in Details

4) Bind the data table to the ListView and create rows