Class # DesktopCanvas

forsearch

Canvas --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- ## Description DesktopCanvas controls are very useful for implementing your own graphical controls because you can use the `Graphics` class drawing commands or the `Object2D` classes to draw inside the **Canvas** region. It can also be used to display existing graphics, like the `DesktopImageViewer`. ## Properties

table-centered_columns_3_and_4

| Name | Type | Read-Only | Shared | |----------------------------------------------------------|------------------------------------------------------------|-----------|--------| | `Active` | `Boolean` | ✓ | | | `AllowAutoDeactivate` | `Boolean` | | | | `AllowFocus` | `Boolean` | | | | `AllowFocusRing` | `Boolean` | | | | `AllowTabs` | `Boolean` | | | | `AllowTabStop` | `Boolean` | | | | `Backdrop` | `Picture` | | | | `Enabled` | `Boolean` | | | | `Handle` | `Ptr` | ✓ | | | `Height` | `Integer` | | | | `Index` | `Integer` | | | | `Left` | `Integer` | | | | `LockBottom` | `Boolean` | | | | `LockLeft` | `Boolean` | | | | `LockRight` | `Boolean` | | | | `LockTop` | `Boolean` | | | | `MouseCursor` | `MouseCursor` | | | | `Name` | `String` | ✓ | | | `PanelIndex` | `Integer` | | | | `Parent` | `Object` | | | | `ScaleFactor` | `Double` | | | | `Scope` | `Integer` | ✓ | | | `TabIndex` | `Integer` | | | | `Tooltip` | `String` | | | | `Top` | `Integer` | | | | `Transparent` | `Boolean` | | | | `Visible` | `Boolean` | | | | `Width` | `Integer` | | | | `Window` | `DesktopWindow` | ✓ | | ## Methods

table-centered_column_4

| Name | Parameters | Returns | Shared | |------------------------------------------------------|----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|---------|--------| | `AcceptFileDrop` | FileType As `String` | | | | `AcceptPictureDrop` | | | | | `AcceptRawDataDrop` | Type As `String` | | | | `AcceptTextDrop` | | | | | `Close` | | | | | `DrawInto` | g As `Graphics`, x As `Integer`, y As `Integer` | | | | `Refresh` | immediately As `Boolean` = `False` | | | | | x As `Integer`, y As `Integer`, width As `Integer`, height As `Integer`, immediately As `Boolean` = `False` | | | | `Scroll` | dx As `Integer`, dy As `Integer`, x As `Integer` = 0, y As `Integer` = 0, width As `Integer` = -10000, height As `Integer` = -10000, moveControls As `Boolean` = `True` | | | | `SetFocus` | | | | ## Events

table-centered_column_4

| Name | Parameters | Returns | |------------------------------------------------------------------------|---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|------------------------------------| | `Activated` | | | | `Closing` | | | | `ConstructContextualMenu` | Base As `DesktopMenuItem`, x As `Integer`, y As `Integer` | `Boolean` | | `ContextualMenuItemSelected` | HitItem As `DesktopMenuItem` | `Boolean` | | `Deactivated` | | | | `DoublePressed` | X As `Integer`, Y As `Integer` | | | `DragEnter` | obj As `DragItem`, Action As `DragItem.Types` | `Boolean` | | `DragExit` | obj As `DragItem`, Action As `DragItem.Types` | | | `DragOver` | x As `Integer`, y As `Integer`, obj As `DragItem`, Action As `DragItem.Types` | `Boolean` | | `DrawControlInLayoutEditor` | g As `Graphics` | | | `DropObject` | Obj As `DragItem`, Action As `DragItem.Types` | | | `FocusLost` | | | | `FocusReceived` | | | | `KeyDown` | Key As `String` | `Boolean` | | `KeyUp` | Key As `String` | | | `MenuBarSelected` | | | | `MouseDown` | X As `Integer`, Y As `Integer` | `Boolean` | | `MouseDrag` | X As `Integer`, Y As `Integer` | | | `MouseEnter` | | | | `MouseExit` | | | | `MouseMove` | X As `Integer`, Y As `Integer` | | | `MouseUp` | X As `Integer`, Y As `Integer` | | | `MouseWheel` | X As `Integer`, Y As `Integer`, DeltaX As `Integer`, DeltaY As `Integer` | `Boolean` | | `Opening` | | | | `Paint` | g As `Graphics`, areas() As `Rect` | | | `ScaleFactorChanged` | | | ## Property descriptions

forsearch

DesktopCanvas.Active **Active** As `Boolean` > Indicates whether the `control` is active. > > Active is `False` when the control's window is not in the foreground. When a `DesktopWindow` is deactivated, its controls are automatically deactivated unless `AllowAutoDeactivate` is set to `False`. > > This property is read-only.

forsearch

DesktopCanvas.AllowAutoDeactivate **AllowAutoDeactivate** As `Boolean` > Determines whether the control should be deactivated (on macOS) when the parent window is deactivated. The default is `True`.

forsearch

DesktopCanvas.AllowFocus **AllowFocus** As `Boolean` > If `True`, the canvas will be included in the Tab order and can accept the focus. The `FocusReceived` and `FocusLost` events are called at the appropriate times. > > This code enables the AllowFocus property. It is in the Opening event of the control. > > ``` xojo > Me.AllowFocus = True > ```

forsearch

DesktopCanvas.AllowFocusRing **AllowFocusRing** As `Boolean` > If `True`, the DesktopCanvas indicates that it has the focus with a ring around its border; if `False`, the appearance of the object does not change when it has the focus. > > Setting this property to `True` has no effect on Windows or Linux. The default is `True`. > > This code turns AllowFocusRing off. > > ``` xojo > Me.AllowFocusRing = False > ```

forsearch

DesktopCanvas.AllowTabs **AllowTabs** As `Boolean` > If `True` and `AllowFocus` is `True`, then pressing Tab triggers the KeyDown event for processing. The default is `False`. > > If `False`, pressing the Tab key does not trigger the KeyDown event; pressing Tab triggers the FocusLost Event and selects the next object in the window that can accept the focus. > > The following turns on AllowTabs. > > ``` xojo > Me.AllowTabs = True > ```

forsearch

