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

天云上人

前言：
& \/ G8 q9 k2 M) u
& Y3 ?# T" f2 e1 A/ V) g- |' Q+ F' j　　在图像的编程中，经常会遇到这样一种情况，在有限的区域中显示了一幅大图，这时要浏览图像的各个部分，这就需要用到图像的滚动。关于它的实现，许多书都有提及，但其中的关键点和难点，即拖动中的刷新和闪烁问题，却讲述的不多，这也是我写本文的目的所在，下面我将详细分析实现方法。
6 J- ?6 }, ^$ e- {* U
& |+ Y- R5 z- u+ w& D　　实现效果及实现方法：
5 y: i5 V1 H$ ~" j! b! F+ u+ @
5 d) d0 m' I- G1 F, S6 Y　　在图像区域中按下鼠标左键，可拖动图像在某一有限区域中任意滚动。

) `9 s/ \( J( N- a+ g　　方法为 ：拖动时计算上次与本次的偏移，然后将图像显示的起始点进行变化并刷新图像区域。
. _) m! m3 p' u- V- D* d# Q0 {
1 c2 U* w7 y# i5 j& T' }# x　　实现部分：

2 }7 E8 t8 [0 r1 E/ m; L: f　　第一步：响应WM_LBUTTONDOWN 消息，记录按下开始拖动的起始位置。
5 m! s, g; B# p& ^0 G: k
　　void CWingImgDlg::OnLButtonDown(UINT nFlags, CPoint point)

( X% y  ]0 R" R. B& w$ x' x　　{

　　　// TODO: Add your message handler code here and/or call default

2 c8 ]' i" I0 i9 X" n+ x! a　　　m_lPicOldLeft = point.x;

- J# A) Z9 E) |# [# o　　　m_lPicOldTop = point.y;
1 Y! X. e4 M( T6 p/ B" v
' n( ^. c% I. p% q$ N9 T. I　　　CDialog::OnLButtonDown(nFlags, point);
: B$ y6 _/ c4 m2 S) L
  d* j2 v9 L+ j) X　　}
8 s/ U& H* q* A
　　第二步：响应WM_MOUSEMOVE 消息，实现滚动。

0 ~  o, A" F' b& B" Y　　void CWingImgDlg::OnMouseMove(UINT nFlags, CPoint point)
) d- N' }- e7 ]/ l
　　{

　　　// TODO: Add your message handler code here and/or call default

　　　file://如果鼠标按下

* R4 X% ~& e( W6 A* L' S　　　if( (nFlags & MK_LBUTTON) == MK_LBUTTON )

1 B* @5 i6 n* D7 A1 }6 k　　　{
5 @7 a& F% F1 y( s; y" [" u
　　　　m_lPicNewLeft = point.x;
; r+ J9 D4 _( f- U
　　　　m_lPicNewTop = point.y;
' z" a4 x, \6 Y+ O- e- u/ r& b* }
　　　　DWORD dwLRShift = m_lPicNewLeft - m_lPicOldLeft;

: W6 W* Y. n& x　　　　DWORD dwTBShift = m_lPicNewTop - m_lPicOldTop;
3 f" S6 \( h" h, i
　　　　file://改变图像显示的起始点
3 G; W1 q1 t* s  |# \7 s; r: E
　　　　m_lPicLeft = m_lPicLeft - dwLRShift;
! X9 a3 A, s. Y5 Q$ i! m
　　　　m_lPicTop = m_lPicTop - dwTBShift;

　　　　file://判断边界的语句，省去。
& H2 x% S! x# w& i( x) x! B
. L- Y" ]( n9 y　　　　m_lPicOldLeft = m_lPicNewLeft;
4 A' f2 \- Z, @6 G0 w2 Z
　　　　m_lPicOldTop = m_lPicNewTop;
, {2 I1 R2 V3 K  \# _! ?( b
　　　　file://进行刷新的语句，见第四步。
& G, x6 K4 N6 V8 C/ V7 o5 m( e4 d
　　　}
8 J/ J) i+ ^' h6 E
" j# D' t! m" Z2 \9 |, i3 q8 X! W7 {! X# q　　　CDialog::OnMouseMove(nFlags, point);

. q: }/ H! W2 S1 f3 ^　　}
* r: r( V4 K$ n$ I/ _
　　第三步：在OnPaint中显示,显示的其他部分，如图像的得来等，省去。

& R1 ~  z; |: i4 D6 H3 t+ u　　void CWingImgDlg::OnPaint()

) h) d7 n. R- ^" R+ W　　　{
+ s" O" u- o( G/ B# p4 C' W
　　　　CPaintDC dc(this); // device context for painting
" t* m8 u" p) r, v4 V6 \' u
8 ]$ c, G3 Z) D" c0 }, C# g" i　　　　file://其他的显示内容，省去。
* O; S6 f; z) ^
! h2 `6 h: f* @: H　　　　if(m_pImgInfo != NULL)

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

