Issues with adding custom control to winforms tabcontrol

Question

I am having trouble adding a custom zoom-able an pan-able picture box control to a tabcontrol.tabpage dynamically at runtime. I have tried a lot and was wondering if any of you smart fellas might have some advice for a poor noob like myself... here is some code...

using Microsoft.VisualBasic;
using System;
using System.Collections;
using System.Collections.Generic;
using System.Data;
using System.Diagnostics;
using System.ComponentModel;
using System.Drawing;
using System.Drawing.Drawing2D;
using System.Windows.Forms;
namespace TAQTv4
{
    public class ZoomPanPicBox : ScrollableControl
    {
        private Image _image;
        //Double buffer the control
        public ZoomPanPicBox()
        {
            this.SetStyle(ControlStyles.AllPaintingInWmPaint | ControlStyles.UserPaint | ControlStyles.ResizeRedraw | ControlStyles.UserPaint | ControlStyles.DoubleBuffer, true);
            this.AutoScroll = true;
            this.Image = null;
            this.InterpolationMode = System.Drawing.Drawing2D.InterpolationMode.High;
            this.Zoom = 1f;
        }
        //New
        [Category("Appearance"), Description("The image to be displayed")]
        public Image Image
        {
            get { return _image; }
            set
            {
                _image = value;
                UpdateScaleFactor();
                Invalidate();
            }
        }
        private float _zoom = 1f;
        [Category("Appearance"), Description("The zoom factor. Less than 1 to reduce. More than 1 to magnify.")]
        public float Zoom
        {
            get { return _zoom; }
            set
            {
                if (value < 0 || value < 1E-05)
                {
                    value = 1E-05f;
                }
                _zoom = value;
                UpdateScaleFactor();
                Invalidate();
            }
        }
        private void UpdateScaleFactor()
        {
            if (_image == null)
            {
                this.AutoScrollMargin = this.Size;
            }
            else
            {
                this.AutoScrollMinSize = new Size(Convert.ToInt32(this._image.Width * _zoom + 0.5f), Convert.ToInt32(this._image.Height * _zoom + 0.5f));
            }
        }
        //UpdateScaleFactor
        private InterpolationMode _interpolationMode = InterpolationMode.High;
        [Category("Appearance"), Description("The interpolation mode used to smooth the drawing")]
        public InterpolationMode InterpolationMode
        {
            get { return _interpolationMode; }
            set { _interpolationMode = value; }
        }
        protected override void OnPaintBackground(PaintEventArgs pevent)
        {
        }
        //OnPaintBackground
        protected override void OnPaint(PaintEventArgs e)
        {
            //if no image, don't bother. I tried check for IsNothing(_image) but this test wasn't detecting a no-image.
            if (_image == null)
            {
                base.OnPaintBackground(e);
                return;
            }
            //Added because the first test sometimes failed
            try
            {
                int H = _image.Height;
                //Throws an exception if image is nothing.
            }
            catch (Exception ex)
            {
                base.OnPaintBackground(e);
                return;
            }
            //Set up a zoom matrix
            Matrix mx = new Matrix(_zoom, 0, 0, _zoom, 0, 0);
            mx.Translate(this.AutoScrollPosition.X / _zoom, this.AutoScrollPosition.Y / _zoom);
            e.Graphics.Transform = mx;
            e.Graphics.InterpolationMode = _interpolationMode;
            e.Graphics.DrawImage(_image, new Rectangle(0, 0, this._image.Width, this._image.Height), 0, 0, _image.Width, _image.Height, GraphicsUnit.Pixel);
            base.OnPaint(e);
        }
        //OnPaint
    }
}
//ZoomPicBox

Now this seems to work fine while using the designer... but when trying to add images and controls at runtime the tabs instantiate fine but the zoomPicBox control does nothing so it would seem... This is how I am using it....

public void loadImagesToTabControl()
{
    int i = 0;


    foreach (Bitmap bitmap in intDwg.getBitmaps())
    {
        //ToDo add pic boxes and tabs and bitmaps to tabcontrol1

        TAQTv4.ZoomPanPicBox picBox = new TAQTv4.ZoomPanPicBox();
        picBox.Image = bitmap;

        picBox.Anchor = AnchorStyles.Top;
        picBox.Anchor = AnchorStyles.Bottom;
        picBox.Anchor = AnchorStyles.Left;
        picBox.Anchor = AnchorStyles.Right;
        picBox.AutoScroll = true;
        picBox.CausesValidation = true;
        picBox.Visible = true;
        picBox.Zoom = 1;
        picBox.BackgroundImageLayout = ImageLayout.Tile;
        picBox.Location = new System.Drawing.Point(0, 0);
        picBox.TabStop = true;
        picBox.Enabled = true;
        picBox.InterpolationMode = System.Drawing.Drawing2D.InterpolationMode.High;
        picBox.CreateControl();





        string title = "Pg " + (tabControl1.TabCount + 1).ToString();
        TabPage myTabPage = new TabPage(title);
        tabControl1.TabPages.Add(myTabPage);
        tabControl1.TabPages[i].Controls.Add(picBox);
        i++;



        /* Possible pictureBox Implementation...
        string title = "Pg " + (tabControl1.TabCount + 1).ToString();
        TabPage myTabPage = new TabPage(title);
        tabControl1.TabPages.Add(myTabPage);
        PictureBox picbox = new PictureBox();
        picbox.Anchor = AnchorStyles.Top;
        picbox.Anchor = AnchorStyles.Bottom;
        picbox.Anchor = AnchorStyles.Left;
        picbox.Anchor = AnchorStyles.Right;
        picbox.Image = bitmap;
        picbox.Height = 800;
        picbox.Width = 1300;
        tabControl1.TabPages[i].Controls.Add(picbox);                
        i++;
        */
    }
}

}

And as a last note... the pictureBox implementation worked fine as well so I know I am pulling my images from disk fine in the deserialization method of my intDwg class. Any thoughts would be much appreciated! Thanks in advance!

UPDATE:

I got the control to load pictures by setting backgroundimage to bitmap instead of picBox.Image.... FRUSTRATING .... but it seems that the way I have it set up the image is not anchored correctly ... trying to improve this and work it out now... any tips and tricks would be just awesome! Thanks!

UPDATE:

A Screen shot... as you can see the tab pages load correctly and one for each bitmap in my collection, yet the custom zoomPanPicBox control does not seem to want to display! See Bellow:

ahh .... seems I don't have rep to post pics.... ... alright how about...

https://www.dropbox.com/s/ogj5jlcce831n3p/scrst.png?v=0mcns

...

UPDATE AGAIN GOT IT THANKS All was missing setting the size as you had mentioned using the following: picBox.SetBounds(0, 0, 300, 300);

:D:D:D:D:D:D:)

Answer 1

Also, instead of using a counter:

    TabPage myTabPage = new TabPage(title);
    tabControl1.TabPages.Add(myTabPage);
    tabControl1.TabPages[i].Controls.Add(picBox);
    i++;

Just use your "myTabPage" reference:

    TabPage myTabPage = new TabPage(title);
    myTabPage.Controls.Add(picBox);
    tabControl1.TabPages.Add(myTabPage);