Control objects Sizing and placement in Graphicsgrid Vs Grid:

I have created a grid, and also made a list of control objects(e.g., input fields, buttons, etc.). Then, I lay the list in my grid. There is no problem. However, the final layout takes a lot of time. I timed each operation and realized that the final grid layout is the one that takes up a huge chunk of time. Is there a better way of controlling the execution time of the graphics grid.

mygrid = ConstantArray["", {100, 100}];
mybutton1 = Button["Example", ImageSize -> {40, 50}];
myinput2 = InputField[x];
updatedlist = {};
updatedlist = ReplacePart[mygrid, {1, 2} -> mybutton1];
updatedlist = ReplacePart[updatedlist, {2, 3} -> myinput2];
Panel[GraphicsGrid[updatedlist, ImageSize -> {30, 40}, ContentSelectable -> True]]


The above code takes a lot of time to execute. I used the Timing function of Mathematica to figure out which part took the long time to execute and it was the

Panel[GraphicsGrid[updatedlist, ImageSize -> {30, 40}, ContentSelectable -> True]]


part that was the longest. Because of this, my entire application has slowed down.

Based on the comments in Mathematica, I tried to use a Grid for the updatedlist above, but the problem is, how can I set the ImageSize of the Grid which is an option for the GraphicsGrid and not Grid?

One could use scaled ItemSize and wrap the Grid in a Pane that has a fixed imagesize eg. Pane[Grid[{{1, 2}, {3, 4}}, ItemSize -> Scaled[0.5]], ImageSize -> 200]. But the problem with Grid is that Scaled option for ItemSize does not work for all times. And another problem is the size of the Grid is not a constant value because of the individual ItemSize. However my application demands that the Grid be a constant. Also, I tried to do something like this:

li=ConstantArray["",{5,20}];
b1=Button["Click",Null,ImageSize->{250,60}];
b2=Button["Click",Null,ImageSize->{400,80}];
b3=Button["Click",Null,ImageSize->{250,90}];
b4=Button["Click",Null,ImageSize->{100,90}];
li=ReplacePart[li,{1,2}->b1];
li=ReplacePart[li,{4,2}->b2];
li=ReplacePart[li,{5,2}->b3];
li=ReplacePart[li,{5,3}->b4];
li[[1,3;;6]]=SpanFromLeft;
li=ReplacePart[li,{4,3}->SpanFromLeft];
li=ReplacePart[li,{4,4}->SpanFromLeft];
li=ReplacePart[li,{4,5}->SpanFromLeft];
li=ReplacePart[li,{4,6}->SpanFromLeft];
Grid[li,Frame->All, ItemSize->Full]


The output was something like this:

I want to be able to accurately place the control objects without messing the sizes and have perfect predictable appearance on the front end. Anyone knows how to make my code better and the interactive application look better?

-
When I try to execute your first code block my MMA freezes. –  Murta Mar 5 '13 at 2:59
@Murta, Thanks for the reply, but you can reduce number in the grid to 10,10 and still be able to achieve what I am trying to do. Please help me, as I require a lot of help. –  Anuk Mar 5 '13 at 15:41
I am having trouble understanding this question. You seem to show the output you don't want ("The output was something like this") but do you show the output you do want? –  Mr.Wizard Mar 5 '13 at 21:23
@Mr.Wizard, Thanks for the reply, I have shown the first screen, thats how I want the output to be. The problem is even though Graphicsgrid is a powerful tool but it takes up a lot f execution time. What I am trying to to is perfectly locate a place where I can put a control object and span the space in the Grid to the size of the object and then place another control object at a place I want it to be. With Grid, the Grid automatically re sizes itself to the individuals elements and not stay constant throught my application. –  Anuk Mar 6 '13 at 4:48
Anuk, do you need the grid functionality or can you calculate coordinates for each element (control object) and place them at a precise spot (x,y) using Inset? This is what I attempted to illustrate in my answer, though probably not with a very good example. –  Mr.Wizard Mar 6 '13 at 4:50

It is not clear to me from your question what you need. You say:

I want to be able to accurately place the control objects without messing the sizes and have perfect predictable appearance on the front end.

Perhaps what you want can be done with Inset in Graphics, along with Deploy:

mygrid = ConstantArray["\[FilledSmallCircle]", {10, 10}];
mybutton1 = Button["Example", ImageSize -> {70, 30}];
myinput2 = InputField[x];
updatedlist = ReplacePart[mygrid, {{7, 2} -> mybutton1, {3, 5} -> myinput2}];

Graphics[
MapIndexed[Inset, updatedlist, {2}],
ImageSize -> {400, 300}
] // Deploy


You will have to manually size and locate your objects because as you can see above Mathematica will happily place one on top of another, but it sounds to me like you might even want to manually size and place your control objects so perhaps this is a solution?

To clarify, the background "grid" of dots is merely a reference; you would not include these (or empty strings) in actual use as that would slow things down again.

-