Skip to main content

Past Blast

Featured Products

Stay in touch using the DEVBUSS RSS feeds.
 

News

Building a GUI Engine with Frames

Written by Christopher Tacke  [author's bio]  [read 42183 times]
Edited by Derek

Download the code

Page 1  Page 2  Page 3 

That is pretty much all of the implementation for the stack itself, but since we're working with Frames for a GUI engine, this is the ideal place to handle the graphical parts of the stack as well. The next section of code positions the new Frame in the viewable area of the screen, makes the newly pushed Frame visible, and hides the Frame's border.

m_objFrameStack(m_iFramesOnStack).Left = _
FRAME_X_OFFSET
m_objFrameStack(m_iFramesOnStack).Top = _
FRAME_Y_OFFSET
m_objFrameStack(m_iFramesOnStack).ZOrder 0
m_objFrameStack(m_iFramesOnStack).Visible = True
m_objFrameStack(m_iFramesOnStack).BorderStyle = _
vbBSNone

The last item of business is to update our stack item counter and refresh the form to make sure our Frame is shown where it's supposed to be.

m_iFramesOnStack = m_iFramesOnStack + 1
objForm.Refresh

Now adding a frame to the stack is as simple as this:

PushFrame frmMain, "fraTitle"

And the stack method positions and displays the frame for you.

Go through the Form code and add the appropriate PushFrame calls in the Click event handlers for all of the relevant CommandButtons. For example, the single Button on fraListing should push fraTitle on the stack.

Popping Frames

Now that you're able to push frames onto the stack, you need to be able to pop them back off. PopFrame takes two input parameters: the form on which the Frames in the stack reside and the number of Frames to pop.

The first order of business is to make sure we're not trying to pop more frames than the stack holds. This example simply exits the function if it's attempted, but you could easily add functionality to pop all but the last frame or to pass back an error value.

If m_iFramesOnStack - intFramesToPop <= 0 Then
Exit Function
End If

Next the Frame being popped is set to non-visible:

m_objFrameStack(m_iFramesOnStack - 1).Visible = _
False

The stack array is resized:

ReDim Preserve m_objFrameStack(m_iFramesOnStack - _
intFramesToPop - 1)

And our stack element counter is updated:

m_iFramesOnStack = m_iFramesOnStack - _
intFramesToPop

Finally, the Frame now at the top of the stack is made visible and the Form is refreshed:

m_objFrameStack(m_iFramesOnStack - 1).Visible = _
True
objForm.Refresh

Now that you have a full pop method, implement it in your project by adding a call to it in the Back button's Click event handler like this:

Private Sub cmdBack_Click()
PopFrame Me, 1
End Sub

The Stack In Action

You stack is now fully functional, but to make it a little more demonstrative, it would be nice to be able to see the stack's contents at any time. To do this, I created a method in the module called StackEnum that simply iterates through the stack array backwards, adding the Frame name to a string. Once it has iterated all the Frames, it pops up a MsgBox with the stack's contents. Implement this method by adding a call to StackEnum in the Click event handler for the cmdStackEnum button.

The last remaining item of business is to add the first Frame, fraListing, to the stack at startup so the screen doesn't start out blank. Add a call to PushFrame in Form_Load and run the project.

Test out the application by moving through a few screens in whatever order you feel like then take a look at the stack by clicking on the 'Show Stack' button. You will get a list of all the frames you've viewed in order with the most recent at the top, something like Figure 2.

One thing that I haven't demonstrated here, and that you may have already caught, is that we when we back through the stack, we may well pass through the same Frame multiple times, but it's quite possible that it should have different data displayed each time. How do we tell the Frame to populate with the right data?

Adding support for additional data is not as difficult as one might think. There's no rule that says the stack can only hold the Frame. You can add a dimension to the stack and use the second dimension to hold, for example, the ID of the data that should be displayed.

Of course this means adding a bit more code to the PushFrame method, but it doesn't require a great deal of effort and you can customize it to your applications needs in many ways. I leave this implementation to your own creativity and imagination.

Previous Page