DesktopCanvas.AllowTabStop **AllowTabStop** As `Boolean` > If `True`, the control is in the Tab Order and accepts the focus when the user tabs into it. The default is `True`. If `False`, the user cannot tab into it to give it the focus. However, the control can gain the focus by other means, such as the user's clicking on it or by setting the focus in code. > > This example removes the control from the Tab Order: > > ``` xojo > Me.AllowTabStop = False > ```

forsearch

DesktopCanvas.Backdrop **Backdrop** As `Picture` > The passed `Picture` that will automatically be drawn into the area. > > You should not assign a new picture to the backdrop of the control when being inside the Paint event of that control. This can lead into problems like the backdrop not being painted. > > The following code assigns a jpg image to the Backdrop. The image has been added to the project. The code is in the Opening event. > > ``` xojo > Me.BackDrop = HouseImage > ```

forsearch

DesktopCanvas.Enabled **Enabled** As `Boolean` > Determines if the control should be enabled when the owning window is opened. > > A disabled control cannot be clicked and cannot receive the focus. > > This example disables the control. > > ``` xojo > Me.Enabled = False > ```

forsearch

DesktopCanvas.Handle **Handle** As `Ptr` > Returns a handle to the control. > > This property is read-only. > > For interfacing with Mac APIs using `Declares`, **DesktopControl.Handle** returns NSViews (except for `DesktopToolbar`). > > On Windows returns the HWND of the control. > > On Linux it returns a GtkWidget. > > The following gets a handle to the control. > > ``` xojo > Var p As Ptr = Me.Handle > ```

forsearch

DesktopCanvas.Height **Height** As `Integer` > The height (in points) of the control. > > This example sets the height of the control to 100: > > ``` xojo > Me.Height = 100 > ```

forsearch

DesktopCanvas.Index **Index** As `Integer` > If the control is used in a control set, this specifies the control's index in the set.

forsearch

DesktopCanvas.Left **Left** As `Integer` > The distance from the left side of the control to the left side of its containing window or container. > > The following example moves the control 100 points from the left side of the window: > > ``` xojo > Me.Left = 150 > ```

forsearch

DesktopCanvas.LockBottom **LockBottom** As `Boolean` > Determines whether the bottom edge of the control should stay at a set distance from the bottom edge of the parent control, if there is one, or the owning window. > > This property can be set in the control's Inspector. The following example sets it in code. > > ``` xojo > Me.LockBottom = True > ```

forsearch

DesktopCanvas.LockLeft **LockLeft** As `Boolean` > Determines whether the left edge of the control should stay at a set distance from the left edge of the parent control, if there is one, or the owning window. > > LockLeft and Locktop default to `True` when you add a new control to a window. Existing controls will be altered only if LockRight and/or LockBottom are not set. *LockLeft* has no effect unless *LockRight* is `True`. > > This property can be set in the control's Inspector. The following example sets it in code. > > ``` xojo > Me.LockLeft = True > ```

forsearch

DesktopCanvas.LockRight **LockRight** As `Boolean` > Determines whether the right edge of the control should stay at a set distance from the right edge of the parent control, if there is one, or the owning window. > > This property can be set in the control's Inspector. The following example sets it in code. > > ``` xojo > Me.LockRight = True > ```

forsearch

DesktopCanvas.LockTop **LockTop** As `Boolean` > Determines whether the top edge of the control should stay at a set distance from the top edge of the parent control, if there is one, or the owning window. > > LockTop and LockLeft default to `True` when you add a control to a window. Existing controls will be altered only if LockRight and/or LockBottom are not set. *LockTop* has no effect unless *LockBottom* is `True`. > > This property can be set in the control's Inspector. The following example sets it in code. > > ``` xojo > Me.LockTop = True > ```

forsearch

DesktopCanvas.MouseCursor **MouseCursor** As `MouseCursor` > The cursor to be displayed while the mouse is within the control and both the `DesktopApplication` and `DesktopWindow` class's MouseCursor properties are `Nil`. > > If the `DesktopApplication` class's MouseCursor property is not `Nil` or the `DesktopWindow`'s MouseCursor property is not `Nil`, then any control's MouseCursor property is ignored. You can use a cursor stored in the `Cursors` module. On macOS, you can also obtain a `MouseCursor` from a resource file. > > This line in the Opening event of the control sets the default cursor to the finger pointer. > > ``` xojo > Me.MouseCursor = System.Cursors.FingerPointer > ```

forsearch

DesktopCanvas.Name **Name** As `String` > The name of the control. Set the name of the control in the Inspector. > > This property is read-only.

forsearch

DesktopCanvas.PanelIndex **PanelIndex** As `Integer` > If the control has been placed on a `DesktopTabPanel` or `DesktopPagePanel` control, this is the panel (page/tab) that the control is on. If the control is not on a panel, it returns -1. > > The first panel is numbered zero. If the control has been placed on a panel of a `DesktopTabPanel` or `DesktopPagePanel` control, it returns the panel number. If the control is not on a `DesktopPagePanel` or `DesktopTabPanel`, it returns -1. If you change the PanelIndex to a nonexistent panel, the control will disappear until you give it a PanelIndex value that corresponds to a panel that exists. > > If you are looking to change the currently selected panel (page/tab), use `DesktopPagePanel.SelectedPanelIndex`. > > This code displays the panel index of the control that is on the page. > > ``` xojo > MessageBox(Me.SelectedPanelIndex.ToString) > ```

forsearch

DesktopCanvas.Parent **Parent** As `Object` > Used to get and set the control's parent control or window. > > If the control is on the window, the Parent will be the `Window`. If the control is on the container, the Parent will be the `container`. If the control is completed enclosed by another control, the Parent will be that `control`. > > If you do not want the enclosing control to be the parent, set the Parent property of that control to `Nil` to make it the `Window`. > > If the parent control is somehow in another window, an `InvalidParentException` will occur. > > The following example sets the parent of the control to the window. > > ``` xojo > Me.Parent = Nil > ```

forsearch

DesktopCanvas.ScaleFactor **ScaleFactor** As `Double` > The scale factor used when converting user space coordinates to backing store coordinates for the canvas.

forsearch

DesktopCanvas.Scope **Scope** As `Integer` > Used to determine whether access to the control is Public (0) or Private (2). The default is Public. > > This property is read-only. > >

