Hi,
I struggle to display data in Multi Column List View (via UI Toolkit). I can display data in the List View (one column) from the same data source, but when I try to populate data into Multi Column List View nothing is displayed (and no error is thrown).
I tested some, and even a simple hardcoded string like “test” is not displayed.
What am I missing?
Additionally, what is the usual way to display a multi-column data table in Unity? I really can’t find any other option, but to instantiate a new label (or another element) for each column and row cell.
Below are the C# and uxml examples.
UXML:
<ui:UXML xmlns:ui="UnityEngine.UIElements" xmlns:uie="UnityEditor.UIElements" editor-extension-mode="False">
<Style src="project://database/Assets/LVDemo.uss?fileID=7433441132597879392&guid=7066f380e126b7e498d395819362db09&type=3#LVDemo" />
<ui:MultiColumnListView name="mcListView" fixed-item-height="22" style="width: 300px; height: 200px; background-color: rgb(152, 152, 152);">
<ui:Columns>
<ui:Column name="subcatID" title="ID" width="80" />
<ui:Column name="subcat" title="Subcat" width="180" />
</ui:Columns>
</ui:MultiColumnListView>
<ui:ListView focusable="true" name="ListView" style="background-color: rgb(161, 161, 161); width: 200px; height: 200px; margin-top: 25px;" />
<ui:Button text="Button" display-tooltip-when-elided="true" name="btn" style="width: 150px; margin-top: 25px;" />
</ui:UXML>
C#
using System;
using System.Collections.Generic;
using System.Data;
using System.Linq;
using UnityEngine;
using UnityEngine.UIElements;
public class LVDemo : MonoBehaviour
{
// UI elements
Button btn;
ListView listView;
MultiColumnListView mcListView;
// Data fields
DataTable dBTable;
List<RegExpenseSubcat> subcatList = new List<RegExpenseSubcat>();
private void OnEnable()
{
UIDocument ui = GetComponent<UIDocument>();
VisualElement root = ui.rootVisualElement;
btn = root.Q<Button>("btn");
listView = root.Q<ListView>("ListView");
mcListView = root.Q<MultiColumnListView>("mcListView");
btn.clicked += OnButtonClicked;
}
void OnButtonClicked()
{
PopulateData();
PopulateListView();
PopulateMultiColumnListView();
}
void PopulateData()
{
Debug.Log("Populate Data");
string sQLquery = "select EXP_SUBCATEGORY_ID, EXP_SUBCATEGORY from REG_EXPENSE_SUBCATEGORIES";
dBTable = DBConnection.DBConfig(sQLquery);
subcatList = (from DataRow dr in dBTable.Rows
select new RegExpenseSubcat()
{
subcatID = dr["EXP_SUBCATEGORY_ID"].ToString(),
subcat = dr["EXP_SUBCATEGORY"].ToString(),
}).ToList();
// Test data existence
Debug.Log("Data test: " + subcatList[6].subcat);
}
// Populate List View
void PopulateListView()
{
Debug.Log("Start Populating List View");
// Set ListView.itemsSource to populate the data in the list.
listView.itemsSource = subcatList;
// Set ListView.makeItem to initialize each entry in the list.
listView.makeItem = () => new Label();
// Set ListView.bindItem to bind an initialized entry to a data item.
listView.bindItem = (VisualElement element, int index) =>
(element as Label).text = subcatList[index].subcat;
Debug.Log("List View Populated");
}
// Populate Multi Column List View
void PopulateMultiColumnListView()
{
Debug.Log("Start Populating Multi Column List View");
// Set ListView.itemsSource to populate the data in the list.
mcListView.itemsSource = subcatList;
// For each column, set Column.makeCell to initialize each cell in the column.
// You can index the columns array with names or numerical indices.
mcListView.columns["subcatID"].makeCell = () => new Label();
mcListView.columns["subcat"].makeCell = () => new Label();
// For each column, set Column.bindCell to bind an initialized cell to a data item.
mcListView.columns["subcatID"].bindCell = (VisualElement element, int index) =>
(element as Label).text = subcatList[index].subcatID;
mcListView.columns["subcat"].bindCell = (VisualElement element, int index) =>
(element as Label).text = subcatList[index].subcat;
Debug.Log("Multi Column List View Populated");
}
}
Any help will be highly appreciated!!
Thank you!