Things I've learned about datagrids - Expanded/Contracted
Posted: Thu Jan 17, 2013 7:13 pm
I have had several problems working with datagrids - and have posted most of them on the forum so that people can see the solutions. But here's one that I just solved that I wanted to share.
I thought my datagrids were set up just fine - until I started testing them and found out that the datagrid wasn't showing all of the data when scrolling was required - it was dropping the last 4 items. (The data was showing in Contents - but wasn't showing up on the screen). This datagrid is a form that has different heights - you click a button and it opens up to show all the text. I used samples on the forum and internet to create the code - using Expanded and Contracted buttons - and it initially looked like it worked.
to make the different heights, the code included:
I didn't think much about it...but when it started dropping the last items in my datagrid, I switched the numbers to 99 and 67 - and voila - all the data appeared in the datagrid. So, I don't know why or how - but if you use this code, you need to make sure that when you scroll down, your bottom data is appearing. . If it isn't, you need to adjust these numbers.
So just in case anyone needs it, I am including all my code for the row behavior of this datagrid (it is lengthy because I set various sizes depending on the environment - but you can skip all of that)....
I thought my datagrids were set up just fine - until I started testing them and found out that the datagrid wasn't showing all of the data when scrolling was required - it was dropping the last 4 items. (The data was showing in Contents - but wasn't showing up on the screen). This datagrid is a form that has different heights - you click a button and it opens up to show all the text. I used samples on the forum and internet to create the code - using Expanded and Contracted buttons - and it initially looked like it worked.
to make the different heights, the code included:
Code: Select all
on CalculateFormattedHeight pDataArray
if pDataArray["expanded"] then
return 69
else
return 37
end if
end CalculateFormattedHeight So just in case anyone needs it, I am including all my code for the row behavior of this datagrid (it is lengthy because I set various sizes depending on the environment - but you can skip all of that)....
Code: Select all
-- This script defines the behavior of your data grid's custom template. This behavior
-- only applies to 'forms' and not 'tables'.
on CalculateFormattedHeight pDataArray
if pDataArray["expanded"] then
return 99
else
return 57
end if
end CalculateFormattedHeight
on FillInData pDataArray
-- This message is sent when the Data Grid needs to populate
-- this template with the data from a record. pDataArray is an
-- an array containing the records data.
-- You do not need to resize any of your template's controls in
-- this message. All resizing should be handled in resizeControl.
-- Example:
set the text of field "firstname" of me to pDataArray["label 1"]
set the text of field "label" of me to pDataArray["label 2"]
set the label of btn "contact_email" of me to pDataArray["label 3"]
set the label of btn "webname" of me to pDataArray["label 4"]
put pDataArray["label 5"] into field "text_home" of me
set the label of btn "button_cell" of me to pDataArray["label 6"]
put pDataArray["label 7"] into field "text_cell" of me
set the text of field "relationship" of me to pDataArray["label 8"]
set the text of field "company" of me to pDataArray["label 9"]
set the text of field "street" of me to pDataArray["label 10"]
set the text of field "city" of me to pDataArray["label 11"]
set the text of field "state" of me to pDataArray["label 12"]
set the text of field "zip" of me to pDataArray["label 13"]
if pDataArray["label 14"] is "yes" then
set the hilite of button "OK" of me to true
else
set the hilite of button "OK" of me to false
end if
if pDataArray["expanded"] is "" then
put false into pDataArray["expanded"]
else
end if
set the hilite of button "change" of me to false
set the visible of field "text_home" of me to false
set the visible of field "text_cell" of me to false
set the visible of graphic "ArrowExpanded" of me to pDataArray["expanded"]
set the visible of graphic "arrowcontracted" of me to not pDataArray["expanded"]
set the visible of btn "contact_email" of me to pDataArray["expanded"]
set the visible of btn "webname" of me to pDataArray["expanded"]
set the visible of btn "button_cell" of me to pDataArray["expanded"]
set the visible of field "relationship" of me to pDataArray["expanded"]
set the visible of field "company" of me to pDataArray["expanded"]
set the visible of field "street" of me to pDataArray["expanded"]
set the visible of field "city" of me to pDataArray["expanded"]
set the visible of field "state" of me to pDataArray["expanded"]
set the visible of field "zip" of me to pDataArray["expanded"]
-- put the text of field "firstname" of me into twhat
-- put the text of field "label" of me into twhy
-- if (twhat is "" or twhat is empty or twhat is " ") and (twhy is "" or twhy is empty or twhy is " ") then
-- set the visible of graphic "arrowcontracted" of me to false
-- set the visible of button "OK" of me to false
-- set the visible of button "change" of me to false
-- end if
end FillInData
on LayoutControl pControlRect
local theFieldRect
-- This message is sent when you should layout your template's controls.
-- This is where you resize the 'Background' graphic, resize fields and
-- position objects.
-- For fixed height data grid forms you can use items 1 through 4 of pControlRect as
-- boundaries for laying out your controls.
-- For variable height data grid forms you can use items 1 through 3 of pControlRect as
-- boundaries, expanding the height of your control as needed.
-- Example:
put the height of this stack into tstackheight
if the environment is "mobile" and tstackheight >700 then
set the width of graphic "arrowcontracted" of me to 56
set the height of graphic "arrowcontracted" of me to 60
set the width of graphic "arrowexpanded" of me to 60
set the height of graphic "arrowexpanded" of me to 56
else if the environment is "mobile" and tstackheight <=700 then
set the width of graphic "arrowcontracted" of me to 30
set the height of graphic "arrowcontracted" of me to 36
set the width of graphic "arrowexpanded" of me to 36
set the height of graphic "arrowexpanded" of me to 20
else
set the width of graphic "arrowcontracted" of me to 36
set the height of graphic "arrowcontracted" of me to 42
set the width of graphic "arrowexpanded" of me to 42
set the height of graphic "arrowexpanded" of me to 36
end if
put the width of scrollbar "dgScrollbar" of group "dataGrid 22" into scrollbarwidth
put the width of this stack into tstackwidth
put (tstackwidth*.95-scrollbarwidth)*.97 into tavailable
if the environment is "mobile" and tstackheight >700 then
set the textsize of field "firstname" of me to 44
set the width of field "firstname" of me to 100
set the height of field "firstname" of me to 28
set the textsize of field "label" of me to 18
set the width of field "label" of me to 166
set the height of field "label" of me to 32
set the textsize of button "contact_email" of me to 18
set the width of button "contact_email" of me to 278
set the height of button "contact_email" of me to 36
set the textsize of field "street" of me to 18
set the width of field "street" of me to 282
set the height of field "street" of me to 32
set the textsize of field "city" of me to 18
set the width of field "street" of me to 212
set the height of field "street" of me to 32
set the textsize of field "state" of me to 18
set the width of field "state" of me to 72
set the height of field "state"of me to 32
set the textsize of field "zip" of me to 18
set the width of field "zip" of me to 230
set the height of field "zip" of me to 32
set the textsize of field "relationship" of me to 18
set the width of field "relationship" of me to 127
set the height of field "relationship" of me to 44
set the textsize of field "company" of me to 18
set the width of field "company" of me to 161
set the height of field "company" of me to 32
set the textsize of button "webname" of me to 18
set the width of button "webname" of me to 168
set the height of button "webname" of me to 36
set the textsize of button "button_cell" of me to 18
set the width of button "button_cell" of me to 168
set the height of button "button_cell" of me to 36
set the textsize of button "OK" of me to 18
set the textsize of button "change" of me to 18
else if the environment is "mobile" and tstackheight <=700 then
set the textsize of field "firstname" of me to 12
set the width of field "firstname" of me to 100
set the height of field "firstname" of me to 28
set the textsize of field "label" of me to 12
set the width of field "label" of me to 166
set the height of field "label" of me to 32
set the textsize of button "contact_email" of me to 12
set the width of button "contact_email" of me to tavailable*.50
set the height of button "contact_email" of me to 36
set the textsize of field "street" of me to 12
set the width of field "street" of me to tavailable*.50
set the height of field "street" of me to 32
set the textsize of field "city" of me to 12
set the width of field "city" of me to tavailable*.22
set the height of field "city" of me to 32
set the textsize of field "state" of me to 12
set the width of field "state" of me to tavailable*.10
set the height of field "state"of me to 32
set the textsize of field "zip" of me to 12
set the width of field "zip" of me to tavailable*.18
set the height of field "zip" of me to 32
set the textsize of field "relationship" of me to 12
set the width of field "relationship" of me to tavailable*.25
set the height of field "relationship" of me to 44
set the textsize of field "company" of me to 12
set the width of field "company" of me to tavailable*.75
set the height of field "company" of me to 32
set the textsize of button "webname" of me to 12
set the width of button "webname" of me to tavailable*.35
set the height of button "webname" of me to 36
set the textsize of button "button_cell" of me to 12
set the width of button "button_cell" of me to tavailable*.35
set the height of button "button_cell" of me to 36
set the textsize of button "OK" of me to 12
set the textsize of button "change" of me to 12
else
set the textsize of field "firstname" of me to 18
set the width of field "firstname" of me to 100
set the height of field "firstname" of me to 28
set the textsize of field "label" of me to 18
set the width of field "label" of me to 166
set the height of field "label" of me to 32
set the textsize of button "contact_email" of me to 18
set the width of button "contact_email" of me to 278
set the height of button "contact_email" of me to 36
set the textsize of field "street" of me to 18
set the width of field "street" of me to 282
set the height of field "street" of me to 32
set the textsize of field "city" of me to 18
set the width of field "street" of me to 212
set the height of field "street" of me to 32
set the textsize of field "state" of me to 18
set the width of field "state" of me to 72
set the height of field "state"of me to 32
set the textsize of field "zip" of me to 18
set the width of field "zip" of me to 230
set the height of field "zip" of me to 32
set the textsize of field "relationship" of me to 18
set the width of field "relationship" of me to 127
set the height of field "relationship" of me to 44
set the textsize of field "company" of me to 18
set the width of field "company" of me to 161
set the height of field "company" of me to 32
set the textsize of button "webname" of me to 18
set the width of button "webname" of me to 168
set the height of button "webname" of me to 36
set the textsize of button "button_cell" of me to 18
set the width of button "button_cell" of me to 168
set the height of button "button_cell" of me to 36
set the textsize of button "OK" of me to 18
set the textsize of button "change" of me to 18
end if
put item 1 of pControlRect into ttry
put the left of graphic "ArrowExpanded" of me - 6 into item 1 of theFieldRect
put the top of field "firstname" of me into item 2 of theFieldRect
set the left of field "firstname" of me to ttry + 55
put the formattedwidth of field "firstname" of me into tusewidth
set the left of field "Label" of me to ttry + 55 + tusewidth + 3
set the top of button "contact_email" of me to the bottom of field "firstname" of me + 25
set the left of button "contact_email" of me to ttry + 20
set the top of button "OK" of me to the top of field "Label" of me
put the width of this stack into tstackwidth
set the left of button "OK" of me to tstackwidth*.55
set the top of button "change" of me to the bottom of button "OK" of me
set the left of button "change" of me to tstackwidth*.55
set the bottom of button "webname" of me to the bottom of button "contact_email" of me
set the left of button "webname" of me to the right of button "contact_email" of me + 10
set the top of field "street" of me to the bottom of button "contact_email" of me + 10
set the left of field "street" of me to ttry +10
set the left of button "button_cell" of me to the left of button "webname" of me
set the bottom of button "button_cell" of me to the bottom of field "street" of me
put the right of button "button_cell" of me + 10 into tright
put tright into item 3 of theFieldRect
set the left of field "city" of me to ttry + 10
set the top of field "city" of me to the bottom of field "street" of me
put the formattedwidth of field "city" of me into tusewidth2
set the bottom of field "state" of me to the bottom of field "city" of me
set the bottom of field "zip" of me to the bottom of field "city" of me
set the left of field "state" of me to ttry + 10 + tusewidth2 + 5
set the left of field "zip" of me to the right of field "state" of me + 5
set the top of field "relationship" of me to the bottom of field "state" of me + 10
set the left of field "relationship" of me to ttry + 10
set the bottom of field "company" of me to the bottom of field "relationship" of me
set the left of field "company" of me to the right of field "relationship" of me + 10
put the bottom of field "relationship" of me into tbottom
put tbottom into item 4 of theFieldRect
put the label of button "contact_email" of me into tone
if tone is "contact_email" or tone is "" then
set the vis of button "contact_email" of me to false
end if
put the label of button "webname" of me into ttwo
if ttwo is "webname" or ttwo is "" then
set the vis of button "webname" of me to false
end if
put the label of button "button_cell" of me into tthree
if tthree is "button_cell" or tthree is "" then
set the vis of button "button_cell" of me to false
end if
if the visible of field "relationship" of me then
put the bottom of field "relationship" of me + 10 into item 4 of theFieldRect
else
put the bottom of field "firstName" of me + 28 into item 4 of theFieldRect
end if
set the rect of graphic "Background" of me to theFieldRect
end LayoutControl
on ResetData
-- Sent when data is being emptied because the control is no longer being used to display data
set the text of field "Label" of me to empty
end ResetData
on PreFillInData
-- Sent right before new data is going to replace existing data in the control
end PreFillInData
setprop dgHilite pBoolean
-- This custom property is set when the highlight of your custom template has
-- changed. By default the "Background" graphic will be highlighted for you.
-- You only add script here if you want to further customize the highlight.
-- Example:
set the dgProp["hilited text color"] of the dgControl of me to "black"
if pBoolean then
set the foregroundcolor of me to the dgProp["hilited text color"] of the dgControl of me
else
set the foregroundColor of me to empty
end if
end dgHilite
getprop dgDataControl
-- Required by library so that it can locate your control.
return the long ID of me
end dgDataControl
on mouseDoubleUp pMouseBtnNum
local theKey
-- Example of how to edit the contents of a field.
-- By passing the index of the record associated with copy of this template being displayed and
-- a key (array key) the data grid will automatically save the changes the user
-- makes and refresh the UI by calling FillInData and resizeControl.
if pMouseBtnNum is 1 then
if the dgProps["allow editing"] of the dgControl of me then
switch the short name of the target
case "Label"
put "Label 1" into theKey
EditFieldText the long ID of the target, the dgIndex of me, theKey
break
end switch
end if
end if
pass mouseDoubleUp
end mouseDoubleUp
on mouseUp pMouseBtnNum
if pMouseBtnNum is 1 then
switch the short name of the target
case "ArrowExpanded"
case "ArrowContracted"
## Update internal data
SetDataOfIndex the dgIndex of me, "expanded", the short name of the target is "ArrowContracted"
## Redraw so LayoutControl and FillInData can update UI
RefreshIndex the dgIndex of me
break
end switch
end if
end mouseUp