DOCUMENT:Q186429 01-JUN-1998 [vbwin] TITLE :HOWTO: Create Scrollable Viewports PRODUCT :Microsoft Visual Basic for Windows PROD/VER:WINDOWS:4.0,5.0 OPER/SYS:WINDOWS KEYWORDS:kbVBp400 kbVBp500 ====================================================================== --------------------------------------------------------------------- The information in this article applies to: - Microsoft Visual Basic Learning, Professional, and Enterprise Editions for Windows, version 5.0 - Microsoft Visual Basic Standard, Professional, and Enterprise Editions, 16-bit and 32-bit, for Windows, version 4.0 --------------------------------------------------------------------- SUMMARY ======= This article demonstrates how you can create a scrollable viewport by using the properties of two picture box controls. You can use this information to display pictures that are larger than your default form size. MORE INFORMATION ================ This article assumes that you are familiar with using the picture box control. To create a scrollable viewport, you will need a picture box control inside another picture box control. The outside picture box control acts as a stationary parent picture box control. The inside picture box becomes the movable child picture box control within the boundaries of the parent picture box. When you move the child picture box control during run-time, a clipping effect bound by the parent picture control is created. The next section shows you how to create a sample project that demonstrates how to create a movable viewport. The sample requires a picture image, such as the bitmap files stored in the following directory: c:\Program Files\DevStudio\VB\samples\PGuide\Optimize Steps to Create Sample Project ------------------------------ 1. Start a new Standard EXE project in Visual Basic. Form1 is created by default. 2. Add two Picture boxes to Form1. Make sure that Picture2 is inside of Picture1. 3. Add a horizontal scroll bar and a vertical scroll bar to Form1. 4. Copy the following code to the Code window of Form1: NOTE: Add the path and filename to your picture file in the appropriate section of the Form_Load event. Option Explicit Private Sub Form_Load() Picture1.Move 0, 0, ScaleWidth - VScroll1.Width, _ ScaleHeight - HScroll1.Height With Picture2 ' Expand the boundaries of Picture2 picture box to the size ' of the actual bitmap. .AutoSize = True ' Enter the path and file name as the argument to the ' LoadPicture method .Picture = LoadPicture("splash.bmp") ' Initialize location of both pictures. .Move 0, 0 End With ' Position the horizontal scroll bar. With HScroll1 .Top = Picture1.Height .Left = 0 .Width = Picture1.Width End With ' Position the vertical scroll bar. With VScroll1 .Top = 0 .Left = Picture1.Width .Height = Picture1.Height End With ' Set the Max value for the scroll bars. HScroll1.Max = Picture2.Width - Picture1.Width VScroll1.Max = Picture2.Height - Picture1.Height HScroll1.LargeChange = HScroll1.Max / 10 VScroll1.LargeChange = VScroll1.Max / 10 ' Determine if child picture will fill up screen. ' If so, then there is no need to use scroll bars. VScroll1.Visible = (Picture1.Height < Picture2.Height) HScroll1.Visible = (Picture1.Width < Picture2.Width) End Sub Private Sub HScroll1_Change() ' Picture2.Left is set to the negative of the value because ' as you scroll the scroll bar to the right, the display ' should move to the Left, showing more of the right ' of the display, and vice-versa when scrolling to the ' left. Picture2.Left = -HScroll1.Value End Sub Private Sub VScroll1_Change() ' Picture2.Top is set to the negative of the value because ' as you scroll the scroll bar down, the display ' should move up, showing more of the bottom ' of the display, and vice-versa when scrolling up. Picture2.Top = -VScroll1.Value End Sub Private Sub Form_Resize() ' The Picture1 picture box dimensions are changed when the form ' size is changed. With Picture1 .Height = Form1.Height .Width = Form1.Width End With ' Re-Initializes picture positions & scroll bars. Picture1.Move 0, 0, ScaleWidth - VScroll1.Width, _ ScaleHeight - HScroll1.Height Picture2.Move 0, 0 With HScroll1 .Top = Picture1.Height .Left = 0 .Width = Picture1.Width .Max = Picture2.Width - Picture1.Width End With With VScroll1 .Top = 0 .Left = Picture1.Width .Height = Picture1.Height .Max = Picture2.Height - Picture1.Height End With ' Checks to see if scroll bars are needed VScroll1.Visible = (Picture1.Height < Picture2.Height) HScroll1.Visible = (Picture1.Width < Picture2.Width) End Sub 5. On the Run menu, click Start or press the F5 key to start the program. If you do not see any scroll bars, reduce the size of the form until you see the scroll bars. Additional query words: kbDSupport kbDSD kbCtrl kbUsage kbVBp500 kbVBp400 ====================================================================== Keywords : kbVBp400 kbVBp500 Version : WINDOWS:4.0,5.0 Platform : WINDOWS Issue type : kbhowto ============================================================================= THE INFORMATION PROVIDED IN THE MICROSOFT KNOWLEDGE BASE IS PROVIDED "AS IS" WITHOUT WARRANTY OF ANY KIND. MICROSOFT DISCLAIMS ALL WARRANTIES, EITHER EXPRESS OR IMPLIED, INCLUDING THE WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE. IN NO EVENT SHALL MICROSOFT CORPORATION OR ITS SUPPLIERS BE LIABLE FOR ANY DAMAGES WHATSOEVER INCLUDING DIRECT, INDIRECT, INCIDENTAL, CONSEQUENTIAL, LOSS OF BUSINESS PROFITS OR SPECIAL DAMAGES, EVEN IF MICROSOFT CORPORATION OR ITS SUPPLIERS HAVE BEEN ADVISED OF THE POSSIBILITY OF SUCH DAMAGES. SOME STATES DO NOT ALLOW THE EXCLUSION OR LIMITATION OF LIABILITY FOR CONSEQUENTIAL OR INCIDENTAL DAMAGES SO THE FOREGOING LIMITATION MAY NOT APPLY. Copyright Microsoft Corporation 1998.