> >

> > Note > >

> > This is a designtime-only property and thus can only be set in the Inspector and is not accessible via code. > >

> > If the Scope of a control is set to Private, it cannot be accessed from outside its parent window.

forsearch

DesktopCanvas.TabIndex **TabIndex** As `Integer` > The control's position in the Tab Order. The control with whose TabIndex is 0 will get the focus first. > > On macOS, only controls where you enter data from the keyboard typically get the focus. In order to manually set focus to controls that don't allow keyboard entry, go to System Preferences, click on the Keyboard icon then on the Shortcuts tab and then check the *Use keyboard navigation to move focus between controls* checkbox. > > This example sets the control's TabIndex. > > ``` xojo > Me.TabIndex = 2 > ```

forsearch

DesktopCanvas.Tooltip **Tooltip** As `String` > Text of help message displayed as a Windows or Linux "tooltip" or macOS help tag. > > The tip/tag is displayed when the user hovers the mouse cursor over the control. > > This example adds a tooltip to a control: > > ``` xojo > Me.Tooltip = "Click to bark." > ```

forsearch

DesktopCanvas.Top **Top** As `Integer` > The distance from the top of the control to the top of its containing window or container. > > This example sets the top of the control to 140 points from the top of the window: > > ``` xojo > Me.Top = 140 > ```

forsearch

DesktopCanvas.Transparent **Transparent** As `Boolean` > Determines whether the control is transparent on Windows. The default is `False`. Has no effect on macOS or Linux. > > Transparent controls draw more slowly and use more memory in order to cache the background. Unless you absolutely require transparency, leave this set to `False`. > > For projects that were created prior to 2018r1, this property defaults to `True` to emulate previous behavior. Consider changing it to `False` to improve performance if you do not require transparency.

forsearch

DesktopCanvas.Visible **Visible** As `Boolean` > Determines whether the control is visible when its owning window is opened. The default is `True`: the control is visible. > > The following code makes the control invisible: > > ``` xojo > Me.Visible = False > ```

forsearch

DesktopCanvas.Width **Width** As `Integer` > The width (in points) of the control. > > The following example resizes the control: > > ``` xojo > Me.Width = 200 > ```

forsearch

DesktopCanvas.Window **Window** As `DesktopWindow` > The control's parent window. > > This property is read-only. > > This code gets the parent window's Title property. > > ``` xojo > MessageBox(Me.Window.Title) > ``` ## Method descriptions

forsearch

DesktopCanvas.AcceptFileDrop **AcceptFileDrop**(FileType As `String`) > Permits documents of type *FileType* to be dropped on the control. *FileType* must be a file type that you defined in via the `FileType` class or the File Type Sets Editor. > > This code in the Opening event makes it possible for the user to drop either a picture or a file that is a jpeg image. The File Type Sets editor was used to define the “image/jpeg” file type. It is one of the “Common File Types” that is available in the editor. > > ``` xojo > Me.AcceptPictureDrop > Me.AcceptFileDrop("image/jpeg") > ``` > > To restrict file drops to specific file types on macOS, in addition to creating a File Type (as a `project item` or `via code`) to define the file extension, you must also use the `DragEnter` event: > > For example, to restrict drops to folders only: > > ``` xojo > If Not obj.FolderItem.IsFolder Then Return True > ``` > > To restrict drops to a files with a specific extension: > > ``` xojo > If Not obj.FolderItem.Extension <> ".my_extension" Then Return True > ```

forsearch

DesktopCanvas.AcceptPictureDrop **AcceptPictureDrop** > Permits `Picture` objects to be dropped on the control. This applies to pictures dragged from another control or application, not to image files dragged from the file system. To accept image files, use `AcceptFileDrop` instead. > > If a control should accept pictures in a drag and drop, then AcceptPictureDrop needs to be called prior to the drop. Typically, it is in the Opening event of the control itself. For example, the line: > > ``` xojo > Me.AcceptPictureDrop > ``` > > in the Opening event of the control that will receive the dragged pictures is needed. When the picture is dropped, the `DropObject` event is called and this is where you will put your code to handle the drop. > > Opening Event: > > ``` xojo > Me.AcceptPictureDrop > ``` > > DropObject Event: > > ``` xojo > If obj.PictureAvailable Then > Me.Backdrop = obj.Picture > End If > ``` > >

> >

> > Note > >

> > To prevent further drops after having called AcceptPictureDrop, return `True` in the `DragOver` event. > >

forsearch

DesktopCanvas.AcceptRawDataDrop **AcceptRawDataDrop**(Type As `String`) > Permits data (of the Type specified) to be dropped on the control. > > The following specfies a generic file type defined in the File Type Sets editor. > > ``` xojo > Me.AcceptRawDataDrop("????") > ```

forsearch

DesktopCanvas.AcceptTextDrop **AcceptTextDrop** > Permits text to be dropped on the control. > > This line in the Opening event of a control that can accept dragged text. > > ``` xojo > Me.AcceptTextDrop > ```

forsearch

DesktopCanvas.Close **Close** > Closes a control. > > Closing a control permanently removes the control from memory, making it impossible to access. You can close both non-indexed controls and indexed controls. When you close an indexed control, the indexes for the remaining controls will shift downward so that the indexes start with zero and are consecutive. > > The following code closes the control. When this is executed from a visible control, the control disappears from the window. > > ``` xojo > Me.Close > ```

forsearch

DesktopCanvas.DrawInto **DrawInto**(g As `Graphics`, x As `Integer`, y As `Integer`) > Draws the contents of the control into the specified `Graphics` context. The parameters *x* and *y* are the coordinates of the top, left corner. > >

> >

> > Note > >

> > DrawInto will only work if the control is on a window or container. > >

> > This example draws the current control into the Graphics of a Picture and then displays it as the Backdrop of a Canvas: > > ``` xojo > Var p As New Picture(Me.Width, Me.Height) > Me.DrawInto(p.Graphics, 0, 0) > Canvas1.Backdrop = p > ```

forsearch