% L+ B. }$ _$ @) M0 S　　　　　m_lPicLeft,m_lPicTop,SRCCOPY);

　　　　　CDialog::OnPaint();
3 V; a- V- q1 `2 a% ]
　　　　}
　　第四步：刷新处理。

　　　最常想到的方法，当然是使用Invalidate(TRUE)；//刷新整个无效区
0 k5 `5 |! z% F) w% y) X& G
　　　UpdateWindow()；
! [* p8 L2 C3 p7 g$ s
　　　这时，会刷新整个程序区域的无效区，闪烁非常严重，改正如下：
3 ]# g( W! G, X, T  K& i6 t  v
/ P( C' V& a* F　　　　InvalidateRect(&m_rtPic,TRUE); file://仅刷新图像显示区域
+ x! N" t0 O' G& H' a; d5 }
" j  {/ u8 x2 S0 j3 ?) f7 L( e　　　　UpdateWindow();

　　　此时，仅会刷新图像所在区域，闪烁有所缓解，再进一步，可使用
+ A  L* E  U7 C6 [" x9 o2 ]) D
/ m/ H+ `- v6 ^- B5 n# U% a　　　　InvalidateRect(&m_rtPic,TRUE); file://使用快速重画
6 r0 z! u6 t9 o, p: _5 n
' s! d) {9 H) q0 p　　　　ReDrawWindow(&m_rtPic,NULL,RDW_INTERNALPAINT| RDW_INVALIDATE | RDW_UPDATENOW | RDW_ERASE);
# n( J3 V1 W5 ^; P4 V; E
: v, h. I! o  o进行处理，此时闪烁更进一步减小，考虑到，其他部分可能影响刷新区域，干脆将OnPaint()直接使用在此处，即变为：

+ H6 Q! P; g% ]6 B+ H　　OnPaint();
0 j; A8 ^. r& y3 v! i: x7 T
　　但如果在OnPaint()中有大量的绘图语句，这种方法仍旧不可行，考虑到不能激发OnPaint（）这一因素及控制刷新范围，我采用了如下非标准的方法解决，代码如下：
2 o; c9 j4 b+ W1 Y1 \- A) ?
　　CDC *pDC;

2 W4 T+ x; p  w0 a6 e4 y　　pDC = GetDC();

& g( J0 Z' A5 [5 z　　if(m_pImgInfo != NULL)

# Z& W6 [. H8 B　　　pDC->BitBlt(m_wShowLeft,m_wShowTop,m_lWidth,m_lHeight,&m_AdjDC,m_lPicLeft,m_lPicTop,SRCCOPY);
3 T# R8 b1 F; [
4 C' y& L. |( @; J　　　ReleaseDC(pDC);
- {' I  _/ o. O1 D0 O
2 M2 o, @0 N; f8 G  @+ L7 b　　这种方法很好地解决了刷新闪烁的问题，图像拖动时很平稳且无闪烁。
4 E9 C: h  t( G
" b! P; Q' F0 g% K6 }　　这是我在实践中遇到的一个问题，写出来，与大家共享。如果有问题，或者有更好的建议和做法，欢迎和我联系探讨，如需要整个程序的源文件，请Mail联系（DavidZheng@Acercm.com.cn）。