These are the main things in the example:
1. TPaintBox
2. TTrackBar
3. TOpenDialog
TOpenDialog
It is used to let user to select a file. To use it, you call its Execute method, see line #54.
After user select a file, we load and store the image into LoadedImage, see line #56 and #57. And we set the default values for Zoom, X and Y, see lines #58..#60. The line #61 is needed because calling PaintBox.Invalidate will let the painbox to refresh its image.
TTrackbar
TTrackbar is used to let users to provide a value by using arrow keys and mouse.
There are 3 trackbars used in the example, see lines #27..29. The starting values of those trackbars were set on the lines #58..60.
When user modify any value of the trackbars, line #33 PaintBoxUpdate will be called because it was set in their OnChange event. The PaintBoxUpdate simply calls Invalidate, see line #113.
TPainBox
TPainBox is used for showing and modifying image on the screen. Usually we do it by accessing its canvas. In this case we use Canvas.StretchDraw, see line #95.
OnPaint event is where you should put the code for showing the image, see line #69. Some calculations needed be done before really showing the image. First we calculate the size based on the zoom trackbar, see line #80. Line #85..86 are for centering the image, first the X then Y. And the calculate the offset, see line #87. After all the needed values have been calculated, now see show the image on the painbox, see line #90.