DesktopCanvas.Refresh **Refresh**(immediately As `Boolean` = `False`) > Redraws the portion specified of the contents of the control the next time the OS redraws the control or immediately if `True` is passed. > > If you are calling this so frequently that you experience a slowdown in your code, pass `True` for the immediately parameter. > > Calling this method causes the Render event to fire. > > Refresh the entire area immediately: > > ``` xojo > Me.Refresh(True) > ``` ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

forsearch

DesktopCanvas.Refresh **Refresh**(x As `Integer`, y As `Integer`, width As `Integer`, height As `Integer`, immediately As `Boolean` = `False`) > Redraws the portion specified of the contents of the control the next time the OS redraws the control or immediately if `True` is passed. > > Refresh a portion of the area the next time the OS redraws the control: > > ``` xojo > Me.Refresh(100, 150, 200, 300) > ```

forsearch

DesktopCanvas.Scroll **Scroll**(dx As `Integer`, dy As `Integer`, x As `Integer` = 0, y As `Integer` = 0, width As `Integer` = -10000, height As `Integer` = -10000, moveControls As `Boolean` = `True`) > Scrolls the Canvas contents according to the passed parameters. > > *dx* and *dy* are the number of points to scroll horizontally and vertically relative to the current position of the picture in the DesktopCanvas control. Positive values scroll right and down while negative values scroll left and up. The *x*, *y*, *width,* and *height* parameters specify the portion of the picture to be scrolled. If these are not passed, the entire picture will be scrolled. *moveControls* indicates whether controls positioned on top of the DesktopCanvas control should be scrolled as well. *moveControls* is `True` by default. > > To use the Scroll method to scroll the contents of a DesktopCanvas 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. This can be done by adding properties to the window that contains the DesktopCanvas 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. > > If the *moveControls* parameter is `True`, any controls on top of the DesktopCanvas control will also be scrolled. This allows the implementation of a scrolling pane of controls. > > The following example scrolls a picture that was added to the project. The properties XScroll and YScroll have been added to the window to hold the amounts the picture has been scrolled. The picture is scrolled 8 points at a time. In the Keydown event of the window, the following code calls the Scroll method whenever the Up, Down, Left, or Right arrow keys are pressed. > > ``` xojo > Const LeftArrow = 28 > Const RightArrow = 29 > Const UpArrow = 30 > Const DownArrow = 31 > Const ScrollUnit = 8 ' points > > Select Case Key.Asc > Case LeftArrow > XScroll = XScroll + ScrollUnit > Canvas1.Scroll(ScrollUnit, 0) > > Case RightArrow > XScroll = XScroll - ScrollUnit > Canvas1.Scroll(-ScrollUnit, 0) > > Case UpArrow > YScroll = YScroll + ScrollUnit > Canvas1.Scroll(0, ScrollUnit) > > Case DownArrow > YScroll = YScroll - ScrollUnit > Canvas1.Scroll(0, -ScrollUnit) > > End Select > ``` > > The Scroll method calls the Paint event of the canvas that redraws the picture with the new values of XScroll and YScroll. The Paint event has the following line of code: > > ``` xojo > g.DrawPicture(myPicture, XScroll, YScroll) > ```

forsearch

DesktopCanvas.SetFocus **SetFocus** > If applicable, sets the focus to the DesktopUIControl. KeyDown events are directed to the control. > > If the control cannot get the focus on the platform on which the application is running, SetFocus does nothing. The SetFocus method of the `DesktopWindow` class or the `ClearFocus` method can be used to remove the focus from the control that currently has the focus, leaving no control with the focus. > >

> >

> > Note > >

> > On macOS, you need Full Keyboard Access turned on in System Preferences (Keyboard-\>Shortcuts) in order to manually set focus to non-text controls. > >

> > The following example in the Opening event sets the focus to the that control. If another control has the focus when this line is executed, then the user sees this control gets the focus. > > ``` xojo > Me.SetFocus > ``` ## Event descriptions

forsearch

DesktopCanvas.Activated **Activated** > The control is activated. In a single window interface, the Activate event fires when the parent window is activated. See the `DesktopApplication` and `DesktopWindow` Activate events. > > This can be because the app is launched or a window belonging to another app is no longer frontmost (active). The Deactivate event fires when another window becomes active. In a single window interface, the Activate event fires when the window is activated, e.g., when the app first displays the window.

forsearch

DesktopCanvas.Closing **Closing** > The control is closing.

forsearch

DesktopCanvas.ConstructContextualMenu **ConstructContextualMenu**(Base As `DesktopMenuItem`, x As `Integer`, y As `Integer`) As `Boolean` > This event is called when it is appropriate to display a contextual menu for the control. > > This event handler is the recommended way to handle contextual menus because this event figures out whether the user has requested the contextual menu, regardless of how they did it. Depending on platform, it might be in the `MouseUp` or `MouseDown` event and it might be a right+click or by pressing the contextual menu key on the keyboard, for example. > > *Base* is analogous to the menu bar for the contextual menu. Any items you add to *Base* will be shown as menu items. If you return `False`, the event is passed up the parent hierarchy. > > If you return `True`, the contextual menu is displayed. The parameters *x* and *y* are the mouse locations. If the event was fired because of a non-mouse event, then *x* and *y* are both set to -1. See the example of a contextual menu in the following section. > > The following ConstructContextualMenu event handler builds a menu with three menu items plus a submenu with three additional menu items. > > ``` xojo > ' Add some items > base.AddMenu(New DesktopMenuItem("Test 1")) > base.AddMenu(New DesktopMenuItem("Test 2")) > base.AddMenu(New DesktopMenuItem("Test 3")) > > ' Add a Separator > base.AddMenu(New DesktopMenuItem(DesktopMenuItem.TextSeparator)) > > ' Add a sub menu > Var submenu As New DesktopMenuItem("SubMenu") > submenu.AddMenu(New DesktopMenuItem("SubMenu Test 1")) > submenu.AddMenu(New DesktopMenuItem("SubMenu Test 2")) > submenu.AddMenu(New DesktopMenuItem("SubMenu Test 3")) > base.AddMenu(submenu) > > ' Add a Separator > base.AddMenu(New DesktopMenuItem(DesktopMenuItem.TextSeparator)) > > Return True > ```

forsearch

