Develop Reference

Inconsistency when generating rectangles [duplicate]

I'm moving control(label or image) success in PictureBox. When I move, it will save control position(x, y).
Like this:
But problem is: the image result is:
Before gif image, I was drag and drop a label control in center screen. But result image doesn't save label in center screen.
I was set PictureBox attribute to StretchImage.
My code to get position and DrawText in PictureBox like:
public PositionControl CtrlPos = new PositionControl();
private void control_MouseMove(object sender, MouseEventArgs e)
{
if (e.Button == MouseButtons.Left)
{
Control control = (Control)sender;
Point nextPosition = new Point();
nextPosition = picPreview.PointToClient(MousePosition);
nextPosition.Offset(mouseX, mouseY);
control.Location = nextPosition;
CtrlPos.x = nextPosition.X;
CtrlPos.y = nextPosition.Y;
Invalidate();
}
}
My code is parent control(PictureBox) contain all control.
In my class, I'm using this:
private void picPreview_MouseMove(object sender, MouseEventArgs e)
{
if (SelectedControl != null && e.Button == MouseButtons.Left)
{
timer1.Stop();
Invalidate();
if (SelectedControl.Height < 20)
{
SelectedControl.Height = 20;
direction = Direction.None;
Cursor = Cursors.Default;
return;
}
else if (SelectedControl.Width < 20)
{
SelectedControl.Width = 20;
direction = Direction.None;
Cursor = Cursors.Default;
return;
}
//get the current mouse position relative the the app
Point pos = picPreview.PointToClient(MousePosition);
#region resize the control in 8 directions
if (direction == Direction.NW)
{
//north west, location and width, height change
newLocation = new Point(pos.X, pos.Y);
newSize = new Size(SelectedControl.Size.Width - (newLocation.X - SelectedControl.Location.X),
SelectedControl.Size.Height - (newLocation.Y - SelectedControl.Location.Y));
SelectedControl.Location = newLocation;
CtrlPos.x = newLocation.X;
CtrlPos.y = newLocation.Y;
SelectedControl.Size = newSize;
}
else if (direction == Direction.SE)
{
//south east, width and height change
newLocation = new Point(pos.X, pos.Y);
newSize = new Size(SelectedControl.Size.Width + (newLocation.X - SelectedControl.Size.Width - SelectedControl.Location.X),
SelectedControl.Height + (newLocation.Y - SelectedControl.Height - SelectedControl.Location.Y));
SelectedControl.Size = newSize;
}
else if (direction == Direction.N)
{
//north, location and height change
newLocation = new Point(SelectedControl.Location.X, pos.Y);
newSize = new Size(SelectedControl.Width,
SelectedControl.Height - (pos.Y - SelectedControl.Location.Y));
SelectedControl.Location = newLocation;
SelectedControl.Size = newSize;
}
else if (direction == Direction.S)
{
//south, only the height changes
newLocation = new Point(pos.X, pos.Y);
newSize = new Size(SelectedControl.Width,
pos.Y - SelectedControl.Location.Y);
SelectedControl.Size = newSize;
}
else if (direction == Direction.W)
{
//west, location and width will change
newLocation = new Point(pos.X, SelectedControl.Location.Y);
newSize = new Size(SelectedControl.Width - (pos.X - SelectedControl.Location.X),
SelectedControl.Height);
SelectedControl.Location = newLocation;
SelectedControl.Size = newSize;
}
else if (direction == Direction.E)
{
//east, only width changes
newLocation = new Point(pos.X, pos.Y);
newSize = new Size(pos.X - SelectedControl.Location.X,
SelectedControl.Height);
SelectedControl.Size = newSize;
}
else if (direction == Direction.SW)
{
//south west, location, width and height change
newLocation = new Point(pos.X, SelectedControl.Location.Y);
newSize = new Size(SelectedControl.Width - (pos.X - SelectedControl.Location.X),
pos.Y - SelectedControl.Location.Y);
SelectedControl.Location = newLocation;
SelectedControl.Size = newSize;
}
else if (direction == Direction.NE)
{
//north east, location, width and height change
newLocation = new Point(SelectedControl.Location.X, pos.Y);
newSize = new Size(pos.X - SelectedControl.Location.X,
SelectedControl.Height - (pos.Y - SelectedControl.Location.Y));
SelectedControl.Location = newLocation;
SelectedControl.Size = newSize;
}
#endregion
}
}
Draw image using CtrlPost(x, y):
g.DrawImage(
DrawText(image, new Font(cbxFont.Text, fontSize), colorInput,
Color.Transparent),
new Point(CtrlPos.x, CtrlPos.y));
// g is Graphics object.
Updated:
I was using code to add label1 to pictureBox1 like this:
pictureBox1.Controls.Add(label1);

