|
|||||||||||||||||||||
|
|||||||||||||||||||||
|
Announcements
Chapters
Services
Feature Zones
|
IntroductionDisplaying large Bitmap files on a Dialog, in its original size is quite difficult in the VC++ Environment. However, it is possible to display a large bitmap to a predefined area of the dialog using the
Although the primary aim of this article is to display a bitmap with scrolling, it also covers the following three main objectives.
Loading Bitmap in to the Dialog During Run-time:Sometimes the user may require different bitmaps to be loaded in to the dialog depending on the requirements of his GUI. This can be achieved by calling the Place a Picture control in your dialog. Adjust its size as you wish. Remember, you are going to display the bitmap in this control. Big bitmaps will confine to the entire area of this control with a vertical scroll bar on Right side ( the scroll bar will be displayed if the height of the image is greater than the height of this control) and a horizontal scroll bar at the bottom of this control (the scrollbar will be displayed if the width of the image is greater than the width of this control). Small bitmaps will be displayed at the centre of this control without scrollbars, with equal clearance to the left & right, and top & bottom with respect to the control. So place your control with an artistic touch to give your dialog a nice appearance. Take the properties of the picture control. Change its ID to IDC_STATIC1 and Type as Frame and Colour as Gray. Also uncheck the Visible check button so that the tick mark is removed from it.
Using Class Wizard, create a control variable of type In your dialog's header file (say MyDlg.h), add the following code: public: CRect rectStaticClient; int sourcex, sourcey,offsetx,offsety; protected: CDC m_dcMem; // Compatible Memory DC for dialog HBITMAP m_hBmpOld; // Handle of old bitmap to save HBITMAP m_hBmpNew; // Handle of new bitmap from file BITMAP m_bmInfo; // Bitmap Information structureIn your dialog's implementation file (say MyDlg.cpp), add the following code: BOOL CMyDlg::OnInitDialog()
{
// TODO: Add extra initialization here
CClientDC dc(this);
m_dcMem.CreateCompatibleDC( &dc );
return TRUE; // return TRUE unless you set the focus to a control
}
Override the void MyDlg::OnPaint() { if (IsIconic()) { CPaintDC dc(this); // device context for painting SendMessage(WM_ICONERASEBKGND, (WPARAM) dc.GetSafeHdc(), 0); // Center icon in client rectangle int cxIcon = GetSystemMetrics(SM_CXICON); int cyIcon = GetSystemMetrics(SM_CYICON); CRect rect; GetClientRect(&rect); int x = (rect.Width() - cxIcon + 1) / 2; int y = (rect.Height() - cyIcon + 1) / 2; // Draw the icon dc.DrawIcon(x, y, m_hIcon); } else { //Add the following Code CPaintDC dc(this); dc.BitBlt(offsetx,offsety,m_size.cx,m_size.cy, &m_dcMem, sourcex, sourcey,SRCCOPY); CDialog::OnPaint(); } } Write the following code whenever you want to load a bitmap in to your dialog. m_hBmpNew = (HBITMAP) LoadImage(
AfxGetInstanceHandle(), // handle to instance
filename, // name or identifier of the image .say"C:\\NewFolder\\1.bmp"
IMAGE_BITMAP, // image types
0, // desired width
0, // desired height
LR_LOADFROMFILE);
if( m_hBmpNew == NULL )
{
AfxMessageBox("Load Image Failed");
}
// put the HBITMAP info into the CBitmap (but not the bitmap itself)
else {
m_st1.GetClientRect( &rectStaticClient );
rectStaticClient.NormalizeRect();
m_size.cx=rectStaticClient.Size().cx;
m_size.cy=rectStaticClient.Size().cy;
m_size.cx = rectStaticClient.Width(); // zero based
m_size.cy = rectStaticClient.Height(); // zero based
// Convert to screen coordinates using static as base,
// then to DIALOG (instead of static) client coords
// using dialog as base
m_st1.ClientToScreen( &rectStaticClient );
ScreenToClient( &rectStaticClient);
m_pt.x = rectStaticClient.left;
m_pt.y = rectStaticClient.top;
GetObject( m_hBmpNew , sizeof(BITMAP), &m_bmInfo );
VERIFY(m_hBmpOld = (HBITMAP)SelectObject(m_dcMem, m_hBmpNew ) );
offsetx= m_pt.x;
offsety=m_pt.y;
InvalidateRect(&rectStaticClient);
This much code will display a bitmap directly on to the picture control during run time. Remember the scrolling capability and alignment adjustments haven't been done yet and so the image will be displayed at the top corner of the Picture control, and if its size is bigger than that of the picture control, it will be clipped to the picture control's size. If the image is smaller than the size of the picture control it will be displayed without clipping, but without centre alignment. The following section describes how scrolling capability and alignment can be achieved. Displaying the Bitmap at its original size using scrollingAdd a vertical scroll bar control to your dialog and place it touching the right edge of your picture control. Make its length to that of the height of your picture control. Add a Horizontal scroll bar control to your Dialog and place it touching the bottom edge of your picture control. Make its length to that of the width of your picture control. Using Class Wizard, create member variables of type CScrollBar m_vbar; //For vertical Scroll Bar CScrollBar m_hbar; //For Horizontal Scroll Bar. You need to create two public: CRect rectStaticClient; int sourcex, sourcey,offsetx,offsety; SCROLLINFO horz,vert; You only need to show the scrollbars if the size of the bitmap is greater than that of the size of your picture control. So hide the scrollbars initially by writing the following code in your dialog's BOOL CMyDlg::OnInitDialog()
{
// TODO: Add extra initialization here
CClientDC dc(this);
m_dcMem.CreateCompatibleDC( &dc );
m_vbar.ShowWindow(false); //Hide Vertical Scroll Bar
m_hbar.ShowWindow(false); //Hide Horizontal Scroll Bar
return TRUE; // return TRUE unless you set the focus to a control
}
Four situations arise when you are loading a bitmap in to your pre-defined picture control. They are: Case 1: Both the width and height of the loaded bitmap is greater than that of the picture control. In such situations both the horizontal and vertical scrollbars are necessary to show the entire bitmap. The bitmap is displayed using the scrolling technique. The vertical scrolling range is equal to the height of bitmap-height of the picture control. The height and width of the bitmap is obtained by the following code, which is incorporated in the code which is needed for displaying bitmaps, which is reproduced here again as: m_size.cx = rectStaticClient.Width(); // zero based m_size.cy = rectStaticClient.Height(); // zero based GetObject( m_hBmpNew , sizeof(BITMAP), &m_bmInfo ); The maximum vertical scrolling range is m_hbar.ShowWindow(true); m_vbar.ShowWindow(true); Case 2:THe width of the loaded bitmap is greater than that of the picture control and height is equal to or less than that of picture control. In such situations the horizontal scroll bar is necessary to show the entire bitmap. The bitmap is displayed using the scrolling technique. The horizontal scrolling range is given by In this case vertical scroll bar is not needed, but for displaying the bitmap centralised with respect to the picture control, the Bitmap should be drawn at an offset from the top corner of the picture control given by offsety = m_pt.y + ((m_size.cy - m_bmInfo.bmHeight)/2); Where A clearance of m_hbar.MoveWindow(offsetx,offsety+m_bmInfo.bmHeight,m_size.cx,18);
Make the horizontal scrollbar visible and the vertical scrollbar invisible by calling m_hbar.ShowWindow(true); m_vbar.ShowWindow(false); Case 3: The height of the loaded bitmap is greater than that of the picture control and the width is equal to or less than that of picture control. In Such situations the vertical scrollbar is necessary to show the entire bitmap. The bitmap is displayed using scrolling technique. The vertical scrolling range is given by In this case horizontal scrollbar is not needed, But for displaying the bitmap centralised with respect to the picture control, the Bitmap should be displayed at an offset from the top corner of the picture control given by: offsetx= m_pt.x + ((m_size.cx - m_bmInfo.bmWidth)/2); Where offsetx is the offseted 'x1' co-ordinate in (x1,y1) (x2,y2) co-ordinate system and A clearance of m_vbar.MoveWindow(offsetx+m_bmInfo.bmWidth,offsety,18,m_size.cy);
Make the vertical scrollbar visible and horizontal scrollbar invisible by calling m_hbar.ShowWindow(false); m_vbar.ShowWindow(true); Case 4: The height and width of the loaded bitmap is equal to or smaller than that of the picture control. In Such situations the vertical and horizontal scrollbars are not needed to show the entire Bitmap. The Bitmap is displayed centrally, as such, in the picture control. For displaying the bitmap centrally with respect to the picture control, the bitmap should be displayed at an offset from the top corner of the Picture control given by: offsetx= m_pt.x + ((m_size.cx- m_bmInfo.bmWidth)/2); offsety= m_pt.y + ((m_size.cy - m_bmInfo.bmHeight)/2); Where 'offsetx' is the offseted z co-ordinate, the 'x1' co-ordinate is in the (x1,y1) (x2,y2) co-ordinate system where Make the vertical and horizontal scrollbars invisible by calling m_hbar.ShowWindow(false); m_vbar.ShowWindow(false); Fill up the //Horizontal Scroll Info Structure horz.cbSize = sizeof(SCROLLINFO); horz.fMask = SIF_ALL; horz.nMin = 0; horz.nMax = m_bmInfo.bmWidth-m_size.cx; horz.nPage =0; horz.nPos = 0; horz.nTrackPos=0; m_hbar.SetScrollInfo(&horz); //Vertical Scroll Info Structure vert.cbSize = sizeof(SCROLLINFO); vert.fMask = SIF_ALL; vert.nMin = 0; vert.nMax = m_bmInfo.bmHeight-m_size.cy; vert.nPage = 0; vert.nTrackPos=0; m_vbar.SetScrollInfo(&vert); Now display the picture by invalidating the picture control. InvalidateRect(&rectStaticClient); Remember, depending on the requirements of your loaded image, the positions of the scrollbars may be changed. So before displaying another bitmap in to your dialog, release the memory holding the current bitmap and reset the positions of scrollbars to their original location, i.e. to the positions where you placed them during the design of your dialog, by calling if(m_hBmpNew != NULL ) DeleteObject(m_hBmpNew); //Release Memory holding Bitmap // Reset position of Vertical Scroll Bar m_vbar.MoveWindow(offsetx+m_size.cx,offsety,18,m_size.cy); // Reset position of Horizontal Scroll Bar m_hbar.MoveWindow(offsetx,offsety+m_size.cy,m_size.cx,18); The code given below summarizes the things explained above: if(m_hBmpNew != NULL ) DeleteObject(m_hBmpNew); //Release Memory holding Bitmap sourcex=sourcey=0; // Set starting Position of Source Bitmap to //be copied to (0,0) m_hBmpNew = (HBITMAP) LoadImage(AfxGetInstanceHandle(), // handle to instance "Path of Bitmap", // name or identifier of the image (say "C:\\bitmap.bmp") IMAGE_BITMAP, // image types 0, // desired width 0, // desired height LR_LOADFROMFILE); if( m_hBmpNew == NULL ) { AfxMessageBox("Load Image Failed"); } // put the HBITMAP info into the CBitmap (but not the bitmap itself) else { m_st1.GetClientRect( &rectStaticClient ); rectStaticClient.NormalizeRect(); m_size.cx=rectStaticClient.Size().cx; m_size.cy=rectStaticClient.Size().cy; m_size.cx = rectStaticClient.Width(); // zero based m_size.cy = rectStaticClient.Height(); // zero based // Convert to screen coordinates using static as base, // then to DIALOG (instead of static) client coords // using dialog as base m_st1.ClientToScreen( &rectStaticClient ); ScreenToClient( &rectStaticClient); m_pt.x = rectStaticClient.left; m_pt.y = rectStaticClient.top; GetObject( m_hBmpNew , sizeof(BITMAP), &m_bmInfo ); VERIFY(m_hBmpOld = (HBITMAP)SelectObject(m_dcMem, m_hBmpNew ) ); offsetx= m_pt.x; offsety=m_pt.y; // Reset position of Vertical Scroll Bar m_vbar.MoveWindow(offsetx+m_size.cx,offsety,18,m_size.cy); // Reset position of Horizontal Scroll Bar m_hbar.MoveWindow(offsetx,offsety+m_size.cy,m_size.cx,18); horz.cbSize = sizeof(SCROLLINFO); horz.fMask = SIF_ALL; horz.nMin = 0; horz.nMax = m_bmInfo.bmWidth-m_size.cx; horz.nPage =0; horz.nPos = 0; horz.nTrackPos=0; if(m_bmInfo.bmWidth<=m_size.cx) { if((m_size.cx-m_bmInfo.bmWidth)==0) offsetx= m_pt.x; else offsetx= m_pt.x+((m_size.cx-m_bmInfo.bmWidth)/2); m_vbar.MoveWindow(offsetx+m_bmInfo.bmWidth,offsety,18,m_size.cy); m_hbar.ShowWindow(false); } else m_hbar.ShowWindow(true); m_hbar.SetScrollInfo(&horz); vert.cbSize = sizeof(SCROLLINFO); vert.fMask = SIF_ALL; vert.nMin = 0; vert.nMax = m_bmInfo.bmHeight-(m_size.cy); vert.nPage = 0; vert.nTrackPos=0; if(m_bmInfo.bmHeight<=m_size.cy) { if((m_size.cy-m_bmInfo.bmHeight)==0) offsety= m_pt.y; else offsety= m_pt.y+((m_size.cy-m_bmInfo.bmHeight)/2); m_hbar.MoveWindow(offsetx,offsety+m_bmInfo.bmHeight,m_size.cx,18); m_vbar.ShowWindow(false); } else m_vbar.ShowWindow(true); m_vbar.SetScrollInfo(&vert); InvalidateRect(&rectStaticClient); } Now your bitmap is ready to be displayed on the dialog with scrollbars (if needed). But still it's not able to scroll to show the remaining portions. We need to handle the Using Class Wizard, handle void CMyDlg::OnVScroll(UINT nSBCode, UINT nPos, CScrollBar* pScrollBar) { // TODO: Add your message handler code here and/or call default switch (nSBCode) { case SB_TOP: sourcey = 0; break; case SB_BOTTOM: sourcey = INT_MAX; break; case SB_THUMBTRACK: sourcey = nPos; break; } m_vbar.SetScrollPos(sourcey); InvalidateRect(&rectStaticClient); CDialog::OnVScroll(nSBCode, nPos, pScrollBar); } void CMyDlg::OnHScroll(UINT nSBCode, UINT nPos, CScrollBar* pScrollBar) { // TODO: Add your message handler code here and/or call default switch (nSBCode) { case SB_TOP: sourcex = 0; break; case SB_BOTTOM: sourcex = INT_MAX; break; case SB_THUMBTRACK: sourcex= nPos; break; } m_hbar.SetScrollPos(sourcex); InvalidateRect(&rectStaticClient); CDialog::OnHScroll(nSBCode, nPos, pScrollBar); } Now you can scroll your bitmap and the remaining portions of it can be viewed by horizontal and vertical scrolling. Still there exists a problem. The screen will flicker continuously when you scroll the bitmap. Here comes another technique to tackle this problem. The finishing touch to this Project. Nothing but "Double buffer technique for flicker free drawing", which we will adopt. Implementing Flicker free drawing Using Double Buffering techniqueTo eliminate flicker in drawing you need to draw everything on a memory DC, and then copy it to the real DC using BOOL MyDlg::OnEraseBkgnd(CDC* pDC)
{
// TODO: Add your message handler code here and/or call default
if(erase)
return false;
else
return CDialog::OnEraseBkgnd(pDC);
}
Before you call the Reset 'erase' flag to else { CPaintDC dc(this); dc.BitBlt(offsetx,offsety,m_size.cx,m_size.cy, &m_dcMem, sourcex, sourcey,SRCCOPY); erase=false; CDialog::OnPaint(); } I hope that you are now able to draw a bitmap with scrolling capability in your dialog. Go through the demo project and learn more from it. NOTE: This code has been tested on the Windows 2000 platform and it is found to work properly. Your valuable suggestions and corrections are always welcomed. Refer to the MSDN Documentation for more details on 'Double Buffering', ' | ||||||||||||||||||||