DesktopCanvas.ContextualMenuItemSelected **ContextualMenuItemSelected**(HitItem As `DesktopMenuItem`) As `Boolean` > Fires when a contextual menuitem *selectedItem* was selected but the `MenuItemSelected` event and the MenuHandler for the `DesktopMenuItem` did not handle the menu selection. > > This event gives you a chance to handle the menu selection by inspecting the menuitem's Text or Tag properties to see which item was selected. Use this in conjunction with ConstructContextualMenu if you have not specified the `MenuItemSelected` event or the Menu Handler for the items on the contextual menu. See the example of a contextual menu in the examples for the **DesktopUIControl** class. > > `Return` `True` if this event has handled the item the user chose from the contextual menu. Returning `False` will cause the control's parent to execute its ContextualMenuItemSelected event. This can be handy if you have the same contextual menu for several controls who share the same `Parent` (several on the same window for example). By returning `False` you can handle them all in a single event. > > This simple event handler displays the value of the selected menu item. > > ``` xojo > If selectedItem <> Nil Then MessageBox(selectedItem.Text) > Return True > ```

forsearch

DesktopCanvas.Deactivated **Deactivated** > The DesktopCanvas is deactivated. See the `DesktopApplication` and `DesktopWindow` Deactivated events. > > In a multiple window interface, the Deactivated event fires when the parent window is deactivated because another window has been brought to the front or a window belonging to another app becomes frontmost. In a single window app, the Deactivated event fires when a window belonging to another app becomes frontmost.

forsearch

DesktopCanvas.DoublePressed **DoublePressed**(X As `Integer`, Y As `Integer`) > The user has double-pressed (clicked or tapped) at the passed coordinates (in pixels). The coordinates are relative to the top-left (0,0) point of the DesktopCanvas. This event fires even if you return `True` from the `MouseDown` event.

forsearch

DesktopCanvas.DragEnter **DragEnter**(obj As `DragItem`, Action As `DragItem.Types`) As `Boolean` > Fires when the passed `DragItem` enters the DesktopUIControl. > > Returns a `Boolean`. Return `True` from this event to prevent the drop from occurring. > > The Action parameter specifies the type of drag action. > > To restrict file drops to just folders (and not files), you can put this code in the DragEnter event: > > ``` xojo > If Not obj.FolderItem.IsFolder Then Return True > ```

forsearch

DesktopCanvas.DragExit **DragExit**(obj As `DragItem`, Action As `DragItem.Types`) > Fires when the passed `DragItem` exits the DesktopUIControl. > > The *obj* parameter is the item being dragged. The *Action* parameter specifies the type of drag action.

forsearch

DesktopCanvas.DragOver **DragOver**(x As `Integer`, y As `Integer`, obj As `DragItem`, Action As `DragItem.Types`) As `Boolean` > Fires when the `DragItem` is over the DesktopUIControl. > > The *obj* parameter is the object being dragged. The coordinates x and y are relative to the **DesktopUIControl**. Returns a `Boolean`. Return `True` from this event to prevent the drop from occurring. > > The *Action* parameter specifies the type of drag action, which is typically done by holding down a modifier key (Shift, Alt, Option, Command, etc.) while doing the drag.

forsearch

DesktopCanvas.DrawControlInLayoutEditor **DrawControlInLayoutEditor**(g As `Graphics`) > This event allows you to draw a preview of your control in the Layout Editor, similar to how the control will look like in at runtime. As this code will run as a script in the IDE, if it doesn't compile for any reason, you will see what happened in the Messages pane. > > This event fires whenever your control needs to be drawn in the Layout Editor. > > There is no need to re-open the project or restart the IDE, in order to see changes you make to the code in this event. > > For more information of how this works, see `Drawing Your Control`.

forsearch

DesktopCanvas.DropObject **DropObject**(Obj As `DragItem`, Action As `DragItem.Types`) > The item represented by *Obj* has been dropped on the control. > > The *Obj* parameter is the object being dragged. The *Action* parameter specifies the type of drag action. > > The following DropObject event handler can handle either a dropped picture or a dropped file. The type of file that it can handle needs to have been specified in a call to AcceptFileDrop prior to the drop, for example, in the Opening event. > > ``` xojo > If Obj.PictureAvailable Then > Me.Image = obj.Picture > ElseIf Obj.FolderItemAvailable Then > Me.Image = Picture.Open(obj.FolderItem) > End If > ```

forsearch

DesktopCanvas.FocusLost **FocusLost** > The `control` has lost the focus. > >

> >

> > Note > >

> > On macOS, controls other than text fields and lists will accept and lose focus only if the full keyboard access option is enabled in System Preferences/Keyboard. > >

forsearch

DesktopCanvas.FocusReceived **FocusReceived** > The `control` has received the focus and has a selection rectangle around it. > >

> >

> > Note > >

> > On macOS, controls other than text fields and lists will accept focus only if the full keyboard access option is enabled in System Preferences/Keyboard. > >

forsearch

DesktopCanvas.KeyDown **KeyDown**(Key As `String`) As `Boolean` > The user has pressed the *Key* passed while the `control` has the focus. > > Returning `True` prevents the KeyDown event on the parent control (usually the window) from executing. Returning `False` results in the execution of the KeyDown event of the parent control.

forsearch

DesktopCanvas.KeyUp **KeyUp**(Key As `String`) > Fires when the passed *Key* is released in the control that has the focus. > > It is not guaranteed to be the same key that received the KeyDown event.

forsearch

DesktopCanvas.MenuBarSelected **MenuBarSelected** > The DesktopCanvas control has received the focus. Menu handlers are invoked if the DesktopCanvas control has the focus. > > This event is only for use with menu items where you have set the `DesktopMenuItem.AutoEnabled` property to `False`. Otherwise, menu items are automatically enabled and disabled.

forsearch