If your PictureBox is in Sizemodes StretchImage or Zoom then the pixels are scaled; the Label's Location however is not. So you would have the calculate the position where to draw:
PointF stretched(Point p0, PictureBox pb)
{
if (pb.Image == null) return PointF.Empty;
float scaleX = 1f * pb.Image.Width / pb.ClientSize.Width;
float scaleY = 1f * pb.Image.Height / pb.ClientSize.Height;
return new PointF(p0.X * scaleX, p0.Y * scaleY);
}
You would call it as PointF p1 = stretched(p0, pictureBox1);
You would draw maybe like this:
g.DrawImage( DrawText(image, new Font(cbxFont.Text, fontSize),
colorInput, Color.Transparent),
Point.Round(stretched( CtrlPos.Location, picPreview));
If you also want to correct the size you can use a similar function..
If the SizeMode is CenterImage the pixels are not scaled but most likely transposed and a correction is necessary as well.
For the other direction simply switch denominator and numerator in the fractions!

Zoom out lags on Xamarin.Form implementation

I need to zoom in/out an image in a Xamarin.Form App.
My problem is that when I made the pinch gesture to zooming out the image it starts to lag and flashing all over the display. Instead the zoom in works perfectly.
I had already follow the official guide (https://learn.microsoft.com/it-it/xamarin/xamarin-forms/app-fundamentals/gestures/pinch) and any sort of forum/comunity but I wasn't able to reach a working answer.
Could anyone help me?
I copy/paste here the section of the code. I localize the bug where I try to set the currentScale variable.
NOTE: I have other methods into the class but they don't manage images or related properties so I don't copy/paste them.
public partial class ResizeFoto : ContentPage
{
double currentScale = 1;
double startScale = 1;
double minScale = 0;
double maxScale = 2.5;
private void PinchGestureRecognizer_PinchUpdated(object sender,PinchGestureUpdatedEventArgs e){
switch (e.Status)
{
case GestureStatus.Started:
startScale = imgUserFoto.Scale;
break;
case GestureStatus.Running:
// LAS test 4
//Input gesture:
//Definition: "The distance between the user's digits, divided by the
//last reported distance between the user's digits in the pinch gesture"
// --> ZOOM IN = e.Scale > 1
// --> ZOOM OUT = e.Scale < 1
//ZOOM IN --> works good
if (e.Scale > 1)
{
currentScale += (e.Scale - 1) * startScale;
currentScale = Math.Min(currentScale, maxScale);
imgUserFoto.Scale = currentScale;
}
//ZOOM OUT --> not working, bug
else if (e.Scale < 1)
{
//HERE MAYBE THE BUG
currentScale = minScale + (e.Scale - 1) * startScale;
//also tried: currentScale = (e.Scale - 1) * startScale;
currentScale = Math.Max(minScale, currentScale);
imgUserFoto.Scale = currentScale;
}
}
break;
case GestureStatus.Completed:
break;
}
}
}

Recently I had to do something similar and I almost searched the whole earth and found nothing then I came up with this:
using System;
using Xamarin.Forms;
using FFImageLoading.Forms;
public class ZoomImage : CachedImage
{
private const double MIN_SCALE = 1;
private const double MAX_SCALE = 4;
private const double OVERSHOOT = 0.15;
private double StartScale, LastScale;
private double StartX, StartY;
public ZoomImage()
{
var pinch = new PinchGestureRecognizer();
pinch.PinchUpdated += OnPinchUpdated;
GestureRecognizers.Add(pinch);
var pan = new PanGestureRecognizer();
pan.PanUpdated += OnPanUpdated;
GestureRecognizers.Add(pan);
var tap = new TapGestureRecognizer { NumberOfTapsRequired = 2 };
tap.Tapped += OnTapped;
GestureRecognizers.Add(tap);
Scale = MIN_SCALE;
TranslationX = TranslationY = 0;
AnchorX = AnchorY = 0;
}
protected override SizeRequest OnMeasure(double widthConstraint, double heightConstraint)
{
Scale = MIN_SCALE;
TranslationX = TranslationY = 0;
AnchorX = AnchorY = 0;
return base.OnMeasure(widthConstraint, heightConstraint);
}
private void OnTapped(object sender, EventArgs e)
{
if (Scale > MIN_SCALE)
{
this.ScaleTo(MIN_SCALE, 250, Easing.CubicInOut);
this.TranslateTo(0, 0, 250, Easing.CubicInOut);
}
else
{
AnchorX = AnchorY = 0.5; //TODO tapped position
this.ScaleTo(MAX_SCALE, 250, Easing.CubicInOut);
}
}
private void OnPanUpdated(object sender, PanUpdatedEventArgs e)
{
switch (e.StatusType)
{
case GestureStatus.Started:
StartX = (1 - AnchorX) * Width;
StartY = (1 - AnchorY) * Height;
break;
case GestureStatus.Running:
AnchorX = Clamp(1 - (StartX + e.TotalX) / Width, 0, 1);
AnchorY = Clamp(1 - (StartY + e.TotalY) / Height, 0, 1);
break;
}
}
private void OnPinchUpdated(object sender, PinchGestureUpdatedEventArgs e)
{
switch (e.Status)
{
case GestureStatus.Started:
LastScale = e.Scale;
StartScale = Scale;
AnchorX = e.ScaleOrigin.X;
AnchorY = e.ScaleOrigin.Y;
break;
case GestureStatus.Running:
if (e.Scale < 0 || Math.Abs(LastScale - e.Scale) > (LastScale * 1.3) - LastScale)
{ return; }
LastScale = e.Scale;
var current = Scale + (e.Scale - 1) * StartScale;
Scale = Clamp(current, MIN_SCALE * (1 - OVERSHOOT), MAX_SCALE * (1 + OVERSHOOT));
break;
case GestureStatus.Completed:
if (Scale > MAX_SCALE)
this.ScaleTo(MAX_SCALE, 250, Easing.SpringOut);
else if (Scale < MIN_SCALE)
this.ScaleTo(MIN_SCALE, 250, Easing.SpringOut);
break;
}
}
private T Clamp<T>(T value, T minimum, T maximum) where T: IComparable
{
if (value.CompareTo(minimum) < 0)
return minimum;
else if (value.CompareTo(maximum) > 0)
return maximum;
else
return value;
}
}
What this does:
Pinch zoom, Pan and Swipe movements together with double tap centre zoom and un-zoom
Note: I have used FFimageLoading's CachedImage because I needed to cache the data in case you do not intend this replace CachedImage with Xamarin.Forms.Image

how to enable scrolling when zoom in and zoom out on a content page in xamarin forms

i am trying to zoom in and zoom out on a content page using xamarin.forms.
I am able zoom in and zoom out but the problem is scrolling is not working.
i want zoom an image. with this code zooming is working perfectly. But while zooming i am not able to see full image. i must scroll to view the rest of the image. for that i need to scroll. but scrolling is not working.
XAML
xmlns:helper="clr-namespace:KPGTC.Deals.Mobile.Helpers"
<helper:PinchToZoomContainer>
<helper:PinchToZoomContainer.Content>
<Image x:Name="img_Popup"/>
</helper:PinchToZoomContainer.Content>
</helper:PinchToZoomContainer>
Code:
public class PinchToZoomContainer : ContentView
{
double MIN_SCALE = 1;
double MAX_SCALE = 4;
double startScale = 1;
double currentScale = 1;
double xOffset = 0;
double yOffset = 0;
bool _isActive = false;
public PinchToZoomContainer()
{
DependencyService.Get<IHelpers>().ShowAlert("Double-tap to zoom");
//var _pinchGesture = new PinchGestureRecognizer();
//_pinchGesture.PinchUpdated += OnPinchUpdated;
//GestureRecognizers.Add(_pinchGesture);
var _tapGesture = new TapGestureRecognizer { NumberOfTapsRequired = 2 };
_tapGesture.Tapped += On_Tapped;
GestureRecognizers.Add(_tapGesture);
var _panGesture = new PanGestureRecognizer();
_panGesture.PanUpdated += OnPanUpdated;
GestureRecognizers.Add(_panGesture);
TranslationX = 0;
TranslationY = 0;
_isActive = false;
}
private void OnPanUpdated(object sender, PanUpdatedEventArgs e)
{
if (_isActive)
{
if (e.TotalX > 0)
{
if (e.TotalX > 2)
{
TranslationX += 15;
}
}
else
{
if (e.TotalX < -2)
{
TranslationX -= 15;
}
}
}
}
private void On_Tapped(object sender, EventArgs e)
{
if (Scale > MIN_SCALE)
{
_isActive = false;
this.ScaleTo(MIN_SCALE, 250, Easing.CubicInOut);
this.TranslateTo(0, 0, 250, Easing.CubicInOut);
}
else
{
_isActive = true;
AnchorX = AnchorY = 0.5;
this.ScaleTo(MAX_SCALE, 250, Easing.CubicInOut);
}
}
void OnPinchUpdated(object sender, PinchGestureUpdatedEventArgs e)
{
if (e.Status == GestureStatus.Started)
{
startScale = Content.Scale;
Content.AnchorX = 0;
Content.AnchorY = 0;
}
if (e.Status == GestureStatus.Running)
{
currentScale += (e.Scale - 1) * startScale;
currentScale = Math.Max(1, currentScale);
double renderedX = Content.X + xOffset;
double deltaX = renderedX / Width;
double deltaWidth = Width / (Content.Width * startScale);
double originX = (e.ScaleOrigin.X - deltaX) * deltaWidth;
double renderedY = Content.Y + yOffset;
double deltaY = renderedY / Height;
double deltaHeight = Height / (Content.Height * startScale);
double originY = (e.ScaleOrigin.Y - deltaY) * deltaHeight;
double targetX = xOffset - (originX * Content.Width) * (currentScale - startScale);
double targetY = yOffset - (originY * Content.Height) * (currentScale - startScale);
Content.TranslationX = targetX.Clamp(-Content.Width * (currentScale - 1), 0);
Content.TranslationY = targetY.Clamp(-Content.Height * (currentScale - 1), 0);
Content.Scale = currentScale;
}
if (e.Status == GestureStatus.Completed)
{
xOffset = Content.TranslationX;
yOffset = Content.TranslationY;
}
}
}

Alright, this was quite a tough one and admittedly I don't understand fully how I made it, but I made it.
Some thoughts:
You mixed the translation of the container and the content, which is quite tricky to handle - if this is possible at all
When panning, you added 15 every time the pan event was raised, but there is a better way: Just store the initial offset of the content and then add the TotalX and TotalY respectively to the TranslationX and the TranslationY of the content (this was the easy part)
Panning while zooming was quite hard to get right and I had to find it out by trial and error
Basically you have to store the origin of the pinch gesture when the gesture starts and calculate the diff between the original origin and the current origin
Then you have to add the diff (multiplied by the with and height respectively of the control) to the target translation
Here is the code for the panning:
private void OnPanUpdated(object sender, PanUpdatedEventArgs e)
{
if (e.StatusType == GestureStatus.Started)
{
this.xOffset = this.Content.TranslationX;
this.yOffset = this.Content.TranslationY;
}
if (e.StatusType != GestureStatus.Completed
&& e.StatusType != GestureStatus.Canceled)
{
this.Content.TranslationX = this.xOffset + e.TotalX;
this.Content.TranslationY = this.yOffset + e.TotalY;
}
if (e.StatusType == GestureStatus.Completed)
{
this.xOffset = this.Content.TranslationX;
this.yOffset = this.Content.TranslationY;
}
}
And here for the pinching
void OnPinchUpdated(object sender, PinchGestureUpdatedEventArgs e)
{
if (e.Status == GestureStatus.Started)
{
this.startScale = this.Content.Scale;
this.Content.AnchorX = 0;
this.Content.AnchorY = 0;
this.startScaleOrigin = e.ScaleOrigin;
}
if (e.Status == GestureStatus.Running)
{
var originDiff = PinchToZoomContainer.CalculateDiff(e.ScaleOrigin, this.startScaleOrigin);
this.currentScale += (e.Scale - 1) * this.startScale;
this.currentScale = Math.Max(1, this.currentScale);
double renderedX = this.Content.X + this.xOffset;
double deltaX = renderedX / this.Width;
double deltaWidth = this.Width / (this.Content.Width * this.startScale);
double originX = (this.startScaleOrigin.X - deltaX) * deltaWidth;
double renderedY = this.Content.Y + this.yOffset;
double deltaY = renderedY / this.Height;
double deltaHeight = this.Height / (this.Content.Height * this.startScale);
double originY = (startScaleOrigin.Y - deltaY) * deltaHeight;
double targetX = this.xOffset - ((originX) * this.Content.Width) * (this.currentScale - this.startScale) - originDiff.X * this.Content.Width;
double targetY = this.yOffset - ((originY) * this.Content.Height) * (this.currentScale - this.startScale) - originDiff.Y * this.Content.Height;
this.Content.TranslationX = targetX.Clamp(-this.Content.Width * (this.currentScale - 1), 0);
this.Content.TranslationY = targetY.Clamp(-this.Content.Height * (this.currentScale - 1), 0);
this.Content.Scale = this.currentScale;
}
if (e.Status == GestureStatus.Completed)
{
this.xOffset = this.Content.TranslationX;
this.yOffset = this.Content.TranslationY;
}
}
(Of course you have to add Point startScaleOrigin to your class).
Finally you need the method to calculate the distance between two points
private static Point CalculateDiff(Point first, Point second)
{
return second.Offset(-first.X, -first.Y);
}
Unfortunately I did not manage to get the tapping right, but I think you should be able to figure it out from here.

How can i check that the pictureBox i'm moving around will not get out the borders top left right bottom of the second picturebox area?

private void picZoom_MouseMove(object sender, MouseEventArgs e)
{
if (PicImageClicked == false)
{
if (checkBox1.Checked)
{
int x = e.X + picZoom.Left - picImage.Left;
int y = e.Y + picZoom.Top - picImage.Top;
if (x <= picImage.Width && y <= picImage.Height &&
x <= picImage.Top && y <= picImage.Left)
{
MouseEventArgs e2 = new MouseEventArgs(MouseButtons.None, 0, x, y, 0);
picImageReposition(null, e2);
}
}
else
{
UpdateZoomedImage(e);
}
}
}
picImage is a bigger pictureBox and picZoom is a smaller pictureBox the picZoom i'm moving aorund inside the picImage are with the mouse.
This condition:
if (x <= picImage.Width && y <= picImage.Height
Is working if i'm moving the picZoom to the left border or the bottom border it stop on it and not continue.
But the second condition:
x <= picImage.Top && y <= picImage.Left
Is not working good it make everything slow and it's not stopping on the left or top borders.
I want to make a condition/s so the picZoom will stay in the picImage area borders.
What i tried now is:
private void picZoom_MouseMove(object sender, MouseEventArgs e)
{
Point pnt;
int x, y;
if (MouseButtons.Left == e.Button)
{
pnt = picZoom.PointToScreen(e.Location);
pnt = this.PointToClient(pnt);
x = pnt.X - mouseDown.X;
y = pnt.Y - mouseDown.Y;
if (x < picImage.Left)
{
x = picImage.Left;
}
else if (x + picZoom.Width > picImage.Left + picImage.Width)
{
x = picImage.Left + picImage.Width - picZoom.Width;
}
else
{ }
if (y < picImage.Top)
{
y = picImage.Top;
}
else if (y + picZoom.Height > picImage.Top + picImage.Height)
{
y = picImage.Top + picImage.Height - picZoom.Height;
}
else
{ }
picZoom.Location = new Point(x, y);
if (PicImageClicked == false)
{
if (checkBox1.Checked)
{
MouseEventArgs e2 = new MouseEventArgs(MouseButtons.None, 0, x, y, 0);
picImageReposition(null, e2);
}
else
{
UpdateZoomedImage(e);
}
}
}
}
picImageReposition is:
private void picImageReposition(object sender, MouseEventArgs e)
{
// If no picture is loaded, return
if (picImage.Image == null)
return;
if (PicImageClicked == false)
{
picZoom.BringToFront();
picZoom.Left = e.X + picImage.Left - picZoom.Width/2;
picZoom.Top = e.Y + picImage.Top - picZoom.Height/2;
UpdateZoomedImage(e);
}
}
And UpdateZoomedImage is:
private void UpdateZoomedImage(MouseEventArgs e)
{
// Calculate the width and height of the portion of the image we want
// to show in the picZoom picturebox. This value changes when the zoom
// factor is changed.
int zoomWidth = picZoom.Width / _ZoomFactor;
int zoomHeight = picZoom.Height / _ZoomFactor;
// Calculate the horizontal and vertical midpoints for the crosshair
// cursor and correct centering of the new image
int halfWidth = zoomWidth / 2;
int halfHeight = zoomHeight / 2;
// Create a new temporary bitmap to fit inside the picZoom picturebox
tempBitmap = new Bitmap(zoomWidth, zoomHeight, PixelFormat.Format24bppRgb);
// Create a temporary Graphics object to work on the bitmap
Graphics bmGraphics = Graphics.FromImage(tempBitmap);
// Clear the bitmap with the selected backcolor
bmGraphics.Clear(_BackColor);
// Set the interpolation mode
bmGraphics.InterpolationMode = InterpolationMode.HighQualityBicubic;
// Draw the portion of the main image onto the bitmap
// The target rectangle is already known now.
// Here the mouse position of the cursor on the main image is used to
// cut out a portion of the main image.
bmGraphics.DrawImage(picImage.Image,
new Rectangle(0, 0, zoomWidth, zoomHeight),
new Rectangle(e.X - halfWidth, e.Y - halfHeight, zoomWidth, zoomHeight),
GraphicsUnit.Pixel);
// Draw the bitmap on the picZoom picturebox
picZoom.Image = tempBitmap;
// Draw a crosshair on the bitmap to simulate the cursor position
bmGraphics.DrawLine(Pens.Black, halfWidth + 1, halfHeight - 4, halfWidth + 1, halfHeight - 1);
bmGraphics.DrawLine(Pens.Black, halfWidth + 1, halfHeight + 6, halfWidth + 1, halfHeight + 3);
bmGraphics.DrawLine(Pens.Black, halfWidth - 4, halfHeight + 1, halfWidth - 1, halfHeight + 1);
bmGraphics.DrawLine(Pens.Black, halfWidth + 6, halfHeight + 1, halfWidth + 3, halfHeight + 1);
// Dispose of the Graphics object
bmGraphics.Dispose();
// Refresh the picZoom picturebox to reflect the changes
picZoom.Refresh();
}

If the formula of moving the picZoom control is what you want eg
int x = e.X + picZoom.Left - picImage.Left;
int y = e.Y + picZoom.Top - picImage.Top;
then the comparison is(x, y is the position in picImage meaning that 0,0 is the left top position):
if(x >= 0 && y >= 0 && x + picZoom.Width <= picImage.Width && y + picZoom.Height <= picImage.Height)
{
...
...
}
EDIT
When you click in picZoom and drag, the control moves with the mouse:
private Point mouseDown;
private void picZoom_MouseDown(object sender, MouseEventArgs e)
{
mouseDown = e.Location;
}
private void picZoom_MouseMove(object sender, MouseEventArgs e)
{
Point pnt;
int x, y;
if (MouseButtons.Left == e.Button)
{
pnt = picZoom.PointToScreen(e.Location);
pnt = this.PointToClient(pnt);
x = pnt.X - mouseDown.X;
y = pnt.Y - mouseDown.Y;
if (x < picImage.Left)
{
x = picImage.Left;
}
else if (x + picZoom.Width > picImage.Left + picImage.Width)
{
x = picImage.Left + picImage.Width - picZoom.Width;
}
else
{ }
if (y < picImage.Top)
{
y = picImage.Top;
}
else if (y + picZoom.Height > picImage.Top + picImage.Height)
{
y = picImage.Top + picImage.Height - picZoom.Height;
}
else
{ }
picZoom.Location = new Point(x, y);
}
}
valter

This is not an answer to your question as much as it is a suggestion. Could you not create a Rect() directly over your picture and simply check if the mouse position is within it's bounds.
Something along the lines of:
Rectangle rect = obj.GetBounds(e.Graphics);
if (!rect.Intersects(e.ClipRectangle))
continue;
(stolen from another post)

So I looked over your code again, and it struck me.
You are comparing an x value to the top bound of your picture and a y value to the left bound...
x <= picImage.Top && y <= picImage.Left
should be
x <= picImage.Left && y <= picImage.Top
That is, if I understand what you are trying to do.
Good luck!

Zoom Out by reversing Zoom In Mouse

I have a block of code which is executed on a C# Windows Form upon Mouse_Up. It basically zooms in on a rendered image and keeps zooming in each time the rubber band is drawn. I want to reverse this by adding a checkbox (which I have already done) and if the check box is ticked, do zooming out instead from the current view as per drawing of the rubber band. I thought it would be as simple as using the opposite operands i.e "+" instead of a "-" but it won't work. I have posted the event code below. There is a conditional IF on there for changing of the checkbox state. The first lot work fine with zooming in. The section after the ELSE IF doesn't let me zoom out - hence I have just left repeated code there for someone to look at. Thanks
private void Form1_MouseUp(object sender, MouseEventArgs e)
{
if (checkBox1.Checked == false)
{
int z, w;
this.Cursor = Cursors.Arrow;
// Set internal flag to know we no longer "have the mouse".
weHaveMouse = false;
// If we have drawn previously, draw again in that spot
// to remove the lines.
if (ptLast.X != -1)
{
toolStripStatusLabel1.Text = "Please click and drag to zoom into the Fractal";
Point ptCurrent = new Point(e.X, e.Y);
MyDrawReversibleRectangle(ptOriginal, ptLast);
}
// Set flags to know that there is no "previous" line to reverse.
ptLast.X = -1;
ptLast.Y = -1;
ptOriginal.X = -1;
ptOriginal.Y = -1;
//e.consume();
if (action)
{
xe = e.X;
ye = e.Y;
if (xs > xe)
{
z = xs;
xs = xe;
xe = z;
}
if (ys > ye)
{
z = ys;
ys = ye;
ye = z;
}
w = (xe - xs);
z = (ye - ys);
if ((w < 2) && (z < 2)) initvalues();
else
{
if (((float)w > (float)z * xy)) ye = (int)((float)ys + (float)w / xy);
else xe = (int)((float)xs + (float)z * xy);
xende = xstart + xzoom * (double)xe;
yende = ystart + yzoom * (double)ye;
xstart += xzoom * (double)xs;
ystart += yzoom * (double)ys;
}
xzoom = (xende - xstart) /(double)x1;
yzoom = (yende - ystart) / (double)y1;
mandelbrot();
rectangle = false;
//Refresh();
}
}
else if (checkBox1.Checked == true)
{
int z, w;
this.Cursor = Cursors.Arrow;
// Set internal flag to know we no longer "have the mouse".
weHaveMouse = false;
// If we have drawn previously, draw again in that spot
// to remove the lines.
if (ptLast.X != -1)
{
toolStripStatusLabel1.Text = "Please click and drag to zoom into the Fractal";
Point ptCurrent = new Point(e.X, e.Y);
MyDrawReversibleRectangle(ptOriginal, ptLast);
}
// Set flags to know that there is no "previous" line to reverse.
ptLast.X = -1;
ptLast.Y = -1;
ptOriginal.X = -1;
ptOriginal.Y = -1;
//e.consume();
if (action)
{
xe = e.X;
ye = e.Y;
if (xs > xe)
{
z = xs;
xs = xe;
xe = z;
}
if (ys > ye)
{
z = ys;
ys = ye;
ye = z;
}
w = (xe - xs);
z = (ye - ys);
if ((w < 2) && (z < 2)) initvalues();
else
{
if (((float)w > (float)z * xy)) ye = (int)((float)ys + (float)w / xy);
else xe = (int)((float)xs + (float)z * xy);
xende = xstart + xzoom * (double)xe;
yende = ystart + yzoom * (double)ye;
xstart += xzoom * (double)xs;
ystart += yzoom * (double)ys;
}
xzoom = (xende - xstart) / (double)x1;
yzoom = (yende - ystart) / (double)y1;
mandelbrot();
rectangle = false;
//Refresh();
}
}
}

First of all, in my humble opinion, there is no need to draw rubber band when you are zooming out. Just a click where the zoomed out image will be centered. Nevertheless, I cannot see the difference in the code you provided between the code for zooming in and zooming out. In general, the simplest thing to do is to zoom out the image in a way that current center of the image remains at its place and handle the image drawing in a way that X and Y coordinates are divided by 2 and Width and Height are multiplied by 2.
In case of your code, calculating something like this at the end of code could maybe do the trick:
xzoom = 1/xzoom;
yzoom = 1/yzoom;