Quick Tip: Design Your Application for Multiple Screen Sizes

by Jack Wheeler

I was in the process of designing an application for a display setting of 1024 X 768 on a 17-inch Monitor. I have been assuming that in the near future everyone will be using 17 inch or larger monitors.

BUT…… then I was thrown for a loop when one of the sales people called me and said he could not see my ‘Beautiful’ forms on his laptop. For the life of me I could not understand this at all! Why would he be able to see the form on his office machine but not on his laptop? The reason is probably obvious to you: it was his Windows display Screen Area settings, which were different on the laptop from those on his desktop.

At this point I Emailed Dr Wayne and he was kind enough to email me back and he explained that I was wrong in thinking that all users would soon move to larger monitors. He believed that there are and will always be more smaller monitors than larger monitors, if for no other reason than "SPACE". He pointed out that most workplace desks cannot afford the room larger monitors require and advised me to develop for smaller monitors and settings.

I was still puzzled by this. I knew that if I was using Quicken® I could use it at any display setting. It would seem to magically fill my monitor no matter what the setting was. It was as though the forms simply stretched or scrunched to fill the screen. But in reality what was actually happening is Quicken was reading the display setting and displaying the appropriate form for that particular setting! And guess what? Alpha Five gives us an easy way to do this!

The ui_info() function was the tool I needed. All I had to do was design every form three times, one for a screen setting of 640 x 480, one for 800 x 600, and one for 1024x768 or larger monitors. There are some creative ways to do this. If a form is opened as a dialog simply changing the window to a new position will normally suffice. Design the first form as Small (640 X 480) and then just stretch all the fields out for the other two settings.

Here is what I did:

When I load an application I have a global script that finds the width of the full screen and then loads the appropriate form. My original MainMenu form was replaced by MainMenuLarge, MainMenuSmall, and MainMenuMed. Each MainMenuXXX form then calls up other forms of the same size. In essence, I have 3 parallel sets of forms for the application, but only one runs, depending on the screen resolution.

Here is the global script:

If ui_info(0)>1000 then
 if is_object("MainMenuLarge") then
  MainMenuLarge.show()
  MainMenuLarge.activate()
 else
  :Form.view("MainMenuLarge")
 end if
elseif Between(ui_info(0),650,1000) then
 if is_object("MainMenuMed") then
  MainMenuMed.show()
  MainMenuMed.activate()
 else
  :Form.view("MainMenuMed")
 end if
else
 if is_object("MainMenuSmall") then
  MainMenuSmall.show()
  MainMenuSmall.activate()
 else
  :Form.view("MainMenuSmall")
 end if
end if

I am very surprised that this very simple approach was so hard to find. I have noticed that many people have answered the problem of displaying forms with the approach in the Xbasic Manual in which you divide Alpha Five's window in half and show the form centered. That really doesn't change the form size. Although there is a bit more work to do in designing more forms, it really does not take too long. Redesigning the extra forms for my scheduling program took me around 4 hours. Not too bad!

screensize=ui_info(0)
select
	case screensize>1000
		frm="MainMenuLarge" 
	case screensize>650
		frm="MainMenuMed"
	case else
		frm="MainMenuSmall"
end select
p=obj(frm)
if is_object(p) then
	p.show()
	p.activate()
else
	:Form.view(frm)
end if

2/23/00

Don't forget, we need your feedback to make this site better!

Return to home