DesktopCanvas.MouseDown **MouseDown**(X As `Integer`, Y As `Integer`) As `Boolean` > The mouse button was pressed inside the control's region at the location passed in to *x*, *y*. > > This event fires repeatedly while the mouse button is being held down. > > The coordinates *x* and *y* are local to the control, i.e. they represent the position of the mouse click relative to the upper-left corner of the `control`. > > `Return` `True` if you are going to handle the MouseDown. In such a case: > > - The Pressed event, if any, will not execute and the state of the object will not change. > - You will receive the `MouseUp` event. > > If you return False, the system handles the MouseDown so the `MouseUp` event handler does not get called. > > The MouseDown event uses the `DragItem` constructor when the user drags the contents of the control. It is: > > ``` xojo > Var d As DragItem > d = New DragItem(Self, Me.Left, Me.Top, Me.Width, Me.Height) > d.Picture = Me.Image > d.Drag ' Allow the drag > ```

forsearch

DesktopCanvas.MouseDrag **MouseDrag**(X As `Integer`, Y As `Integer`) > The mouse button was pressed inside the control and moved (dragged) at the location local to the control passed in to *x*, *y*. > > This event fires repeatedly while the mouse button is down regardless of whether or not the mouse coordinates are changing. > > This event will not occur unless you return `True` in the MouseDown event.

forsearch

DesktopCanvas.MouseEnter **MouseEnter** > The mouse has entered the area of the control.

forsearch

DesktopCanvas.MouseExit **MouseExit** > The mouse has left the area of the control.

forsearch

DesktopCanvas.MouseMove **MouseMove**(X As `Integer`, Y As `Integer`) > The mouse has moved within the control to the coordinates passed. The coordinates are local to the control, not to the window.

forsearch

DesktopCanvas.MouseUp **MouseUp**(X As `Integer`, Y As `Integer`) > The mouse button was released. Use the *x* and *y* parameters to determine if the mouse button was released within the control's boundaries. > >

> >

> > Note > >

> > This event will not occur unless you return `True` in the MouseDown event. The return value is ignored. > >

> > The parameters *x* and *y* are local coordinates, i.e. they represent the position of the mouse click relative to the upper-left corner of the `control`. Mouse clicks that are released to the left or above a control are negative.

forsearch

DesktopCanvas.MouseWheel **MouseWheel**(X As `Integer`, Y As `Integer`, DeltaX As `Integer`, DeltaY As `Integer`) As `Boolean` > The mouse wheel has been moved. > > The parameters *X* and *Y* are the mouse coordinates relative to the control that has received the event. The parameters *DeltaX* and *DeltaY* hold the number of scroll lines the wheel has been moved horizontally and vertically, as defined by the operating system. *DeltaX* is positive when the user scrolls right and negative when scrolling to the left. *DeltaY* is positive when the user scrolls down and negative when scrolling up. > > Returns a `Boolean`. Return `True` to prevent the event from propagating further.

forsearch

DesktopCanvas.Opening **Opening** > The control is about to be displayed. Use this event to initialize a control. > > The Opening event is called after the Constructor. > > Be warned that initializing control property values using the Constructor instead of the Opening event may result in those property values being overwritten by what is set in the Inspector. For best results, use the Opening event for control initialization rather than the control Constructor. > > If the control is supposed to handle drag and drop, you need to tell it which type of item it needs to be able to handle. The following example informs the control that pictures and files can be dropped on it. The type of the file it needs to support is specified via the File Types Editor. > > ``` xojo > Sub Opening() > Me.AcceptPictureDrop > Me.AcceptFileDrop("JPEG") > End Sub > ```

forsearch

DesktopCanvas.Paint **Paint**(g As `Graphics`, areas() As `Rect`) > The area needs to be redrawn, such as when it has been covered by another window and then uncovered. Use the g parameter for all drawing. The areas parameter contains the areas of the Canvas that need redrawing. If areas is empty then the entire Canvas needs to be redrawn. > > This code draws a 3D rectangle with a raised look: > > ``` xojo > Const White = &cffffff > Const DarkGray = &c8c8c8c > Const LightGray = &cefefef > > g.DrawingColor = White > g.DrawLine(1, 1, Me.Width, 1) > g.DrawLine(1, Me.Height - 1, 1, 1) > g.DrawingColor = DarkGray > g.DrawLine(Me.Width - 1, 2, Me.Width - 1, Me.Height) > g.DrawLine(1, Me.Height - 1, Me.Width, Me.Height - 1) > > //fill in the light gray rectangle > g.DrawingColor = LightGray > g.FillRectangle(2, 2, Me.Width - 3, Me.Height - 3) > ``` > > This code uses the Paint event handler of a DesktopCanvas control to draw the text "The quick brown fox" in Helvetica bold, italic, 18 point, 50 points from the top of and 10 points from the left side of the control: > > ``` xojo > g.Bold = True > g.Italic = True > g.FontName = "Helvetica" > g.FontSize = 18 > g.DrawText("The quick brown fox", 10, 50) > ``` > > This code assigns the color of a particular point in a DesktopCanvas control to a variable: > > ``` xojo > Var c As Color > c = g.Pixel(10, 10) > ``` > > This code sets a particular point of a DesktopCanvas control to a specific RGB value: > > ``` xojo > g.Pixel(10, 10) = Color.RGB(100, 105, 225) > ``` > > This is code draws a triangle in a DesktopCanvas. It is placed in the Paint event. The parameter g as `Graphics` is passed into this event: > > ``` xojo > Var points(6) As Integer > > points(1) = 10 ' X of Point 1 > points(2) = 10 ' Y of Point 1 > points(3) = 75 ' X of Point 2 > points(4) = 30 ' Y of Point 2 > points(5) = 10 ' X of Point 3 > points(6) = 125 ' Y of Point 3 > > Var path As New GraphicsPath > > path.MoveToPoint(points(1), points(2)) > path.AddLineToPoint(points(3), points(4)) > path.AddLineToPoint(points(5), points(6)) > > g.DrawingColor = Color.RGB(100, 200, 255) > g.DrawPath(path, True) > ``` > > This code uses the Clip method to define child `Graphics` items within the parent DesktopCanvas. The code is in the Paint event of a DesktopCanvas. The two clippings define regions at the top of the canvas and the DrawOval method draws object in each one. Notice that the first call tries to draw an oval that is wider than the region. It is truncated in the drawing. > > ``` xojo > Var myClip As Graphics = g.Clip(0, 0, 150, 15) > Var myClip2 As Graphics = g.Clip(150, 0, 150, 15) > > ' draw the border of the Canvas.. > g.DrawingColor = &c000000 > g.DrawRectangle(0, 0, g.Width, g.Height) > > ' draw into the first area... > myClip.DrawingColor = &cff0000 > myClip.DrawRectangle(0, 0, myClip.Width, myClip.Height) ' draw the border of the area.. > myClip.DrawOval(0, 0, 200, 15) ' the oval does not appear outside the region despite the call > > ' draw into the second area... > myClip2.DrawingColor = &c0000ff > myClip2.DrawRectangle(0, 0, myClip2.Width, myClip2.Height) ' draw the border of the area > myClip2.DrawOval(0, 0, 150, 15) > ``` > > This simple DesktopCanvas control changes from black to white when you click on it. > > Drag a DesktopCanvas control into a window. Add a Boolean property (mBlack) to the Window. This is used toggle the color of the DesktopCanvas when it is clicked. > > The code for the DesktopCanvas MouseDown event handler looks like this: > > ``` xojo > Function MouseDown(X As Integer, Y As Integer) As Boolean > mBlack = Not mBlack ' Toggle the color > > Me.Refresh(False) ' Tell the Canvas to draw itself > End Function > ``` > > This code toggles the mBlack value when the DesktopCanvas is clicked and then tells the Canvas to redraw itself. In the Paint event handler, you draw the rectangle setting the color based on the value of mBlack: > > ``` xojo > If mBlack Then > g.DrawingColor = &c000000 > Else > g.DrawingColor = &cffffff > End If > > g.FillRectangle(0, 0, g.Width, g.Height) > ``` > > Add the following functions to a class or module: > > ``` xojo > Function IsWithinRect(left As Integer, top As Integer, width As Integer, height As Integer, rectangle As Rect) As Boolean > left = Max (left, rectangle.Left) > top = Max (top, rectangle.Top) > Var right As Integer = Min(left + width, rectangle.Left + rectangle.Width) > Var bottom As Integer = Min(top + height, rectangle.Top + rectangle.Height) > > Return (left < right) And (top < bottom) > End Function > > Function IsWithinRects(left As Integer, top As Integer, width As Integer, height As Integer, rects() As Rect) As Boolean > For Each r As Rect In rects > If IsWithinRect(left, top, width, height, r) Then > Return True > End If > Next > End Function > ``` > > With that, you can test if an object you want to draw within a particular position needs drawing at all, possibly speeding up the drawing process: > > ``` xojo > ' Draw an image at position 100 / 100, but only if needed > If areas.LastIndex < 0 Or IsWithinRects(100, 100, theImage.Width, theImage.Height, areas) Then > g.DrawPicture(theImage, 100, 100) > End If > ```

