图像平滑滚动效果的VC实现

天云上人

前言：
2 S2 r0 q! a9 X  G8 T0 u1 S9 u5 j
+ j2 }. n, E6 A' ^6 U0 B, P　　在图像的编程中，经常会遇到这样一种情况，在有限的区域中显示了一幅大图，这时要浏览图像的各个部分，这就需要用到图像的滚动。关于它的实现，许多书都有提及，但其中的关键点和难点，即拖动中的刷新和闪烁问题，却讲述的不多，这也是我写本文的目的所在，下面我将详细分析实现方法。

　　实现效果及实现方法：

　　在图像区域中按下鼠标左键，可拖动图像在某一有限区域中任意滚动。

: w% R. C# A" Q) s* e9 K7 _　　方法为 ：拖动时计算上次与本次的偏移，然后将图像显示的起始点进行变化并刷新图像区域。
+ X1 ?: m* I$ u0 F
0 W4 ^  d3 `1 @2 P2 b% W( |$ V: S$ F0 @　　实现部分：

, Q( M! o$ U+ U- {; Z" T! t% p0 K　　第一步：响应WM_LBUTTONDOWN 消息，记录按下开始拖动的起始位置。

　　void CWingImgDlg::OnLButtonDown(UINT nFlags, CPoint point)

4 K- y7 ^9 e# {( d  Y　　{

0 n* q9 Z6 c5 p6 h　　　// TODO: Add your message handler code here and/or call default
4 s$ n. z" O  s" @
　　　m_lPicOldLeft = point.x;
& {1 C- @6 g* Z2 H5 P
" L; A, [5 I, `) r　　　m_lPicOldTop = point.y;

7 H/ @$ Z" q/ j# e9 x: [* C" X　　　CDialog::OnLButtonDown(nFlags, point);
9 P. p& u) n, Z: ~
" i' }' R$ z! n* a! j7 \! d0 K: @　　}

　　第二步：响应WM_MOUSEMOVE 消息，实现滚动。

& R7 D4 k0 a% s( e, B　　void CWingImgDlg::OnMouseMove(UINT nFlags, CPoint point)

　　{
5 T+ c6 w: \6 N+ N
　　　// TODO: Add your message handler code here and/or call default

　　　file://如果鼠标按下

9 u/ H/ ]$ L7 R3 h0 S/ v7 s4 o3 h　　　if( (nFlags & MK_LBUTTON) == MK_LBUTTON )
1 B$ U' {4 l0 B% q( l& R
! x# g; \9 Z+ K' ^' Z& m2 O& j! s& W　　　{
7 W* l1 A4 H% T! o
　　　　m_lPicNewLeft = point.x;

+ ]# e& E9 Z& j* I; V0 z　　　　m_lPicNewTop = point.y;

　　　　DWORD dwLRShift = m_lPicNewLeft - m_lPicOldLeft;
2 K$ b& @$ }# v8 R0 l2 E$ O1 I
　　　　DWORD dwTBShift = m_lPicNewTop - m_lPicOldTop;
9 A6 F2 z2 L6 a6 `: Q
, j+ ?1 Q, }) w6 y9 _# h& [　　　　file://改变图像显示的起始点
, E% E; k0 L" w% r9 m2 o4 \  ?# l  z8 H
( h2 V& U- k9 k# m6 J( G, ~　　　　m_lPicLeft = m_lPicLeft - dwLRShift;

　　　　m_lPicTop = m_lPicTop - dwTBShift;
- T' ]& R& R! a! x6 c
* I% O, t$ O. S　　　　file://判断边界的语句，省去。
! R) h; a$ `1 @/ }' e9 y
6 a+ ^, |5 @* R% q. ~3 T; o4 k　　　　m_lPicOldLeft = m_lPicNewLeft;

