smithvoice.com
 Y'herd thisun? 

“The main requirement is for commerce to replace politics as the driving force behind space policy”

from Spaceflight Revolution by David Ashford

Your own image control and App part 21

TaggedCoding, MediaData, Imaging

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


jump to:

  • 1) The spec
  • 2) Setting up the workspace
  • 3) Feature 1: Loading an image
  • 4) Custom Exceptions
  • 5) "Fax images" and Multipage TIFFs
  • 6) Custom events
  • 7) Selecting specific fax pages
  • 8) Feature 2: Rotating image displays
  • 9) The most useful tool in GDI+: DrawImage
  • 10) Feature 3: Zooming
  • 11) Handling the unhandleable exception
  • 12) Fixing the squish
  • 13) Zooming to fit the control
  • 14) You're already beating the Pros
  • 15) Feature 4: Cropping
  • 16) Bonus Feature: StickyMouse
  • 17a) Final Cleanup
  • 17b) Passing the current display image
  • 18) Making the application
  • 19) Source and result viewports
  • 20) A better toolbar
  • 21) Hooking the toolbar to the project
  • 22) Adding ImageEditors
  • 23) The toolbar ZoomCombo
  • 24) The final solution
  • 25) Saving to image files
  • 26) An integer-only textbox
  • 27) Passing save options between forms
  • 28) Dealing with that last exception
  • 29) Offer more options with menus
  • 30 The downloads and ebook


  • home     who is smith    contact smith     rss feed π
    Since 1997 a place for my stuff, and it if helps you too then all the better smithvoice.com