forsearch

DesktopCanvas.ScaleFactorChanged **ScaleFactorChanged** > The backing store scale factor has changed and the canvas should refresh any cached bitmaps or other relevant state. > > If you have an Image Set with multiple images for HiDPI and want to split out each of the pictures it contains, you can do so like this: > > ``` xojo > Var g As Graphics > Var p, pics() As Picture > > ' Break the Image into its component pictures > ' Also copy the horizontal/vertical resolution and scale factors > ' so that the pictures draw properly when used later. > For i As Integer = 0 To MyImageSet.ImageCount - 1 > p = New Picture(MyImageSet.ImageAt(i).Width, MyImageSet.ImageAt(i).Height) > p.HorizontalResolution = MyImageSet.ImageAt(i).HorizontalResolution > p.VerticalResolution = MyImageSet.ImageAt(i).VerticalResolution > pics.Add(p) > g = p.Graphics > g.ScaleX = p.HorizontalResolution / 72 > g.ScaleY = p.VerticalResolution / 72 > g.DrawPicture(MyImageSet.ImageAt(i), 0, 0) > Next > ``` > > If you later modify the pictures in the array and want to recreate it as an image, you can do so using the constructor like this: > > ``` xojo > ' Recreate the image from the component pictures > p = New Picture(MyImageSet.Width, MyImageSet.Height, pics) > ``` ## Drawing Your Control As for Xojo 2026r1 DesktopCanvas has the ability to draw itself in the Layout Editor using the same techniques that you use to draw a control in the Paint event of a Canvas control with one important difference: this event has access to the Properties and Constants of your class. To draw a preview of your control in the Layout Editor, you must implement the DrawControlInLayoutEditor event. You may wish to implement it even if you're not using it to prevent this event from being available to the end users of your control. Most of the Xojo framework itself is not available in this event. If the code you have placed in the event can't compile or runs into a runtime issue, an amber warning icon will be drawn on your control and the errors will be displayed to the Messages pane.

Important

Methods cannot be called in this event.

Here's an example of how you would draw a red oval within the bounds of the control: ``` xojo g.DrawingColor = Color.Red g.DrawOval(0, 0, g.Width, g.Height) ``` In addition to the standard drawing controls, there are also some methods for accessing the properties and constants in your control. ### Property Methods **BooleanProperty**(Name as String) as Boolean > Gets the current value of a Boolean property of your control. --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- **ColorProperty**(name As `String`) As `Color` > Gets the current value of a Color property of your control. --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- **DoubleProperty**(name As `String`) As `Double` > Gets the current value of a Double property of your control. --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- **IntegerProperty**(name As `String`) As `Integer` > Gets the current value of an Integer property of your control. --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- **PictureProperty**(name As `String`) As `Picture` > Gets the current value of a Picture property of your control. --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- **StringProperty**(name As `String`) As `String` > Gets the current value of a String property of your control. ### Constant Methods --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- **ConstantValue**(name As `String`) As `String` > Gets the value of a constant in your control as a String. > > You can use the ConstantValue of a string stored in a constant, such as "kDescription".: > > ``` xojo > Var s As String = ConstantValue("kDescription") > g.DrawText(s, 25, 25) > ``` --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- **PictureConstant**(name As `String`) As `Picture` > Gets the value of a constant in your control as a Picture. > > You can use PictureConstant with the Base64 value (without the type header) of a picture stored in a constant, such as "kIcon": > > ``` xojo > Var icon As Picture = PictureConstant("kIcon") > g.DrawPicture(icon, 0, 0) > ``` ### Color Methods **ColorGroup.NamedColor**(name As `String`) As `Color` > When running on a platform that supports named colors (only macOS at the time of this writing), this method returns the named OS. > >

