VB.net基础:简单的自定义控件MyPictureBox
2024-07-10 13:01:04
供稿：网友
先说明一下，有的代码行比较长所以不容易看清。建议先粘贴到vs.net中，这样好看一点。
这里标题中的“简单”，并不是说代码简单，而是说思路比较简单。vs.net中的picturebox有个缺点就是不好控制位置和大小。所以mypicturebox就是这样一种picturebox：它有一个属性viewmode，表示显示图片的模式，包括fitsize，truesize和stretchimage。后两者看名字也看得出意思来，fitsize则是一个折中的方式：当图片大小小于mypicturebox大小的时候，不进行图片缩放。还有，mypicturebox自动将图片放到中间，当其大小改变的时候也能保持图片在mypicturebox的中间。另外，当图片大小大于mypicturebox大小的时候，用户能够像photoshop的手形工具那样“拖动”图片以方便浏览。总之，我们的mypicturebox就这三大特点。
首先，以“windows控件库”建立一个新工程，将一个picturebox拖到用户控件上。界面就ok了。
然后我们要定义viewmode。先建立一个enum:
public enum vmode
fitsize = 0
stretchimage = 1
truesize = 2
end enum
然后建立一个变量存放viewmode属性：
private vviewmode as vmode = vmode.truesize
当viewmode变化的时候，控件有必要向外界发出一个事件：
public event viewmodechanged(byval mode as vmode)
现在可以写viewmode属性了：
public property viewmode() as vmode
get
return vviewmode
end get
set(byval value as vmode)
dim changed as boolean = false
if value <> vviewmode then changed = true
vviewmode = value
if changed then showpic()
raiseevent viewmodechanged(value)
end set
end property
这里，showpic()是尚未定义的方法，作用就是显示图片。
另外，既然是mypicturebox，那就要有picturebox的样。所以要加上一个image属性：
public property image() as image
get
return picturebox1.image
end get
set(byval value as image)
if value is nothing then '判断一下value是不是空值。
picturebox1.borderstyle = borderstyle.none
exit property
else
picturebox1.borderstyle = borderstyle.fixedsingle
end if
value = new bitmap(value)
picturebox1.sizemode = pictureboxsizemode.stretchimage
picturebox1.image = value
imagerate = value.width / value.height
showpic()
end set
end property
这里imagerate是为了避免重复计算的开销的定义的一个变量，用来存储图像的宽高比，类型是single。可以在前面加上它的定义。
现在我们来写showpic。为了代码结构分明，showpic内容很简单：
private sub showpic()
if picturebox1.image is nothing then exit sub
if picturebox1.visible = false then picturebox1.visible = true
resizeimage()
end sub
之所以要把resizeimage单独写开来是因为这部分还有其他地方要重用。resizeimage的作用是根据当前的viewmode值，来改变picturebox1的sizemode属性，并决定是否对图片进行缩放：
private sub resizeimage()
if picturebox1.image is nothing then exit sub
if vviewmode = vmode.fitsize then
if picturebox1.image.width > me.width or picturebox1.image.height > me.height then
stretchimage()
else
if not picturebox1.sizemode = pictureboxsizemode.autosize then picturebox1.sizemode = pictureboxsizemode.autosize
end if
elseif vviewmode = vmode.stretchimage then
stretchimage()
else
if not picturebox1.sizemode = pictureboxsizemode.autosize then picturebox1.sizemode = pictureboxsizemode.autosize
end if
locateimage()
end sub
这一段判断有些复杂，其实应该可以写得更好一点的。stretchimage和locateimage的作用从名字上大概就能看出来了。先看看stretchimage。它是真正缩放图片的方法。其实也不复杂：
private sub stretchimage()
picturebox1.sizemode = pictureboxsizemode.stretchimage
if merate < imagerate then
picturebox1.width = me.width
picturebox1.height = picturebox1.width / imagerate
else
picturebox1.height = me.height
picturebox1.width = picturebox1.height * imagerate
end if
end sub
这里merate用来保存mypicturebox本身的宽高比。类型是single，现在可以在前面加上它的定义。显然，strechimage实际上就是改变picturebox1的宽高。计算好图片框的大小之后，要保持图片在中间，需要计算图片框的位置。locateimage就是作这个用的：
private sub locateimage()
if picturebox1.width < me.width then
picturebox1.left = (me.width - picturebox1.width) / 2
else
picturebox1.left = 0
end if
if picturebox1.height < me.height then
picturebox1.top = (me.height - picturebox1.height) / 2
else
picturebox1.top = 0
end if
end sub
当mypicturebox大小改变的时候，图片的大小和位置就要重新计算。没错，应该写在resize事件里面。不过且慢。如果不加控制的话，在用户拖动改变mypicturebox大小的过程中，因为不停的计算图片的大小和位置，cpu的占用率会达到100%。这是很不友好的，甚至可以用“霸道”来形容。也许我们应该开一个线程，在线程当中用sleep来避免这种情况。但是这写起来又太复杂了点。所以我们用timer这种折中的办法。回到设计器视图，拖过来一个timer。设置interval值为25。在timer1_tick当中写上：
private sub timer1_tick(byval sender as system.object, byval e as system.eventargs) handles timer1.tick
if vviewmode = vmode.stretchimage or vviewmode = vmode.fitsize then
resizeimage()
else
locateimage()
end if
timer1.stop()
end sub
然后再在resize事件中写上：
private sub mypicturebox_resize(byval sender as object, byval e as system.eventargs) handles mybase.resize
merate = me.width / me.height
timer1.start()
end sub
这样的组合就能达到目标了。
然后我们再写“拖动”图片的功能。显然，这个功能只有当viewmode=truesize的时候才有用。这个功能分三部分，首先是mousedown事件：
private sub picturebox1_mousedown(byval sender as object, byval e as system.windows.forms.mouseeventargs) handles picturebox1.mousedown
if e.button <> mousebuttons.left or viewmode <> vmode.truesize then exit sub
moving = true
me.cursor = system.windows.forms.cursors.hand
mousepos = me.mouseposition
oldscroll = me.autoscrollposition
end sub
这里moving变量用来表示用户是否正在拖动图片，类型是boolean。没定义？到前面去定义一下不就行了。还有什么mousepos，oldscroll，它们俩的类型是point。快去定义一下。当用用户按下鼠标左键的时候，记录下鼠标位置和图片当的前滚动位置。
然后是mousemove事件：
等等。在用户移动鼠标的时候，又要不停的计算图片框的滚动位置。为了避免再次“霸道”起来，我们又要拖进来一个timer。设置interval值为1。这个timer是这样的：
private sub timer2_tick(byval sender as system.object, byval e as system.eventargs) handles timer2.tick
mouseposnow = me.mouseposition
dim deltapos as point = new point((mousepos.x - mouseposnow.x), (mousepos.y - mouseposnow.y))
me.autoscrollposition = new point(-oldscroll.x + deltapos.x, -oldscroll.y + deltapos.y)
timer2.stop()
end sub
就四句话，应该不太难看懂吧。
所以mousemove就这样：
private sub picturebox1_mousemove(byval sender as object, byval e as system.windows.forms.mouseeventargs) handles picturebox1.mousemove
if moving then
timer2.start()
end if
end sub
第三部分就是mouseup事件了，就两句话：
private sub picturebox1_mouseup(byval sender as object, byval e as system.windows.forms.mouseeventargs) handles picturebox1.mouseup
moving = false
me.cursor = system.windows.forms.cursors.default
end sub
这样，mypicturebox就写好了。
……没错，是写好了。运行一下看看。
