How to create list using while loop for this view

Description

Hi Team,
I have an view containing label and slider. How to create while loop for this view? any ideas?
For list we are adding buttons as list items.
i need to create this view as list using while loop. i am using page obj for scroll.

What MCU/Processor/Board and compiler are you using?

ARM Linux

What LVGL version are you using?

6.0+

What do you want to achieve?

i want create this view as list.

What have you tried so far?

NA

Code to reproduce

//page_style
        static lv_style_t style_page,style_page1;
        lv_style_copy(&style_page,&lv_style_plain);
        style_page.body.main_color=LV_COLOR_WHITE;

        //page
         page= lv_page_create(lv_scr_act(), NULL);
        lv_obj_set_size(page, 450, 650);
        lv_page_set_style(page,LV_PAGE_STYLE_SCRL,&style_page);
        lv_page_set_style(page,LV_PAGE_STYLE_BG,&style_page);
        lv_obj_align(page, message, LV_ALIGN_OUT_BOTTOM_MID, 0, 30);

        //area style
        	static lv_style_t style_area;
            lv_style_copy(&style_area,&lv_style_plain);
            style_area.body.main_color=LV_COLOR_WHITE;
            style_area.body.border.width=1;
            style_area.body.radius=5;
        // add an area
           lv_obj_t * area = lv_obj_create(page, NULL);
           lv_obj_set_size(area, 430, 200);
           lv_obj_set_style(area,&style_area);
           lv_obj_set_click(area, true);
           lv_obj_set_drag_parent(area, true);
          // lv_obj_set_event_cb(area, page_event_handler);
           // add stuff to area
           device_name=lv_label_create(area,NULL);
           lv_label_set_recolor(device_name,true);
           lv_label_set_text(device_name,"#000000 Kitchen Dimmer(2303ac)");
           lv_obj_align(device_name,NULL,LV_ALIGN_IN_TOP_MID,0,10);


           lv_style_copy(&style_bg, &lv_style_pretty);
           style_bg.body.border.color=LV_COLOR_GRAY;
           style_bg.body.main_color=LV_COLOR_WHITE;
           style_bg.body.opa=LV_OPA_100;


           lv_style_copy(&style_knob, &lv_style_pretty);
           style_knob.body.opa = LV_OPA_100;
           style_knob.body.main_color=LV_COLOR_WHITE;
           style_knob.body.grad_color=LV_COLOR_WHITE;
           style_knob.body.radius = LV_RADIUS_CIRCLE;

           slider_label = lv_label_create(lv_scr_act(), NULL);
           lv_label_set_text(slider_label, "0 %");
           lv_obj_set_auto_realign(slider_label, true);
           lv_obj_align(slider_label, device_name, LV_ALIGN_OUT_BOTTOM_MID, 0, 10);

           slider = lv_slider_create(area, NULL);
           lv_obj_set_width(slider, LV_DPI * 4);
           lv_obj_align(slider, slider_label, LV_ALIGN_OUT_BOTTOM_MID, 0, 20);
           lv_obj_set_event_cb(slider, slider_event_cb);
           lv_slider_set_style(slider, LV_SLIDER_STYLE_BG, &style_bg);
           //lv_slider_set_style(slider, LV_SLIDER_STYLE_INDIC,&style_indic);
           lv_slider_set_style(slider, LV_SLIDER_STYLE_KNOB, &style_knob);
           lv_slider_set_range(slider, 0, 100);
           //img_style
           lv_style_copy(&style_img, &lv_style_plain);
           style_img.body.main_color=LV_COLOR_WHITE;

           power_img= lv_img_create(area, NULL);
           lv_img_set_src(power_img, &power);
           lv_img_set_style(power_img,LV_IMG_STYLE_MAIN,&style_img);
           lv_obj_align(power_img, slider, LV_ALIGN_OUT_BOTTOM_MID, 0, 20);

Screenshot and/or video

Help me with this.
Thanks.

While loop for what? To create multiple similar boxes with a slider and labels or to build this one box?

Yes kisvegabor.

To create multiple similar boxes with a slider and labels in vertical like a list

i want to add my database items to this box and show like a list.

Thanks

I suggest create a vertical layout and wrap the creation code into a function with parameters to the variable data (e.g. title).