> >

> > Note > >

> > Color names are case sensitive, so the macOS secondary label color should be "secondaryLabelColor". > >

--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- **TextColor** As `Color` > Returns the current text color of the platform that the IDE is running on. --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- **FillColor** As `Color` > Returns the current fill color of the platform that the IDE is running on. --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- **IsDarkMode** As `Boolean` > Returns `True` if the system is running in dark mode (only macOS at the time of this writing). ### Font Methods **FontCount** As `Integer` > Returns the number of fonts available on the system. --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- **FontAt**(index As `Integer`) As `String` > Returns the name of the font at the specified *index*. ### Other Methods **DebugLog**(msg As `String`) > Sends *msg* to the Messages pane. **Print**(msg As `String`) > Sends *msg* to the Messages pane. ## Notes Coordinates passed to DesktopCanvas events are local to the DesktopCanvas object. To use the Scroll method to scroll the picture in a DesktopCanvas 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. This can be done by adding properties to the window that contains the DesktopCanvas control or by creating a new class based on the DesktopCanvas control that contains properties to hold the last X scroll amount and last Y scroll amount. If the ScrollControls parameter is `True`, any controls on top of the Canvas control will also be scrolled. This allows the implementation of a scrolling pane of controls. The following example scrolls a picture that was added to the project. The properties XScroll and YScroll have been added to the window to hold the amounts the picture has been scrolled. The picture is scrolled 8 points at a time. In the Keydown event of the window, the following code calls the Scroll method whenever the Up, Down, Left, or Right arrow keys are pressed. ``` xojo Const LeftArrow = 28 Const RightArrow = 29 Const UpArrow = 30 Const DownArrow = 31 Const ScrollUnit = 8 ' points Select Case Key.Asc Case LeftArrow XScroll = XScroll + ScrollUnit Canvas1.Scroll ScrollUnit, 0 Case RightArrow XScroll = XScroll - ScrollUnit Canvas1.Scroll -ScrollUnit, 0 Case UpArrow YScroll = YScroll + ScrollUnit Canvas1.Scroll 0, ScrollUnit Case DownArrow YScroll = YScroll - ScrollUnit Canvas1.Scroll 0, -ScrollUnit End Select ``` The Scroll method calls the Paint event of the canvas that redraws the picture with the new values of XScroll and YScroll. The Paint event has the following line of code: ``` xojo g.DrawPicture(myPicture, XScroll, YScroll) ``` ## Sample code This code in the Paint event handler draws a simple red line: ``` xojo g.DrawingColor = &cff0000 g.DrawLine(0, 10, 100, 100) ``` --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- To draw a picture in a Canvas, use this code in the Paint event: ``` xojo g.DrawPicture(PictureAddedToProject, 0, 0) ``` --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- This code (in the Paint event) draws a 3D rectangle with a raised look. ``` xojo Const White = &cffffff Const DarkGray = &c8c8c8c Const LightGray = &cefefef g.DrawingColor = White g.DrawLine(1, 1, Me.Width, 1) g.DrawLine(1, Me.Height - 1, 1, 1) g.DrawingColor = DarkGray g.DrawLine(Me.Width - 1, 2, Me.Width - 1, Me.Height) g.DrawLine(1, Me.Height - 1, Me.Width, Me.Height - 1) //fill in the light gray rectangle g.DrawingColor = LightGray g.DrawFilledRectangle(2, 2, Me.Width - 3, Me.Height - 3) ``` --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- This code draws a gradient from Red to Blue: ``` xojo Var startColor As Color = &cff0000 Var endColor As Color = &c0000ff Var p As New Picture(g.Width, g.Height) Var samt, eamt As Double For i As Integer = 0 To p.Height samt = 1 - (i / p.Height) eamt = i / p.Height p.Graphics.DrawingColor = Color.RGB((startColor.Red * samt) + (endColor.Red * eamt), _ (startColor.Green *samt) + (endColor.Green * eamt), _ (startColor.Blue * samt) + (endColor.Blue * eamt)) p.Graphics.DrawLine(-1, i, p.Width + 1, i) Next g.DrawPicture(p, 0, 0) ``` --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- This code assigns a picture that has been added to the Project Editor to the Backdrop property in the Opening event: ``` xojo Me.Backdrop = OSLogo ``` --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- You can use the methods of the `Graphics` class to modify the picture in any way you like. For example, the following code in the object's Paint event handler adds a caption to the picture: ``` xojo g.FontName = "Arial" g.FontSize = 14 g.DrawingColor = &c0080C0 g.DrawText("Mary Jane", 10, 100) ``` --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- If you instead assigned the graphic to the BackDrop property using the `Picture` constructor, as shown below, you could manipulate the graphic at the pixel level using the RGBSurface property of the `Picture` object. ``` xojo Me.Backdrop = New Picture(210, 30) Me.Backdrop.Graphics.DrawPicture(YourAppLogo, 0, 0) ``` --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- See also the examples for the `DesktopControl` class, which give an example of dragging from a Canvas control and the `DesktopImageViewer` class example, which show drag and drop to and from the `DesktopImageViewer`.Image property. Unfortunately, a Focus Ring does not appear on Windows or Linux when a DesktopCanvas control gets the focus, but the FocusReceived and FocusLost events fire normally. You can easily use them to simulate a focus ring. Create a property on the window called mHasFocus As Boolean. In the FocusReceived event handler: ``` xojo mHasFocus = True Canvas1.Refresh(False) ``` --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- In the FocusLost event handler: ``` xojo mHasFocus = False Canvas1.Refresh ``` --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- In the Paint event handler for Canvas1: ``` xojo #If TargetWindows Or TargetLinux Then If mHasFocus Then g.DrawingColor = Color.HighlightColor ' or Color.FrameColor, whichever you wish g.DrawRectangle(0, 0, Me.Width - 1, Me.Height - 1) Else g.DrawingColor = Color.RGB(178, 178, 178) ' gray g.DrawRectangle(0, 0, Me.Width - 1, Me.Height - 1) End If #EndIf ``` ## Compatibility | | | |-----------------------|---------| | **Project Types** | Desktop | | **Operating Systems** | All |

`DesktopUIControl` parent class; `Graphics`, `Picture` classes