　　　　m_lPicOldTop = m_lPicNewTop;
* Y, \5 Q3 y, ]0 R
　　　　file://进行刷新的语句，见第四步。
8 {/ W5 ^  p8 x
8 e) C2 R( N% ~( o　　　}
% c1 U. a( N! ?! s, W9 L+ }
+ h" t/ y- }7 E1 d　　　CDialog::OnMouseMove(nFlags, point);

　　}
6 Z: j( Y8 e% h  I
　　第三步：在OnPaint中显示,显示的其他部分，如图像的得来等，省去。

　　void CWingImgDlg::OnPaint()
% e1 J7 p6 \- c8 p* n% q
& g" U  Y! c: n2 o$ {　　　{
: L% T. g6 w  q) _* o% M( g
* O: a; a4 N4 z& J　　　　CPaintDC dc(this); // device context for painting
; F6 q3 A& j$ V% d- |9 A+ z
2 y$ X  K9 ]( f- t　　　　file://其他的显示内容，省去。
  }$ E, h" F* V: R5 M
- q8 Z5 T+ i" T5 B9 H　　　　if(m_pImgInfo != NULL)

　　　　　dc.BitBlt(m_wShowAdjLeft,m_wShowAdjTop,m_lWidth,m_lHeight,&m_AdjDC,

　　　　　m_lPicLeft,m_lPicTop,SRCCOPY);
1 L2 Q* Z) B& q
* Q' U3 Y3 _5 ^& Z. |0 r( v　　　　　CDialog::OnPaint();
9 y" ~/ i' y" j) b9 G, S. P8 F
　　　　}
# y" M" i; }7 a7 q* w1 q　　第四步：刷新处理。
/ ]0 b( ~! O4 n2 V
& N+ }% ?3 |# H5 b1 r　　　最常想到的方法，当然是使用Invalidate(TRUE)；//刷新整个无效区
9 a! b" u& L1 k8 I
　　　UpdateWindow()；

8 \9 J1 _* ^) P" [% d6 T4 d　　　这时，会刷新整个程序区域的无效区，闪烁非常严重，改正如下：
5 ?# t- ]' C3 c1 x+ k3 K* ^  {
　　　　InvalidateRect(&m_rtPic,TRUE); file://仅刷新图像显示区域
7 V5 c3 w) a" M6 k  L1 b
　　　　UpdateWindow();
3 B- ~3 s' n7 o2 B4 \7 }1 g! `
　　　此时，仅会刷新图像所在区域，闪烁有所缓解，再进一步，可使用

　　　　InvalidateRect(&m_rtPic,TRUE); file://使用快速重画

" h8 A) U% F/ b5 T8 G! X: P8 L3 v5 r　　　　ReDrawWindow(&m_rtPic,NULL,RDW_INTERNALPAINT| RDW_INVALIDATE | RDW_UPDATENOW | RDW_ERASE);

进行处理，此时闪烁更进一步减小，考虑到，其他部分可能影响刷新区域，干脆将OnPaint()直接使用在此处，即变为：

　　OnPaint();
* I3 @3 g. T' O% h# y
( W' p, T! W! l( I1 N& o+ O$ O　　但如果在OnPaint()中有大量的绘图语句，这种方法仍旧不可行，考虑到不能激发OnPaint（）这一因素及控制刷新范围，我采用了如下非标准的方法解决，代码如下：

7 B9 Z/ L/ v/ w8 U　　CDC *pDC;
5 J8 E2 w9 M. t; d/ e" H+ ^
　　pDC = GetDC();
/ m, k1 _6 T% q+ X
- E/ D2 w+ G* A/ D　　if(m_pImgInfo != NULL)
" @! a  S; Y, O7 p& X3 g
& w. Y7 E& @9 ~" v6 k4 l. j　　　pDC->BitBlt(m_wShowLeft,m_wShowTop,m_lWidth,m_lHeight,&m_AdjDC,m_lPicLeft,m_lPicTop,SRCCOPY);
' Q, L3 h5 Z2 Q3 m5 D
　　　ReleaseDC(pDC);

7 q2 A, w+ k" L) V0 A6 m( U5 _　　这种方法很好地解决了刷新闪烁的问题，图像拖动时很平稳且无闪烁。
  L. P6 O  L( c: c
, }3 p- j7 i. t- i6 t+ Z　　这是我在实践中遇到的一个问题，写出来，与大家共享。如果有问题，或者有更好的建议和做法，欢迎和我联系探讨，如需要整个程序的源文件，请Mail联系（DavidZheng@Acercm.com.cn）。