ComboBox should use a scrollable view when the model is too large to display

[learncodingforweb]

ComboBox {
            model: [
                 10,  20,  30,  40,  50,  60,  70,  80,  90, 100,
                110, 120, 130, 140, 150, 160, 170, 180, 190, 200,
                210, 220, 230, 240, 250, 260, 270, 280, 290, 300,
                310, 320, 330, 340, 350, 360, 370, 380, 390, 400,
                410, 420, 430, 440, 450, 460, 470, 480, 490, 500,
                510, 520, 530, 540, 550, 560, 570, 580, 590, 600,
                610, 620, 630, 640, 650, 660, 670, 680, 690, 700,
                710, 720, 730, 740, 750, 760, 770, 780, 790, 800,
                810, 820, 830, 840, 850, 860, 870, 880, 890, 900,
                910, 920, 930, 940, 950, 960, 970, 980, 990, 1000
            ];
        }

I am able to get all the list of options available with comboBox. how can i see all available options? Cargo.toml

[dependencies]
slint = "1.4"

[build-dependencies]
slint-build = "1.4"

[tronical]

Thank you for the bug report. Indeed, the ComboBox is missing a scroll view in all the styles.

[FloVanGH]

I tried to fix this issue before but had some issues with the PopupWindow. What is needed to make the ComboBox scrollable is a minimum height, a maximum height and inside of the Popup the ScrollView but I was not able to get it that all together working properly. @tronical maybe you have an idea how to fix it.

[lifeRobot]

I tried to fix this issue before but had some issues with the PopupWindow. What is needed to make the ComboBox scrollable is a minimum height, a maximum height and inside of the Popup the ScrollView but I was not able to get it that all together working properly. @tronical maybe you have an idea how to fix it.

y can temporarily try using @jui/combobox/combobox.slint

example

Cargo.toml file:

[dependencies]
slint = "1.4.1"

[build-dependencies]
jui = "0.1.16"

build.rs file:

pub fn main() {
    let separator = jui::jui_file::separator;
    jui::compile(format!("view{separator}main.slint")).unwrap();
}

main.rs file:

slint::include_modules!();

fn main() {
    App::new().unwrap().run().unwrap();
}

view/main.slint file :

import { ComboBox } from "@jui/combobox/combobox.slint";

export component App inherits Window {
	min-width: 300px;
	min-height: 300px;
    
	ComboBox {
		width: 100px;

		data: [
			{id:"1",text:"one"},{id:"2",text:"two"},
        	        {id:"3",text:"three"},{id:"4",text:"four"},
                	{id:"5",text:"five"},{id:"6",text:"six"},
	                {id:"7",text:"seven"},{id:"8",text:"eight"},
        	        {id:"9",text:"night"},{id:"10",text:"ten"}
		];
	}
}

hope this is helpful to you

[learncodingforweb]

Any update without using third party solution?

[tinkerbelltinks]

Thanks

[develcooking]

Or you could use a custom widget. The only problem is that the theming is sort of crap link to slintpad by ogoffart in https://github.com/slint-ui/slint/discussions/2657

[FloVanGH]

The ideal behavior would be to define a min-height and a max-height. With the more items the ComboBox Popup stretches until it reaches the max-height at that point scrolling would be there. But that does currently not work with PopupWindow. What could be done now to make scrolling possible in the ComboBox is to define a fixed height for the popup and add a ScrollView. @tronical @ogoffart what do you think?