Scaling objects on forms / user controls 1

[rdgerken]

Hi all,

I have been creating a lot of user controls for one of my applications, and I have really been bogged down with programming the resize event for the control. Basically I have to calculate the location and size for all the objects on my user control and set them accordingly on the controls resize event. It works great, but it is a real pain to calculate all this stuff out, and not to mention you have to do some math to figure out if the scaling factors have rounding errors that will throw the location and/or size off by a pixel. Does anyone have any advice or tips on how to make the process of creating resizable user controls? I thought about writing a program that would take all the locations and sizes at design time, and generate the code necessary for the resize event - but before I'd venture out and spend time doing that, I was wondering if anyone had an easier way, or perhaps there is something out there that does this already. Thanks!

 

[JohnYingling]

Have you looked at the Control.Scale Method?

http://www.moldyoldy.com/VBComparedemo

- free online Compare/Diff of snippets

 

[rdgerken]

John, thanks for the tip. I see that control.scale does offer some hope, however, I'm having some trouble taming it.

I tried this in my code on the form resize event.

private void Form1_Resize(object sender, EventArgs e)
{
//StartX is initialized to this.Width in the constructor
//StartY is initialized to this.Height in the constructor
float ScaleX=(float)this.Width/StartX;
float ScaleY=(float)this.Height/StartY;
foreach(System.Windows.Forms.Control c in this.Controls)
{
c.Scale(ScaleX,ScaleY);
}
StartX=this.Width;
StartY=this.Height;
}

It kinda works, but it seems that objects in the middle of the form stretch and shrink ununiformly with the rest of the controls. What do you think? I can't understand why controls of the same size at different locations on the form would scale differently than the others.

 

[JurkMonkey]

If you are having a problem with odd spacing or uneven width/height, it is probably an integer "rounding" error.

Convert all of your values (including StartX and StartY to float) Then do your calculations.

Let us know!

 

[rdgerken]

Well, they are all floats. I guess there has to be some kind of rounding error causing it, but you'd think it would affect objects that are the same size, the same - but it doesn't. If you want to see what it does for yourself, make a new project, throw a couple of buttons on a form, make them the same size, create a resize event and copy the code I pasted earlier in there and run it. Does it seem like a rounding issue?

Either way, it looks like I'll have to resort to calculating the location and size of each object manually. I do appreciate the tip though, it was definitely worth a shot. Maybe someone else can chime in here with an idea.

Thanks again.

 

[rdgerken]

I set up a condition on the resize event so that if any of the three buttons I have are not the same size after the scaling procedure, to output some measurements to the console. If you take a look at the output below, you can see what is happening. My form starts at a size of 408 x 408. When I grab the form and stretch it vertically, you can see here that the scaling did not scale the buttons the same size, even though the buttons start out as the same size.

------------
Scale X = 1 FormWidth = 408
Scale Y = 1.002451 FormHeight = 409
ButtonA W,H = 88,49
ButtonB W,H = 88,48
ButtonC W,H = 88,48

Here you can see that ButtonA did not scale the same as ButtonB or ButtonC. At design time, all buttons are 88x48.

When the form's height was increased by 1, only ButtonA had an increase - the other controls did not change. How can this be?

Can anyone make heads or tails out of this? Does anyone have anymore information as to how the Scale method works? MSDN didn't really elaborate on it. Thanks

 

[rdgerken]

I guess maybe part of the problem is that when you grab the form to resize it, the resize event is happening continuously and the resulting scale factors are very small, most of the time so small that the size of the control won't change because the resulting difference is less than a pixel - depending on how fast you are dragging. (You can see this effect by resizing the form very slowly.) This still doesn't explain how one control can get larger than the others when scaled with the same value though. Either way, I need to look at the calculated scaling factor to see if it is significant enough to make a difference, and then once it is, then go ahead and do the scaling, and reset the scale size - instead of doing it on every single resize event.

I'll have to come back to this later.

 

[JohnYingling]

I would keep the original form size, "design size", as a basis for computing the scaling factor using the current form size.

http://www.moldyoldy.com/VBComparedemo

- free online Compare/Diff of snippets

 

[rdgerken]

Well, after all that, I'm pretty much back to the way I was doing it before. Taking all the design time sizes and calculating the location and size as such. For example:

this.ButtonB.Location = new System.Drawing.Point(1,this.ButtonA.Bottom);
this.ButtonB.Size = new System.Drawing.Size((int)(88.0/408.0*this.Width),(int)(48.0/408.0*this.Height));

This works fine, but like I said before, it can be very time consuming if you have a lot of controls on the form.

I think I'll try to write a routine that loops through all the controls on the form and generates some code for the location and sizes for each control based off of the design time values. Thanks for your help.

 

[JohnYingling]

You only need ONE design size, the form size.
something ;ike
this.Scale(Convert.ToSingle(this.Width / 408), Convert.ToSingle(this.Height / 408))

http://www.moldyoldy.com/VBComparedemo

- free online Compare/Diff of snippets

 

[rdgerken]

John,

That definitely did not work for me. The other day when I was messing around with this, I tried several different variations of using the Scale method. Some where just on the form itself, others, I would loop through each control and use the Scale method. I was unsuccessful at getting anywhere with that. The closest I got was to calculate a scale factor from the previous size to the new size and loop through each control and issue the Scale method based on that, then update the values for my previous location, so that the next time through, it would be calculated the same way. (See post #3). I determined that this would not work because after several iterations using the resize event, many times the resulting scale factors are not large or small enough to make a difference, hence, the form would change size, but the controls would not. And then this other issue... Sometimes giving the scale command with the same factors to objects of the same size but different locations would result in different results. I never got to the bottom of that, but apparently, the location has something to do with that (most likely a rounding issue). Anyways, what I ended up doing was looping through each control and generate a line of code for the location, and one for the size - based off of design time sizes and locations. I then just copied this into the resize event for the control I created. I would still be interested in getting Scale to work if there is a way!

 

[JohnYingling]

I would be tempted to keep an invisible instance of the form as a reference for the original control locations and sizes but I'll wait until I need to do it.

http://www.moldyoldy.com/VBComparedemo

- free online Compare/Diff of snippets