Question

I’ve always worked with Windows Forms, but now I’m trying to learn WPF due to it’s advantages. Some time ago I created a picturebox control (with help of Damien here). And for me it’s very hard to convert this control into WPF’s Image control. I haven’t found any appropriate help on the Internet.

My control is used for displaying (founded before) middle between two pages on a scanned image of book. It consists of two moveable points, line between them and areas to the left and to the right filled with semitransparent polygons.
The problem is that WPF is VERY different. It’s even hard to draw a filled circle on a Image control.

Here is my code listing:

public partial class SplitPictureBox : System.Windows.Forms.PictureBox
{
    public SplitPictureBox()
    {
        InitializeComponent();
    }

    private int mPointMoveInProgress = 0;

    private int handleRadius = 5;
    public int HandleRaduis
    {
        get { return handleRadius; }
        set { handleRadius = value; }
    }

    private int middleTop = 0;
    private int middleBottom = 0;

    private int middle;
    public int Middle
    {
        get 
        {    
            return (middleTop + middleBottom) /2; 
        }
        set { middle = value; }
    }

    private double theta;
    public double Theta
    {
        get
        {
            return (Math.Atan(((middleTop - middleBottom) / (double)this.Height)) * 180) / Math.PI;
        }
        set 
        {
            theta = value;
            int deltaX = (int)((Math.Tan((Math.PI / 180) * value)) * this.Height / 2);
            middleTop = middle + deltaX;
            middleBottom = middle - deltaX;
        }
    }

    protected override void OnPaint(PaintEventArgs pe)
    {
        base.OnPaint(pe);
        SolidBrush left = new SolidBrush(Color.FromArgb(80, Color.Blue));
        SolidBrush right = new SolidBrush(Color.FromArgb(80, Color.Green));
        SolidBrush brush = new SolidBrush(Color.Red);
        pe.Graphics.FillPolygon(left, new Point[4] { new Point(0,0), new Point(middleTop,0),
            new Point(middleBottom, this.Height), new Point(0, this.Height)
        });
        pe.Graphics.FillPolygon(right, new Point[4] { new Point(this.Width,0), new Point(middleTop,0),
            new Point(middleBottom, this.Height), new Point(this.Width, this.Height)
        });
        // Draw line        
        pe.Graphics.DrawLine(new Pen(Color.Red, 2), new Point(middleTop, handleRadius), new Point(middleBottom, this.Height - handleRadius));
        Rectangle rectangle;
        // Draw first handle
        rectangle = new Rectangle(middleTop - handleRadius, 0, handleRadius * 2, handleRadius * 2);
        pe.Graphics.FillEllipse(brush, rectangle);
        // Draw second handle
        rectangle = new Rectangle(middleBottom - handleRadius, this.Height - handleRadius * 2, handleRadius * 2, handleRadius * 2);
        pe.Graphics.FillEllipse(brush, rectangle);
    }

    private Point moveLineTop;
    private Point moveLineBottom;

    protected override void OnMouseDown(MouseEventArgs e)
    {
        moveLineTop = new Point(e.X - middleTop, 0);
        moveLineBottom = new Point(e.X - middleBottom, this.Height);
        if (Math.Abs(e.X - middleTop) < handleRadius && Math.Abs(e.Y) <= handleRadius * 2)
        {
            Cursor.Current = Cursors.Hand;
            mPointMoveInProgress = 1;
        }
        else if (Math.Abs(e.X - middleBottom) < handleRadius && Math.Abs(e.Y - this.Height) <= handleRadius * 2)
        {
            Cursor.Current = Cursors.Hand;
            mPointMoveInProgress = 2;
        }
        else if (Math.Abs(e.X - x) < handleRadius && e.Y > handleRadius * 2 && e.Y < this.Height - handleRadius * 2)
        {
            Cursor.Current = Cursors.SizeWE;
            mPointMoveInProgress = 3;
        }
        else mPointMoveInProgress = 0;
        base.OnMouseDown(e);
    }

    private int x = 0;

    protected override void OnMouseMove(MouseEventArgs e)
    {
        x = middleTop - (int)((e.Y * (middleTop - middleBottom)) / (double)this.Height);

        if (mPointMoveInProgress == 1)      
        {
            Cursor.Current = Cursors.Hand;
            if (e.X > 0 && e.X < this.Width)
            {
                middleTop = e.X;
                Refresh();
            }
        }
        else if (mPointMoveInProgress == 2)      
        {
            Cursor.Current = Cursors.Hand;
            if (e.X > 0 && e.X < this.Width)
            {
                middleBottom = e.X;
                Refresh();
            }
        }
        else if (mPointMoveInProgress == 3)
        {
            if (e.X - moveLineTop.X >= 0 && e.X - moveLineTop.X <= this.Width &&
                e.X - moveLineBottom.X >= 0 && e.X - moveLineBottom.X <= this.Width)
            {
                Cursor.Current = Cursors.SizeWE;
                middleTop = e.X - moveLineTop.X;
                middleBottom = e.X - moveLineBottom.X;

                Refresh();
            }
        }

        else       
        {
            if (Math.Abs(e.X - middleTop) < handleRadius && Math.Abs(e.Y) <= handleRadius * 2)
                Cursor.Current = Cursors.Hand;
            else if (Math.Abs(e.X - middleBottom) < handleRadius && Math.Abs(e.Y - this.Height) <= handleRadius * 2)
                Cursor.Current = Cursors.Hand;
            else if (Math.Abs(e.X - x) < handleRadius && e.Y > handleRadius * 2 && e.Y < this.Height - handleRadius * 2)
                Cursor.Current = Cursors.SizeWE;
            else Cursor.Current = Cursors.Default;
        }
        base.OnMouseMove(e);
    }

    protected override void OnMouseUp(MouseEventArgs e)
    {      
        mPointMoveInProgress = 0;
        middle = (middleTop + middleBottom) / 2;
        base.OnMouseUp(e);
    }
}

Could anybody to help me with this? Give me some useful links or code samples.
Thanks!

Answer 1

You are looking for Adorners, they can draw items over other controls, and also handle events, etc.

Some tips:

How to: Implement an Adorner

Adorners How-To Topics