# scolling canvases on canvase - windows

**URL:** <https://forum.xojo.com/t/scolling-canvases-on-canvase-windows/27027>\
**Category:** General\
**Created:** [October 3, 2015, 8:32am UTC](https://forum.xojo.com/t/scolling-canvases-on-canvase-windows/27027 "2015-10-03T08:32:46Z")\
**Posts on this page:** 10\
**Page:** 1

<div class="post-metadata">

**Author:** ![Sean\_Clancy](https://forum.xojo.com/user_avatar/forum.xojo.com/sean_clancy/32/775_2.png) [@Sean\_Clancy](https://forum.xojo.com/u/Sean_Clancy)\
**Post date:** [October 3, 2015, 8:32am UTC](https://forum.xojo.com/t/scolling-canvases-on-canvase-windows/27027/1 "2015-10-03T08:32:46Z")

</div>

Hi there. I have a canvas. On top of the canvas i have run-time generated other canvases (a control array)…  
The idea is that I can click on the canvases which will do a method to draw graphics into the picture that fit inside the square of the new canvas.  
I’ve got the example based scrolling going on. This is working well in regards to the actual picture.

in the paint of this canvas I have:  
g.DrawPicture(ChordDiagram,0,0-YScroll)

However, I can seem to get the new canvases to scroll relative to the picture. They go out of skew. I’ve tried all sorts of workarounds.

For fun I chucked a button onto the canvas… it scrolled just fine (relative to the picture.)  
Canvases are controls as well - shouldn’t they scroll as well as the button?  
What am I missing?  
Cheers

---

<div class="post-metadata">

**Author:** ![Michel\_Bujardet](https://forum.xojo.com/user_avatar/forum.xojo.com/michel_bujardet/32/252_2.png) [@Michel\_Bujardet](https://forum.xojo.com/u/Michel_Bujardet)\
**Post date:** [October 3, 2015, 9:34am UTC](https://forum.xojo.com/t/scolling-canvases-on-canvase-windows/27027/2 "2015-10-03T09:34:05Z")

</div>

[quote=217796:@Sean Clancy]Hi there. I have a canvas. On top of the canvas i have run-time generated other canvases (a control array)…  
The idea is that I can click on the canvases which will do a method to draw graphics into the picture that fit inside the square of the new canvas.  
I’ve got the example based scrolling going on. This is working well in regards to the actual picture.

in the paint of this canvas I have:  
g.DrawPicture(ChordDiagram,0,0-YScroll)

However, I can seem to get the new canvases to scroll relative to the picture. They go out of skew. I’ve tried all sorts of workarounds.

For fun I chucked a button onto the canvas… it scrolled just fine (relative to the picture.)  
Canvases are controls as well - shouldn’t they scroll as well as the button?  
What am I missing?  
Cheers[/quote]

Have you made sure to set the scrolling canvas as parent of the one you dynamically added ?

```auto
thatCanvas.Parent = ScrollingCanvas
```

---

<div class="post-metadata">

**Author:** ![Sean\_Clancy](https://forum.xojo.com/user_avatar/forum.xojo.com/sean_clancy/32/775_2.png) [@Sean\_Clancy](https://forum.xojo.com/u/Sean_Clancy)\
**Post date:** [October 3, 2015, 10:39am UTC](https://forum.xojo.com/t/scolling-canvases-on-canvase-windows/27027/3 "2015-10-03T10:39:39Z")

</div>

I think helped a lot. Now… the probem now is that the actual canvases which I click on are not moving up with the picture… Should I move the canvas.tops up? My picture is right at the top of the window…  
I did set the parent of the runtime canvases to my main canvas.

---

<div class="post-metadata">

**Author:** ![Michel\_Bujardet](https://forum.xojo.com/user_avatar/forum.xojo.com/michel_bujardet/32/252_2.png) [@Michel\_Bujardet](https://forum.xojo.com/u/Michel_Bujardet)\
**Post date:** [October 3, 2015, 11:22am UTC](https://forum.xojo.com/t/scolling-canvases-on-canvase-windows/27027/4 "2015-10-03T11:22:28Z")

</div>

[quote=217819:@Sean Clancy]I think helped a lot. Now… the probem now is that the actual canvases which I click on are not moving up with the picture… Should I move the canvas.tops up? My picture is right at the top of the window…  
I did set the parent of the runtime canvases to my main canvas.[/quote]

This is becoming confuse. Canvas over canvas. Which one and what is it supposed to do ?

---

<div class="post-metadata">

**Author:** ![Markus\_Winter](https://forum.xojo.com/user_avatar/forum.xojo.com/markus_winter/32/144_2.png) [@Markus\_Winter](https://forum.xojo.com/u/Markus_Winter)\
**Post date:** [October 3, 2015, 12:18pm UTC](https://forum.xojo.com/t/scolling-canvases-on-canvase-windows/27027/5 "2015-10-03T12:18:33Z")

</div>

Are you actually embedding the canvases in the ScrollingCanvas (so they become part of it) or just layering them on top (in which case the scrolling has no effect on them)?

Look for embedWithin 

Also look at ContainerControls as the technique is well described there. Read Bob’s blog post

[http://www.bkeeneybriefs.com/2014/02/container-control-love/](http://www.bkeeneybriefs.com/2014/02/container-control-love/)

Paul has a webinar which might be helpful.

[http://www.youtube.com/watch?v=wMhaX0ZCK5A](http://www.youtube.com/watch?v=wMhaX0ZCK5A)

---

<div class="post-metadata">

**Author:** ![Markus\_Winter](https://forum.xojo.com/user_avatar/forum.xojo.com/markus_winter/32/144_2.png) [@Markus\_Winter](https://forum.xojo.com/u/Markus_Winter)\
**Post date:** [October 3, 2015, 12:49pm UTC](https://forum.xojo.com/t/scolling-canvases-on-canvase-windows/27027/6 "2015-10-03T12:49:59Z")

</div>

Ignore what I wrote. Can’t delete it for some reason.

---

<div class="post-metadata">

**Author:** ![Greg\_O\_Lone](https://forum.xojo.com/user_avatar/forum.xojo.com/greg_o_lone/32/49_2.png) [@Greg\_O\_Lone](https://forum.xojo.com/u/Greg_O_Lone)\
**Post date:** [October 3, 2015, 2:44pm UTC](https://forum.xojo.com/t/scolling-canvases-on-canvase-windows/27027/7 "2015-10-03T14:44:07Z")

</div>

[quote=217796:@Sean Clancy]Hi there. I have a canvas. On top of the canvas i have run-time generated other canvases (a control array)…  
The idea is that I can click on the canvases which will do a method to draw graphics into the picture that fit inside the square of the new canvas.  
I’ve got the example based scrolling going on. This is working well in regards to the actual picture.

in the paint of this canvas I have:  
g.DrawPicture(ChordDiagram,0,0-YScroll)

However, I can seem to get the new canvases to scroll relative to the picture. They go out of skew. I’ve tried all sorts of workarounds.

For fun I chucked a button onto the canvas… it scrolled just fine (relative to the picture.)  
Canvases are controls as well - shouldn’t they scroll as well as the button?  
What am I missing?  
Cheers[/quote]  
Make sure the subcanvases are completely within the bounds of the outer one. You might also want to consider just using the Graphics.Clip in the paint event of the outer canvas and do away with all of the subcanvases.

---

<div class="post-metadata">

**Author:** ![Sean\_Clancy](https://forum.xojo.com/user_avatar/forum.xojo.com/sean_clancy/32/775_2.png) [@Sean\_Clancy](https://forum.xojo.com/u/Sean_Clancy)\
**Post date:** [October 5, 2015, 5:41am UTC](https://forum.xojo.com/t/scolling-canvases-on-canvase-windows/27027/8 "2015-10-05T05:41:55Z")

</div>

First of all, I’m am doing it in Windows (If I can get it to work in windows, then it will certainly work on mac)

I have this as a method:

`LockWindow(hw as integer)  
#if TargetWin32 Then
    Declare Sub LockWindowUpdate Lib "user32" (ByVal hWnd As Integer)
    LockWindowUpdate hw
  #endif`

I have this in the main canvas paint event

```auto
g.DrawPicture(ChordDiagram,0,0-YScroll)
```

The big problem is this…  
I have controls on the scrolling canvas. When I click on these controls, I have a method called “Drawneck” which  
sets g=chorddiagram.graphics  
In this method it draws a rectangle around the control. When the picture is not scrolled, it works perfectly. Once the rectangle is drawn, I can press another button (not on the canvas) to draw onto chord diagram the value.

The problem is when it’s scrolled. (yscroll is changed by a vertical scroll bar)  
methods which go to draw onto “ChordDiagram” Draw them not around the controls but higher on chorddiagram.  
Any recommendations?

---

<div class="post-metadata">

**Author:** ![Jeff\_Tullin](https://forum.xojo.com/user_avatar/forum.xojo.com/jeff_tullin/32/693_2.png) [@Jeff\_Tullin](https://forum.xojo.com/u/Jeff_Tullin)\
**Post date:** [October 5, 2015, 6:05am UTC](https://forum.xojo.com/t/scolling-canvases-on-canvase-windows/27027/9 "2015-10-05T06:05:01Z")

</div>

Without code, the explanation is not very clear.

I am assuming

- this is a guitar neck
- the canvas over the top is meant to add the finger positions
- the canvas over the top is mostly transparent
- the main canvas scrolls to show another part of the neck

Either your overlaid canvas is showing all 6 finger positions at once, or you have 6 canvas objects, one for each finger.

If the neck image is not drawn ‘correctly’, (and all spaces between frets are shown to be the same width), then the overlaid canvas for a G shape could be placed anywhere on the neck and still look OK.  
If so, the overlaid canvas can stay put, leaving the neck image to move behind it in steps of exactly one fret  
(If the neck is drawn correctly, then the gaps between fingers is greater closer to the nut)

If the overlaid images are of the individual fingers, why use extra canvases at all, as Greg suggests?  
Just add the finger images in the Paint event.

(ie, in the paint event, draw the image of the neck.  
Then draw circles for the fingers at the correct positions on top of it)

If the neck image is set to be the main canvas backdrop, then only draw the finger placings in the paint event.

---

<div class="post-metadata">

**Author:** ![system](https://forum.xojo.com/uploads/default/original/1X/455b4dcc0e61630e9f81940004ddffa49c432a46.png) [@system](https://forum.xojo.com/u/system)\
**Post date:** [October 29, 2020, 5:59pm UTC](https://forum.xojo.com/t/scolling-canvases-on-canvase-windows/27027/10 "2020-10-29T17:59:05Z")

</div>


