How To Use The Number Selector - XMPRO App Designer Toolbox

In this video, you’ll learn how to use the number selector in the XMPRO App Designer.

Need help with creating your XMPRO apps? Send an email to [e-mail]

Go to https://xmpro.com if you want to learn more about how you can build real-time applications with our Event Intelligence Platform.

Transcript

welcome to another training video from

XM Pro today we will be looking at the

Control Number selector and how to use

it in app designer so as you can see I

have a blank page here and let's say if

I want to capture some numbers or

display some numbers on the screen and

for the user the best control to use

will be a number box um if you want to

add it you can find it under basic

controls called number selector and you

can drag it across um so we'll do just

that

but let me add a field set so that we

can have some layout I've added a few

set and now in there I will add a number

selector that's my first field right so

I have a number selector so of course if

I launch the app it won't do anything at

the moment so let's see what

configuration option options we have in

the block properties for it

starting with appearance we have the

standard visible option which basically

says if the closure should be visible or

not then we have a styling mode which

can be outlined underlying or filled in

order to explain what they are I will

just add a few more and give them

different values let's say underlying

for that one and filled for that one and

you will see the difference in their

stones so let's continue and look at the

next value which is the placeholders so

placeholder basically says if if no

value is specified what should be the

text that should be visible in the

control so we can say

perhaps something like that

and it will display over there next we

have built up which is quite simple if

you specify any text here that'll be

displayed when you hover over it

lastly we have Clear button and spin

buttons which basically display of a

button to clear the value that user may

have specified and spin buttons

basically just increase or decrease the

number that you have chosen over there

so that was the appearance coming

towards behavior you can choose what

should be your maximum value that a user

is allowed to put in let's say hundred

necessarily what should be the minimum

value lastly format is where you can

specify what sort of number or value

user can enter for example if you want

to only a low percentage I can put in

hash which represents any number and

zero which represents any number and if

no number is specified zero will be the

default and then I can put a percentage

sign which will just display at the end

of the number that is entered to say

that it is percentage next we have

read-only and disabled which are very

simple items like if you don't want user

to be able to change you will choose

read-only disabled just disabled they

can go altogether next we have value

where you can specify a static value or

a dynamic value static value you can

just type in for example like that for a

dynamic value if this control was part

of a container which had a data source

attached to it

you can then choose a dynamic value here

and then whatever your data source is

sending will become visible over here

and you

we'll be able to select this has been

explained in many of the other control

videos and and also in the video for how

to use the pterosaurs which you can

refer to so for now I'll just give it a

static value now just to show you

different formats that one can do I will

create this one for let's say we want to

capture currency in multiples of

thousand so I'll say number is what

you're gonna capture any number and then

I'll create another group by a comma for

three not three digits and then let's

say we want to allow two decimal points

an important point is when you put a

hash before the decimal point it means

any amount of numbers but when you put

it after the decimal point it means one

digit and one do it only so one bit for

each hash right similarly let's do one

one more and that can be for example you

want to capture two digit with two

decimal points weight values like that

so I'll save all that I will also give

them some default values let's say that

and we'll go ahead and launch it as you

can see we have three control they are

definitely stalled as per what we

specified one of them has a clear button

which will clear the value and it will

display the place holder we also have a

spin button which can change the value

and if we specify the value it appears

over there lastly this one for example

um has a currency format on it so if I

specify some value it will display it in

the currency format as you can see so

that's how you configure a number box in

app design thank you so much for

watching