Difference between revisions of "Component: Slider ( Control)"
From Flowcode Help
Jump to navigationJump to search (Created page with "{| style="width:50%" |- | width="20%" style="color:gray;" | Author | MatrixTSL |- | width="20%" style="color:gray;" | Version | 0.1 |- | width="20%" style="color:gray;...") |
|||
| (One intermediate revision by the same user not shown) | |||
| Line 5: | Line 5: | ||
|- | |- | ||
| width="20%" style="color:gray;" | Version | | width="20%" style="color:gray;" | Version | ||
| − | | 0 | + | | 1.0 |
|- | |- | ||
| width="20%" style="color:gray;" | Category | | width="20%" style="color:gray;" | Category | ||
| Line 15: | Line 15: | ||
Creates an analogue slide control | Creates an analogue slide control | ||
| − | == | + | ==Version information== |
| − | |||
| − | |||
| − | + | Library Version, Component Version, Date, Author, Info | |
==Detailed description== | ==Detailed description== | ||
| Line 28: | Line 26: | ||
''<span style="color:red;">No additional examples</span>'' | ''<span style="color:red;">No additional examples</span>'' | ||
| + | |||
| + | |||
==Macro reference== | ==Macro reference== | ||
| Line 37: | Line 37: | ||
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''GetValue''' | | width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''GetValue''' | ||
|- | |- | ||
| − | | colspan="2" | | + | | colspan="2" | Returns the current value of the slider |
|- | |- | ||
|- | |- | ||
| Line 70: | Line 70: | ||
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''SetValue''' | | width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''SetValue''' | ||
|- | |- | ||
| − | | colspan="2" | | + | | colspan="2" | Set the current value of the slider |
|- | |- | ||
|- | |- | ||
| − | | width="10%" align="center" | [[File:Fc9- | + | | width="10%" align="center" | [[File:Fc9-s32-icon.png]] - LONG |
| − | | width="90%" | | + | | width="90%" | Value |
|- | |- | ||
| − | | colspan="2" | | + | | colspan="2" | The value for the slider |
|- | |- | ||
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-void-icon.png]] - VOID | | width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-void-icon.png]] - VOID | ||
| Line 98: | Line 98: | ||
| width="90%" | Min | | width="90%" | Min | ||
|- | |- | ||
| − | | colspan="2" | | + | | colspan="2" | The minimum (lowest) value for the slider |
|- | |- | ||
| width="10%" align="center" | [[File:Fc9-type-14-icon.png]] | | width="10%" align="center" | [[File:Fc9-type-14-icon.png]] | ||
| width="90%" | Max | | width="90%" | Max | ||
|- | |- | ||
| − | | colspan="2" | | + | | colspan="2" | The maximum (highest) value for the slider |
|- | |- | ||
| width="10%" align="center" | [[File:Fc9-type-21-icon.png]] | | width="10%" align="center" | [[File:Fc9-type-21-icon.png]] | ||
| width="90%" | Step | | width="90%" | Step | ||
|- | |- | ||
| − | | colspan="2" | | + | | colspan="2" | The value of each discrete step when the slider is changed |
|- | |- | ||
| width="10%" align="center" | [[File:Fc9-type-14-icon.png]] | | width="10%" align="center" | [[File:Fc9-type-14-icon.png]] | ||
| width="90%" | Default | | width="90%" | Default | ||
|- | |- | ||
| − | | colspan="2" | | + | | colspan="2" | The default value of the slider |
|- | |- | ||
| width="10%" align="center" style="background-color:#EAE1EA;" | [[File:Fc9-conn-icon.png]] | | width="10%" align="center" style="background-color:#EAE1EA;" | [[File:Fc9-conn-icon.png]] | ||
| Line 122: | Line 122: | ||
| width="90%" | Style | | width="90%" | Style | ||
|- | |- | ||
| − | | colspan="2" | | + | | colspan="2" | The shape of the slider thumb |
|- | |- | ||
| width="10%" align="center" | [[File:Fc9-type-2-icon.png]] | | width="10%" align="center" | [[File:Fc9-type-2-icon.png]] | ||
| width="90%" | Fill Colour | | width="90%" | Fill Colour | ||
|- | |- | ||
| − | | colspan="2" | Specifies the fill colour of the | + | | colspan="2" | Specifies the fill colour of the thumb |
|- | |- | ||
| width="10%" align="center" | [[File:Fc9-type-21-icon.png]] | | width="10%" align="center" | [[File:Fc9-type-21-icon.png]] | ||
| width="90%" | Border Width | | width="90%" | Border Width | ||
|- | |- | ||
| − | | colspan="2" | The outline size in pixels | + | | colspan="2" | The outline size of the thumb in pixels |
|- | |- | ||
| width="10%" align="center" | [[File:Fc9-type-2-icon.png]] | | width="10%" align="center" | [[File:Fc9-type-2-icon.png]] | ||
| width="90%" | Border Colour | | width="90%" | Border Colour | ||
|- | |- | ||
| − | | colspan="2" | The outline colour of the | + | | colspan="2" | The outline colour of the thumb |
|- | |- | ||
| width="10%" align="center" | [[File:Fc9-type-16-icon.png]] | | width="10%" align="center" | [[File:Fc9-type-16-icon.png]] | ||
| width="90%" | Shadow Size | | width="90%" | Shadow Size | ||
|- | |- | ||
| − | | colspan="2" | | + | | colspan="2" | The size of the thumb shadow |
|- | |- | ||
| width="10%" align="center" | [[File:Fc9-type-7-icon.png]] | | width="10%" align="center" | [[File:Fc9-type-7-icon.png]] | ||
| width="90%" | Auto Colour | | width="90%" | Auto Colour | ||
|- | |- | ||
| − | | colspan="2" | | + | | colspan="2" | Set to override the default colours of the thumb |
|- | |- | ||
| width="10%" align="center" | [[File:Fc9-type-2-icon.png]] | | width="10%" align="center" | [[File:Fc9-type-2-icon.png]] | ||
| width="90%" | Hover Colour | | width="90%" | Hover Colour | ||
|- | |- | ||
| − | | colspan="2" | | + | | colspan="2" | Custom colour for the thumb when the user hovers the mouse over the slider |
|- | |- | ||
| width="10%" align="center" | [[File:Fc9-type-2-icon.png]] | | width="10%" align="center" | [[File:Fc9-type-2-icon.png]] | ||
| width="90%" | Focus Colour | | width="90%" | Focus Colour | ||
|- | |- | ||
| − | | colspan="2" | | + | | colspan="2" | Custom colour for the thumb when the slider is selected |
|- | |- | ||
| width="10%" align="center" | [[File:Fc9-type-2-icon.png]] | | width="10%" align="center" | [[File:Fc9-type-2-icon.png]] | ||
| width="90%" | Shadow Colour | | width="90%" | Shadow Colour | ||
|- | |- | ||
| − | | colspan="2" | | + | | colspan="2" | Custom colour for the thumb shadow |
|- | |- | ||
| width="10%" align="center" style="background-color:#EAE1EA;" | [[File:Fc9-conn-icon.png]] | | width="10%" align="center" style="background-color:#EAE1EA;" | [[File:Fc9-conn-icon.png]] | ||
| Line 171: | Line 171: | ||
| width="90%" | Fill Colour | | width="90%" | Fill Colour | ||
|- | |- | ||
| − | | colspan="2" | | + | | colspan="2" | The fill colour of the slider track |
|- | |- | ||
| width="10%" align="center" | [[File:Fc9-type-2-icon.png]] | | width="10%" align="center" | [[File:Fc9-type-2-icon.png]] | ||
| width="90%" | Fill 2nd Colour | | width="90%" | Fill 2nd Colour | ||
|- | |- | ||
| − | | colspan="2" | | + | | colspan="2" | The secondary fill colour of the slider track |
|- | |- | ||
| width="10%" align="center" | [[File:Fc9-type-12-icon.png]] | | width="10%" align="center" | [[File:Fc9-type-12-icon.png]] | ||
| width="90%" | Fill Gradient Style | | width="90%" | Fill Gradient Style | ||
|- | |- | ||
| − | | colspan="2" | | + | | colspan="2" | The colour gradient style of the slider track |
|- | |- | ||
| width="10%" align="center" | [[File:Fc9-type-21-icon.png]] | | width="10%" align="center" | [[File:Fc9-type-21-icon.png]] | ||
| width="90%" | Border Width | | width="90%" | Border Width | ||
|- | |- | ||
| − | | colspan="2" | The outline size in pixels | + | | colspan="2" | The outline size of the track in pixels |
|- | |- | ||
| width="10%" align="center" | [[File:Fc9-type-2-icon.png]] | | width="10%" align="center" | [[File:Fc9-type-2-icon.png]] | ||
| width="90%" | Border Colour | | width="90%" | Border Colour | ||
|- | |- | ||
| − | | colspan="2" | The outline colour of the | + | | colspan="2" | The outline colour of the track |
|- | |- | ||
| width="10%" align="center" style="background-color:#EAE1EA;" | [[File:Fc9-conn-icon.png]] | | width="10%" align="center" style="background-color:#EAE1EA;" | [[File:Fc9-conn-icon.png]] | ||
| Line 200: | Line 200: | ||
| width="90%" | Custom Attributes | | width="90%" | Custom Attributes | ||
|- | |- | ||
| − | | colspan="2" | | + | | colspan="2" | Text here will be added to the html tag of this component to allow advanced customisation |
|} | |} | ||
| + | |||
| + | ==Component Source Code== | ||
| + | |||
| + | Please click here to download the component source project: [https://www.flowcode.co.uk/wiki/componentsource/FC_Comp_Source_WEBEXP_Slider.fcsx FC_Comp_Source_WEBEXP_Slider.fcsx] | ||
| + | |||
| + | Please click here to view the component source code (Beta): [https://www.flowcode.co.uk/FlowchartView/?wfile=componentsource/FC_Comp_Source_WEBEXP_Slider.fcsx FC_Comp_Source_WEBEXP_Slider.fcsx] | ||
Latest revision as of 11:01, 25 February 2026
| Author | MatrixTSL |
| Version | 1.0 |
| Category | Control |
Contents
Slider component
Creates an analogue slide control
Version information
Library Version, Component Version, Date, Author, Info
Detailed description
No detailed description exists yet for this component
Examples
No additional examples
Macro reference
GetValue
|
GetValue |
| Returns the current value of the slider | |
 - INT
|
Return |
SetEnabled
|
|
SetEnabled |
| Make this component enabled or disabled | |
 - BOOL
|
Enable |
| Set false to make this component read-only | |
 - VOID
|
Return |
SetValue
|
|
SetValue |
| Set the current value of the slider | |
 - LONG
|
Value |
| The value for the slider | |
| - VOID
|
Return |
Property reference
|
Properties |
|
Scale |
|
Min |
| The minimum (lowest) value for the slider | |
|
|
Max |
| The maximum (highest) value for the slider | |
|
Step |
| The value of each discrete step when the slider is changed | |
|
|
Default |
| The default value of the slider | |
|
|
Thumb Appearance |
|
Style |
| The shape of the slider thumb | |
|
Fill Colour |
| Specifies the fill colour of the thumb | |
|
|
Border Width |
| The outline size of the thumb in pixels | |
|
|
Border Colour |
| The outline colour of the thumb | |
|
|
Shadow Size |
| The size of the thumb shadow | |
|
Auto Colour |
| Set to override the default colours of the thumb | |
|
|
Hover Colour |
| Custom colour for the thumb when the user hovers the mouse over the slider | |
|
|
Focus Colour |
| Custom colour for the thumb when the slider is selected | |
|
|
Shadow Colour |
| Custom colour for the thumb shadow | |
|
|
Track Appearance |
|
|
Fill Colour |
| The fill colour of the slider track | |
|
|
Fill 2nd Colour |
| The secondary fill colour of the slider track | |
|
Fill Gradient Style |
| The colour gradient style of the slider track | |
|
|
Border Width |
| The outline size of the track in pixels | |
|
|
Border Colour |
| The outline colour of the track | |
|
|
Advanced |
|
Custom Attributes |
| Text here will be added to the html tag of this component to allow advanced customisation | |
Component Source Code
Please click here to download the component source project: FC_Comp_Source_WEBEXP_Slider.fcsx
Please click here to view the component source code (Beta): FC_Comp_Source_WEBEXP_Slider.fcsx
