dede手机网站更新商场设计调研

       当使用基于对话框的MFC项目窗口显示图像时，如窗口的尺寸小于图像的尺寸，在不做缩放的情况下按照原图尺寸在窗口显示，那么只能看到图像的局部，这时我们希望可以通过鼠标移动图像进而显示其它部分。今天就进行这个实验，编译环境是VS2022。
       思路：显示图像的过程就是将图像的某一部分复制到屏幕的过程。若是在鼠标左键按下、抬起及鼠标移动的消息处理函数中，通过获得图像的某一部分并发送到屏幕上，则可达到上述目的。
       具体步骤如下：
一、建立一个基于对话框的MFC项目（具体步骤略）
       项目名称：showPicTest，其余均按缺省设置，具体步骤略。
       进入对话框界面，将自动生成的控件全部删除。
二、在桌面上放一张jpg图片，我这里使用的是：C:\Users\Administrator\Desktop\2222.jpg。
三、在showPicTestDlg.h中，以public方式声明声明一些变量，其名称及功能见下面的代码及注释：

	CImage img; //用于载入要显示的图片文件CImage对象BOOL isFirst = 1; //显示标志 1--图像第一次显示 0--其它情况int startX, startY; //鼠标左键按下时的位置int imgWidth, imgHeight; //原始图像（会载入到img中）的宽、高int totalDisX = 0, totalDisY = 0; //鼠标多次拖动的位移值int DCwidth, DCheight;//客户区宽度

四、在CshowPicTestDlg::OnInitDialog()函数TODO：行下面添加一些代码，这些代码的作用是载入图片文件，获得图像的宽高；同事获得客户区的宽高，我们将以客户区的大小为标准获取图像某一部分发送给屏幕，如此图像不会被拉伸变形。具体代码如下：

	// TODO: 在此添加额外的初始化代码img.Load(L"C:\\Users\\Administrator\\Desktop\\2222.jpg"); //载入图像文件imgWidth =img.GetWidth();// 返回当前图像的宽度（以像素为单位）imgHeight = img.GetHeight();// 返回当前图像的高度CRect DCrect; //矩形对象（用于接收对话框客户区数据）GetClientRect(DCrect); //获得窗口客户区坐标、宽高等数据DCwidth = DCrect.Width();//客户区宽度DCheight = DCrect.Height();//客户区高度

五、打开对话框界面，右键对话框->单击属性框中的消息按钮->选择WM_MOSEMOVE消息->单击后边add，这样在showPicTestDlg.cpp中会添加CshowPicTestDlg::OnMouseMove函数，在这个函数的TODO：行下面添加一些代码，这些代码的作用是在鼠标第一次移动时，立即将图像显示在窗口上，这些代码只执行一次。

    if (isFirst == 1) {CDC* pDC; //声明设备上下文指针pDC = GetDC(); //获得当前设备上下文指针（指屏幕）img.Draw(pDC->m_hDC, 0, 0); //显示图片，pDC->m_hDC通过指针获得对象pDC->DeleteDC(); //清理设备上下文指针isFirst = 0; //仅执行一次} 

六、按照第五步的做法，给鼠标左键按下WB_LBUTTONDOWN消息添加处理函数CshowPicTestDlg::OnLButtonDown()，在这个函数中添加代码，目的是获得鼠标按下时的位置坐标。添加的代码具体如下：

	startX = point.x; //鼠标左键按下时x坐标startY = point.y; //鼠标左键按下时y坐标

七、还是按照第五步的做法，给鼠标左键抬起WB_LBUTTONUP消息添加处理函数CshowPicTestDlg::OnLButtonUp()，接着在这个函数的TODO：行下面添加代码，这些代码的作用是通过计算历次鼠标按下后至抬起所产生的总位移（由于移动有方向所以是位移二不是距离），来判断显示图像的哪一部分。添加的代码如下：

   //计算鼠标本次按下至抬起的x、y方向位移int moveDisX =  startX-point.x; int moveDisY =  startY-point.y;//限制每次的位移量最大步超过150个像素if (moveDisX > 150)moveDisX = 150; if (moveDisX < -150)moveDisX = -150;if (moveDisY > 150)moveDisY = 150;if (moveDisY <- 150)moveDisY = -150;//计算合计位移量totalDisX = totalDisX +moveDisX; totalDisY = totalDisY + moveDisY;//限制合计位移量不得超出图像大小范围if (totalDisX > imgWidth-DCwidth)totalDisX = imgWidth-DCwidth;if (totalDisY > imgHeight-DCheight)totalDisY = imgHeight-DCheight;if (totalDisX < 0)totalDisX = 0;if (totalDisY < 0)totalDisY = 0;if (isFirst == 0) {CDC* pDC; //声明设备上下文指针pDC = GetDC(); //获得当前设备上下文指针img.Draw(pDC->m_hDC, 0, 0, DCwidth, DCheight, totalDisX, totalDisY, DCwidth, DCheight);//pDC->m_hDC通过设备上下文指针的到设备上下文对象名//参1至参5 窗口左上角坐标及窗口宽高//参6至参9 欲显示的部分图像起始坐标及宽高pDC->DeleteDC();//清理设备上下文}

八、至此，实验的编程部分到此结束。试运行，无论鼠标按下后向水平、垂直、斜向运动一小段距离后抬起，显示图片都会发生相应的移动，实验目的基本上能达成。存在的问题是操作速度不能太快，快了图片可能向相反方向运动，另外移动不是连续的。
       应该有更好的算法能解决这些问题，请高手朋友赐教！

   附：运行效果截图
    1.开始显示的图像左上角部分

     2.移动后显示图像的中间部分