Start a new topic

slider vs progress bar

I am trying to use a slider bar overlapping a progress bar so that it give effecting of filling the background ( slider bar alone do not work like that) 

i use the following code to make it works but seems the j0.val do not take fraction values any suggestion to make it work 








Just use a cropped image for your slider and no progress bar.

The stacking and layering of components will cause you grief - as you see.

okay thanks , How can i have effect  effect of progress bar in slider 

bellow is my effort, I do not want to add the traditional "+" "-" buttons rather prefer to use the slider to increase or decrease 

h1 is using the Crop image on slider where h2 is on top of progress bar  although it works but the it was not possible to map h2.val to j0.val  as explained in above. 

If i use the h2.maxval 100 and min val 0 then it works ( not perfectly what i want ) bu the slider Button (psta) disappears 


Haven't forgotten, trying to find where the example is

Okay I can seem to find the example, I recall someone using this type of effect.

After trying to play with the slider/progress bar to replicate,

it becomes more obvious they used an advanced technique and this is not out-of-the-box.

So you have some choices, 

1) swapping .bpic # based on value (pic made in steps perhaps 11 pics 0 to 100 in steps of 10

2) play with the math for some fine control gui commands based on value.

But which probably depends on what you are looking to accomplish

A progress bar will not provide a slider.

Then you have to also consider exactly what user interface functions and status reporting

 that you are really trying to implement and why.

For an example


Are you trying to allow the user to request a value, with the slider but MCU sets actual value?

Hey Patrick 

the solution was simple then i expected  :) 

It works fine for me ... 










What i am trying to do is allowing user to setup a value ,(cmd to MCU)  that will in return do something ,

( well the project is to increase or decrease the speed of a Fan so by implenting slider it willact as if it is trying to increase 

In my project i am avoiding the MCU job in nextion so all data manipulation is done in the MCU nextion only act as HMI , display graphics and results, and take user inputs  


Does your fan actually have 256 settings?  0 to 255?

I certainly do place some logic inside Nextion, especially when it relates to user's choice for selections before committing to the users requests - this keeps serial traffic minimized to after selections are committed, and updates from MCU regarding status on changes.

FAN ? I lost you there the logic is for and RGB color filler  selection , for a mood light, So i am using the  3 slider RGB ( 0-256 ) for color range , and the finally update the MCU with RGB Hex code 

All i wanted a smooth transaction on slider bar with effect of fill up 

I am using going to use confirmation window before send data on serial to avoid unnecessary serial traffic. so user chooses the color based on the RGB section and the press button to confirm it . :) ( lazy logic but works for me as of now) 


O wish i can manage to get some graphics like this to work :)  but on worries, 


Thanks for your help 

The project i am working on is development on industrial / home automation with, MCU custom board.  IOT, , android all together  Sry wont be able to share with you the complete details at this stage But I promise the first look of product will be release on this website,  :) 

target is firs quarter 2017 

 maybe something in this way? It is up to you, how complex you make the bars ...

(8.03 KB)
Login or Signup to post a comment