# ListView + Flex not working

**URL:** https://discussions.unity.com/t/listview-flex-not-working/788618
**Category:** UI Toolkit
**Tags:** UI-Toolkit
**Created:** [May 1, 2020, 5:53pm UTC](https://discussions.unity.com/t/listview-flex-not-working/788618 "2020-05-01T17:53:33Z")
**Posts on this page:** 3
**Page:** 1

<div class="post-metadata">

### Author: ![sietse85](https://dub1.discourse-cdn.com/unity/user_avatar/discussions.unity.com/sietse85/32/319253_2.png) [@sietse85](https://discussions.unity.com/u/sietse85)
#### Post date: [May 1, 2020, 5:53pm UTC](https://discussions.unity.com/t/listview-flex-not-working/788618/1 "2020-05-01T17:53:33Z")

</div>

The ListView is 300px wide. Flex directions is set.

I populate the list by code. Yet it only grows downwards and not in width. I want to have 3 items next to eachother per row. See the image below. (The darkgreen is the ListView width)

 ![](https://europe1.discourse-cdn.com/unity/original/4X/4/f/b/4fbbc009e967d57222c9da7ad5d8e04dcc85ace0.jpeg)

Settings ListView:  
 ![](https://europe1.discourse-cdn.com/unity/original/4X/e/6/0/e60402f3dea489193c45cff3aa040d8faff61dbf.png)  
I fill the list like this

```csharp
ListView buildingList = _ui.visualTree.Q<ListView>("buildinglist");
for (int z = 0; z < 100; z++)
                {
                    Button button = new Button();
                    button.text = building.Value.buildingName;
                    button.AddToClassList("build-icon");
                    button.style.backgroundImage = new StyleBackground(building.Value.buildingIcon);
                    buildingList.Add(button);
                }

```

How can i use flex so i can have 3 items per row?

---

<div class="post-metadata">

### Author: ![uMathieu](https://dub1.discourse-cdn.com/unity/user_avatar/discussions.unity.com/umathieu/32/98107_2.png) [@uMathieu](https://discussions.unity.com/u/uMathieu)
#### Post date: [May 1, 2020, 6:52pm UTC](https://discussions.unity.com/t/listview-flex-not-working/788618/2 "2020-05-01T18:52:50Z")

</div>

You need to use ScrollView instead. ListView is a data container that needs an itemSource,makeItem and bindItem delegates, you cant add elements to it directly.

---

<div class="post-metadata">

### Author: ![sietse85](https://dub1.discourse-cdn.com/unity/user_avatar/discussions.unity.com/sietse85/32/319253_2.png) [@sietse85](https://discussions.unity.com/u/sietse85)
#### Post date: [May 3, 2020, 7:33pm UTC](https://discussions.unity.com/t/listview-flex-not-working/788618/3 "2020-05-03T19:33:11Z")

</div>

> **[Gyazo](https://gyazo.com/66dee55da6e1860354d9dbfb875c2729)**
>
> Gyazo is the easiest way to record screenshots & videos you can share instantly. Save time with async visual communication that's effortless and engaging.

 ![](https://europe1.discourse-cdn.com/unity/original/4X/f/a/d/fad2f5bf7cbeb7e25f524894b609dbe93db3757a.png)  
Preview UI BUILDER

INGAME

 ![](https://europe1.discourse-cdn.com/unity/original/4X/a/f/f/aff0172313b10aa650e2ad8634f7f526fe9458c7.png)  
Got it almost working except the scrollview is not using the entire width as you can see in the second picture. Inside the scrollview i added a visualelement, because Flex only seems to work within a visual element.

The first picture is from the UIBuilder and shows i set the with of the scrollview to be a 100 percent.

Any ideas what might cause this?