#Xojo tutorials code#

The only difference is that the drawing will be confined to the child area. You can then draw into the child area just as with any other Graphics` object. It returns a new Graphics object that is the specified region inside the parent area. You pass it the top-left corner of the child region and its width and height. You create a child region within the parent area with the Clip method. You then draw into each “child” area, with the assurance that each drawing will not inadvertently overlap another object and perhaps cause unwanted flicker. When you are drawing a complex image that involves many calls to Graphics methods, you may want to create non-overlapping regions within the area.

#Xojo tutorials code#

For example, this code in the KeyDown event of the window scrolls the picture 8 pixels at a time: Your code can test whether any of the arrow keys have been pressed and then take the appropriate action. To do this, you place code in the KeyDown event handler of the active window. The properties XScroll and YScroll have been added to the window to hold the amount of points the picture has been scrolled.Ī convenient way to scroll a picture is with the four arrow keys. The picture has been added to the project. The code below shows you how you can scroll a picture. This can be done by adding properties to the window that contains the Canvas control or by creating a new class based on the Canvas control that contains properties to hold the last X scroll amount and last Y scroll amount. To use the Scroll method to scroll the picture in a Canvas control, you need to store the last scroll value for the axis you are scrolling so you can use this to calculate the amount to scroll. It takes three parameters: the picture to be scrolled, and the amounts to be scrolled in the horizontal and vertical directions. Scrolling pictures are only supported with the Desktop Canvas class.Ī picture that is drawn into a Canvas with the DrawPicture method can be scrolled by calling the Canvas Scroll method. If you are working within a Canvas control, the point 10, 20 is 10 pixels from the left edge of the Canvas control and 20 pixels down from the top edge of the control. So, a point that is at 10, 20 (within a window, for example) is 10 pixels from the left side of the window and 20 pixels from the top of the window.

The Y axis is the vertical axis and it increases in value moving from top to bottom. It increases in value moving from left to right. For a window or web page, the origin is the upper-left corner of the window or web page, and for a control, it's the upper-left corner of the control. For multiple screens, this is the upper-leftmost corner of the leftmost screen. For the entire screen, this is the upper-left corner of the screen.

The origin is always in the upper-left corner of the area. If you have never done a computer drawing with a coordinates system, you might expect the origin (0,0) to be in the center of the window, but it's not. This system is a grid of invisible horizontal and vertical lines that are 1 pixel apart. This location is specified using the coordinates system. Most of the graphics methods require you to indicate the location inside the control where you wish to begin drawing. Since all drawing is done using coordinates to specify the location of things, it is important to understand how they work. To draw a picture in your application, you use the Canvas (for desktop projects), the WebCanvas (for web projects), or the iOSCanvas (for iOS projects) controls. Reporting bugs and making feature requests.Updating code that used the Graphics property.Supporting Dark Mode and more with Color Groups.Using a portion of the window, web page or view.