Originally published December 2002 on DoItIn.net using VB7.0/2002. Updated for VB7.1 February 2005
Links for compiled demo versions, all required resources and source code are included at the end of this article.
Plus, get the complete eBook in Adobe Acrobat 7 format ... all here.
21) Hooking the toolbar to the project
There's no helpful wizard for adding controls to the svToolbar but then again that the wizard wasn't all that much help in the real toolbar. To add controls we have to use code and its boilerplate so copy and pasting gets it done fast.
First, select the pnlSource panel, the one nicely docked to the left of the form, and drag an instance of the svToolbar to it. With the svToolbar selected, go to the property sheet and change its name to "tbrSource", set its Dock to Top and its Height to something that will give a 16x16-iconed button a little wiggleroom beyond its borders, I've set my toolbar height to 28.
Add another svToolbar to the right hand "pnlResult", set its Name to "tbrResult", Dock to "Top" and height the same as the first one.
Before we add buttons, we'll need some pictures for Open, Delete/Clear, PageUp, PageDown, ZoomMinus, ZoomPlus, SizeToFit, MouseCrop, MouseSticky and Save. We'll also need to give Rotation options and while we do allow a whole lot of them in our svImageEditor the app's toolbar can be kept easy by just showing the ones that will be used most (Rotate90CounterClock and Rotate90Clockwise), and we'll put the less likely options in Menuitems. Remember, with two viewports on the control, we need to get the most out of our toolbar space
If you're an artist or have one near you then make your own 16x16 button images. I've used some of the freebie Visual Studio bitmaps that haven't been updated since VB4 and used my limited talent to make the rest in Paint. You can use mine, they're all in this zip.
Add an ImageList to the form, name it "ilToolbars" and in its property sheet Size to "16, 16" and TransparentColor to "Silver" (or whatever you've used as a common background color for your bitmaps). Now click on the "Images (Collection)" and use the wizard to add the bitmaps.
Now we're ready to code - ok, you're ready to cut & paste. Switch to codeview on the form and add three regions: "Form Methods", "Source Editor Methods" and "Result Editor Methods". Click in the source region and enter this (setting the imagelist indexes to match your images, I've used a private enum to make mine easier to remember).
#Region "Source Editor Methods"
Private Sub AddSourceToolbarButtons()
Dim ctl As Control
With tbrSource
'spacers are just labels
ctl = New Label
ctl.Width = 6
CType(ctl, Label).BorderStyle = BorderStyle.None
.Controls.Add(ctl)
ctl = New Button
ctl.Name = "butLoad"
ctl.Text = "load new picture"
ctl.Width = 23
CType(ctl, Button).FlatStyle = FlatStyle.Popup
CType(ctl, Button).ImageList = ilToolbars
CType(ctl, Button).ImageIndex = ToolbarIconIndexes.Load
.Controls.Add(ctl)
ctl = New Button
ctl.Name = "butClear"
ctl.Text = "clear picture"
ctl.Width = 23
CType(ctl, Button).FlatStyle = FlatStyle.Popup
CType(ctl, Button).ImageList = ilToolbars
CType(ctl, Button).ImageIndex = ToolbarIconIndexes.Clear
.Controls.Add(ctl)
'Page UP/Down buttons, defaulted to not visible
'spacers are just labels
ctl = New Label
ctl.Name = "lblPageSpacer"
ctl.Width = 6
'default to hidden
ctl.Visible = False
CType(ctl, Label).BorderStyle = BorderStyle.None
.Controls.Add(ctl)
ctl = New Button
ctl.Name = "butPageDown"
ctl.Text = "previous page"
ctl.Width = 23
'default to hidden
ctl.Visible = False
CType(ctl, Button).FlatStyle = FlatStyle.Popup
CType(ctl, Button).ImageList = ilToolbars
CType(ctl, Button).ImageIndex = ToolbarIconIndexes.PageDown
.Controls.Add(ctl)
ctl = New Label
ctl.Name = "lblPageNumber"
ctl.Width = 23
ctl.Text = "0"
'default to hidden
ctl.Visible = False
CType(ctl, Label).BorderStyle = BorderStyle.FixedSingle
CType(ctl, Label).TextAlign = ContentAlignment.MiddleCenter
CType(ctl, Label).Font = New Font("Tahoma", 8)
CType(ctl, Label).BackColor = Color.FromName("ControlLightLight")
.Controls.Add(ctl)
ctl = New Button
ctl.Name = "butPageUp"
ctl.Text = "next page"
ctl.Width = 23
'default to hidden
ctl.Visible = False
CType(ctl, Button).FlatStyle = FlatStyle.Popup
CType(ctl, Button).ImageList = ilToolbars
CType(ctl, Button).ImageIndex = ToolbarIconIndexes.PageUp
.Controls.Add(ctl)
'end Pageup/down
'spacers are just labels
ctl = New Label
ctl.Width = 6
CType(ctl, Label).BorderStyle = BorderStyle.None
.Controls.Add(ctl)
ctl = New Button
ctl.Name = "butRotateCounterclock"
ctl.Text = "rotate counter clockwise"
ctl.Width = 23
CType(ctl, Button).FlatStyle = FlatStyle.Popup
CType(ctl, Button).ImageList = ilToolbars
CType(ctl, Button).ImageIndex = ToolbarIconIndexes.RotateCounter
.Controls.Add(ctl)
ctl = New Button
ctl.Name = "butRotateClock"
ctl.Text = "rotate clockwise"
ctl.Width = 23
CType(ctl, Button).FlatStyle = FlatStyle.Popup
CType(ctl, Button).ImageList = ilToolbars
CType(ctl, Button).ImageIndex = ToolbarIconIndexes.RotateClock
.Controls.Add(ctl)
'spacers are just labels
ctl = New Label
ctl.Width = 6
CType(ctl, Label).BorderStyle = BorderStyle.None
.Controls.Add(ctl)
ctl = New Button
ctl.Name = "butZoomMinus"
ctl.Text = "zoom out"
ctl.Width = 23
CType(ctl, Button).FlatStyle = FlatStyle.Popup
CType(ctl, Button).ImageList = ilToolbars
CType(ctl, Button).ImageIndex = ToolbarIconIndexes.ZoomMinus
.Controls.Add(ctl)
ctl = New Button
ctl.Name = "butZoomPlus"
ctl.Text = "zoom in"
ctl.Width = 23
CType(ctl, Button).FlatStyle = FlatStyle.Popup
CType(ctl, Button).ImageList = ilToolbars
CType(ctl, Button).ImageIndex = ToolbarIconIndexes.ZoomPlus
.Controls.Add(ctl)
ctl = New Button
ctl.Name = "butZoomFit"
ctl.Text = "zoom to fit"
ctl.Width = 23
CType(ctl, Button).FlatStyle = FlatStyle.Popup
CType(ctl, Button).ImageList = ilToolbars
CType(ctl, Button).ImageIndex = ToolbarIconIndexes.ZoomtoFit
.Controls.Add(ctl)
'spacers are just labels
ctl = New Label
ctl.Width = 6
CType(ctl, Label).BorderStyle = BorderStyle.None
.Controls.Add(ctl)
ctl = New RadioButton
ctl.Name = "butMouseSticky"
ctl.Text = "mouse drag mode"
ctl.Width = 23
'this is the default mousemode
CType(ctl, RadioButton).Checked = True
CType(ctl, RadioButton).Appearance = Appearance.Button
CType(ctl, RadioButton).FlatStyle = FlatStyle.Popup
CType(ctl, RadioButton).ImageList = ilToolbars
CType(ctl, RadioButton).ImageIndex = ToolbarIconIndexes.MouseSticky
.Controls.Add(ctl)
ctl = New RadioButton
ctl.Name = "butMouseCrop"
ctl.Text = "mouse crop mode"
ctl.Width = 23
CType(ctl, RadioButton).Checked = False
CType(ctl, RadioButton).Appearance = Appearance.Button
CType(ctl, RadioButton).FlatStyle = FlatStyle.Popup
CType(ctl, RadioButton).ImageList = ilToolbars
CType(ctl, RadioButton).ImageIndex = ToolbarIconIndexes.MouseCrop
.Controls.Add(ctl)
'Users may want to save out single pages of tiffs
'or source simply rotated without cropping
'so provide a save for the Source editor
'spacers are just labels
ctl = New Label
ctl.Width = 6
CType(ctl, Label).BorderStyle = BorderStyle.None
.Controls.Add(ctl)
ctl = New Button
ctl.Name = "butSave"
ctl.Text = "save to jpeg file"
ctl.Width = 23
CType(ctl, Button).FlatStyle = FlatStyle.Popup
CType(ctl, Button).ImageList = ilToolbars
CType(ctl, Button).ImageIndex = ToolbarIconIndexes.Save
.Controls.Add(ctl)
End With
End Sub
Now call that routine in the Form_Load (copy the Form_Load to the Form Methods region). Rebuild and save then F5 to test.
Not bad.
Add the related code to the Result region, the result viewport doesn't need all of the options so it's a little shorter:
Private Sub AddResultToolbarButtons()
Dim ctl As Control
With tbrResult
'spacers are just labels
ctl = New Label
ctl.Width = 6
CType(ctl, Label).BorderStyle = BorderStyle.None
.Controls.Add(ctl)
ctl = New Button
ctl.Name = "butRotateCounterclock"
ctl.Text = "rotate counter clockwise"
ctl.Width = 23
CType(ctl, Button).FlatStyle = FlatStyle.Popup
CType(ctl, Button).ImageList = ilToolbars
CType(ctl, Button).ImageIndex = ToolbarIconIndexes.RotateCounter
.Controls.Add(ctl)
ctl = New Button
ctl.Name = "butRotateClock"
ctl.Text = "rotate clockwise"
ctl.Width = 23
CType(ctl, Button).FlatStyle = FlatStyle.Popup
CType(ctl, Button).ImageList = ilToolbars
CType(ctl, Button).ImageIndex = ToolbarIconIndexes.RotateClock
.Controls.Add(ctl)
'spacers are just labels
ctl = New Label
ctl.Width = 6
CType(ctl, Label).BorderStyle = BorderStyle.None
.Controls.Add(ctl)
ctl = New Button
ctl.Name = "butZoomMinus"
ctl.Text = "zoom out"
ctl.Width = 23
CType(ctl, Button).FlatStyle = FlatStyle.Popup
CType(ctl, Button).ImageList = ilToolbars
CType(ctl, Button).ImageIndex = ToolbarIconIndexes.ZoomMinus
.Controls.Add(ctl)
ctl = New Button
ctl.Name = "butZoomPlus"
ctl.Text = "zoom in"
ctl.Height = 16
ctl.Width = 23
CType(ctl, Button).FlatStyle = FlatStyle.Popup
CType(ctl, Button).ImageList = ilToolbars
CType(ctl, Button).ImageIndex = ToolbarIconIndexes.ZoomPlus
.Controls.Add(ctl)
ctl = New Button
ctl.Name = "butZoomFit"
ctl.Text = "zoom to fit"
ctl.Height = 16
ctl.Width = 23
CType(ctl, Button).FlatStyle = FlatStyle.Popup
CType(ctl, Button).ImageList = ilToolbars
CType(ctl, Button).ImageIndex = ToolbarIconIndexes.ZoomtoFit
.Controls.Add(ctl)
'spacers are just labels
ctl = New Label
ctl.Width = 6
CType(ctl, Label).BorderStyle = BorderStyle.None
.Controls.Add(ctl)
ctl = New Button
ctl.Name = "butSave"
ctl.Text = "save result to file"
ctl.Width = 23
CType(ctl, Button).FlatStyle = FlatStyle.Popup
CType(ctl, Button).ImageList = ilToolbars
CType(ctl, Button).ImageIndex = ToolbarIconIndexes.Save
.Controls.Add(ctl)
End With
End Sub
And add AddResultToolbarButtons() to the Form_Load too. Rebuild, Save and F5.
Unlike the Windows Picture and Fax Viewer we want our app to set its options to match the current images (or lack thereof). We've already accomplished some of this by setting the up and down buttons to invisible when they're first loaded into the toolbar and the rest will be done dynamically off of the svImageEditor events so it's time to add that control.
Next: Adding svImageEditors
Robert Smith
Kirkland, WA
added to smithvoice march 2005