Calculator

Day 5 :More Variables

Create It With

in cooperation with

1

As you have seen in the last few days. We have been a heavy user of variables. We have used local variables in the card and commands. Since we only have one card, we have not had the chance to use global variables.

We are almost done with our calculator, so we are going to do a quick review of how we used variables to be extra sure everyone understands. Then we are going to use variable to do a super cool effect used by the calculator.

Hello World App

MoreVariables

2

Calculator App

The first variable we will cover is the local card script variable. Again we are using the numberPressed command, and we can see the iNewNumber is used in 2 ways

1. Read - You can use it anywhere in the card script for validation or calculations.

2. Write - Sometime you will need to set a new value to the variable

Local - Card

on mouseUp numberPressed the label of targetend mouseUp

on numberPressed pNumPress

if lNewNumber = true then ---just set the Display to the number pressed put pNumPress into field "display"

put false into lNewNumber --Not a new Num anymore else ---add the pressed number to the display put pNumPress after field "display" End if

end numberPressedYou will also see a “l” in front, this will indicate to you that it is a local card variable. 3

Calculator App

Local - Command

on equalsPressed --get out if no currentOperator, nothing to calculate if lCurrentOperator is empty then exit equalsPressed

put field "display" into tCurrentValue

switch lCurrentOperator case "/" put lCurrentTotal / tCurrentValue into lCurrentTotal break case "x" put lCurrentTotal * tCurrentValue into lCurrentTotal break case "-" put lCurrentTotal - tCurrentValue into lCurrentTotal break case "+" put lCurrentTotal + tCurrentValue into lCurrentTotal break end switch

put lCurrentTotal into field "display"end equalsPressed

Next is the local command variable. When you need to ONLY use the variable within the current command

1. Write - You will need to set a new value to the local variable so as to use it.

2. Read - Then you will be able to use the value in calculations, to control logic flow or do validations.

You will also see a “t” in front, this will indicate to you that it is a temporary or local command variable. 4

Calculator App

The next variable we cover will be passed parameter of commands. I have included the numberPressed code.

1. when the user pressed a number, that number is passed to the numberPressed command as a parameter.

2. LiveCode actually takes the parameters, and presents them to you as a local variable.

Parameters

on mouseUp numberPressed the label of targetend mouseUp

on numberPressed pNumPress

if lNewNumber = true then ---just set the Display to the number pressed put pNumPress into field "display"

put false into lNewNumber --Not a new Num anymore else ---add the pressed number to the display put pNumPress after field "display" End if

end numberPressed

1

2

You will also see a “p” in front, this will indicate to you that it is a passed or parameter variable. 5

Calculator App

Let see how to use local Command variables to do something super cool. The Calculator App will dynamically shrink the font size of the display to fit in as much of the number as it can.

1. With just a few numbers and lots of extra space, the font size is 62. That is our desired size.

2. But in order to allow more numbers in the display, we need to shrink the font size to a minimum of say 5.

Just One more Thing!

1 2

LiveCode is a VERY simple, yet powerful language and we are going to show you how to do this...

6

Calculator App

Let’s create a new command - textChanged.Here will we will check and change the size of the font in order to fit our number in the display. To get this we use formattedWidth, which give us what size the field should be given the font size.

1. Add 2 lines to code that will give us the formattedWidth vs width of the display.

2. Add the command to the bottom of the numberPressed command. Click Apply, run the App. After you have pressed several numbers, you will start to see the difference between the numbers.

formattedWidth

on textChanged

answer the formattedWidth of field "display" answer the width of field "display"

end textChanged

on numberPressed pNumPress... --Allow the clearing of the Current value --by setting the clear button to "C" set the label of button "clear" to "C"

--Size Display to fit textChanged

end numberPressed

1

2

7

Calculator App

Start off by adding 2 local variables that will hold our Min text size and our Desired text size.

1. Notice that our variables start with values. You can change them if you wish.

2. Here is a little logic that will check if the numbers have become too large. If so, it will decrease the font size of the tDesiredTextSize by 10.

Setting the Min and Desired Text Size Variables

on textChanged

local tMinTextSize = 5 local tDesiredTextSize = 62

---First, we use the formattedWidth property to see if the display is too large if the formattedWidth of field "display" >= the width of field "display" then put (tDesiredTextSize - 10) into tNewTextSize set the textSize of field "display" to tNewTextSize end if

end textChanged

1

2

Problem: You can’t just put in any number like 10, you need the proper calculated size.8

Calculator App

You can see how to utilize local variables to hold calculated values and make your code easier to read and understand.

1. Use [effective textSize] to get the MOST real size possible

2. Then put whichever is bigger tEffectiveSize or tMinTextSize into tSize

3. Then get whichever is smaller tSize or tDesiredTextSize

Get thetNewText Size

on textChanged

local tMinTextSize = 5 local tDesiredTextSize = 62

---First, we use the formattedWidth property to see if the display is too large if the formattedWidth of field "display" >= the width of field "display" then ---Calculate the most effective size put effective textSize of field "display" - 1 into tEffectiveSize

put max(tEffectiveSize, tMinTextSize) into tSize

put min(tSize, tDesiredTextSize) into tNewTextSize

set the textSize of field "display" to tNewTextSize end if

end textChanged

1

2

3

9

Calculator App Final Version

10

local tMinTextSize = 5local tDesiredTextSize = 62

on textChanged repeat while the formattedWidth of field "display" >= the width of field "display" - (item 1 of the margins of field "display" * 2) --Calculate the most effective size put the effective textSize of field "display" - 1 into tEffectiveSize

--Get the larger Min or tEffectiveSize put max(tEffectiveSize, tMinTextSize) into tSize

--Get the smaller tSize or tDesiredTextSize put min(tSize, tDesiredTextSize) into tNewTextSize

set the textSize of field "display" to tNewTextSize if the textSize of field "display" = tMinTextSize then exit repeat end repeat

repeat while the formattedWidth of field "display"< the width of field "display" - (item 1 of the margins of field "display" * 2) --This line of code is similar in functionality except it enlarges the font size set the textSize of field "display" to min (max ((the effective textSize of field "display" + 1), tMinTextSize) ,tDesiredTextSize)

if the textSize of field "display" = tDesiredTextSize then exit repeat end repeat end textChanged

Calculator App Compare

11

local tMinTextSize = 5local tDesiredTextSize = 62

on textChanged repeat while the formattedWidth of field "display" >= the width of field "display" - (item 1 of the margins of field "display" * 2) --Calculate the most effective size put the effective textSize of field "display" - 1 into tEffectiveSize

--Get the larger Min or tEffectiveSize put max(tEffectiveSize, tMinTextSize) into tSize

--Get the smaller tSize or tDesiredTextSize put min(tSize, sDesiredTextSize) into tNewTextSize

set the textSize of field "display" to tNewTextSize if the textSize of field "display" = tMinTextSize then exit repeat end repeat

repeat while the formattedWidth of field "display"< the width of field "display" - (item 1 of the margins of field "display" * 2) --This line of code is similar in functionality except it enlarges the font size set the textSize of field "display" to min (max ((the effective textSize of field "display" + 1), sMinTextSize),tDesiredTextSize)

if the textSize of field "display" = tDesiredTextSize then exit repeat end repeat end textChanged

If you wish to learn more… Visit LiveCode

Congrats on completing:More Variables

Don’t forget to save your LiveCode Project!

Calculator App

12