滚动时如何重绘我的degrafa背景?

时间:2021-10-21 03:59:30

I am using a canvas which has a degrafa background, so far so good.

我使用的是具有degrafa背景的画布,到目前为止一直很好。

However, when scrolling, the background (degrafa grid) does not get redrawn. In the code the background strokes are linked to the container height. The container height does not change even when scrolling.

但是,滚动时,背景(degrafa网格)不会重绘。在代码中,背景笔划链接到容器高度。即使滚动,容器高度也不会改变。

How do I get the height of the whole area so I can set the new height to my degrafa background?

如何获得整个区域的高度,以便将新高度设置为我的degrafa背景?

It looks like this:

它看起来像这样:

滚动时如何重绘我的degrafa背景?

 <mx:Canvas id="blackBoard"
                width="100%" 
                height="100%" 
                x="0" 
                y="0" 
                backgroundColor="#444444"
                clipContent="true">

    <!-- Degrafa Surface   -->
    <degrafa:Surface id="boardSurfaceContainer">
            <degrafa:strokes>
                <degrafa:SolidStroke    id="whiteStroke"
                                        color="#EEE"
                                        weight="1"
                                        alpha=".2"/>
            </degrafa:strokes>

            <!-- Grid drawing -->
            <degrafa:GeometryGroup id="grid">
                <degrafa:VerticalLineRepeater   count="{blackBoard.width / ApplicationFacade.settings.GRID_SIZE}"
                                                stroke="{whiteStroke}"
                                                x="0"
                                                y="0"
                                                y1="{blackBoard.height}"
                                                offsetX="0"
                                                offsetY="0"
                                                moveOffsetX="{ApplicationFacade.settings.GRID_SIZE}"
                                                moveOffsetY="0"/>

                <degrafa:HorizontalLineRepeater count="{blackBoard.height / ApplicationFacade.settings.GRID_SIZE}"
                                                stroke="{whiteStroke}"
                                                x="0"
                                                y="0"
                                                x1="{blackBoard.width}"
                                                offsetX="0"
                                                offsetY="0"
                                                moveOffsetX="0"
                                                moveOffsetY="{ApplicationFacade.settings.GRID_SIZE}"/>

            </degrafa:GeometryGroup>          

        </degrafa:Surface>

1 个解决方案

#1


0  

I just had to use the scroll position in the degrafa property binding

我只需要在degrafa属性绑定中使用滚动位置

            <degrafa:VerticalLineRepeater   count="{(blackBoard.width + blackBoard.horizontalScrollPosition)/ ApplicationFacade.settings.GRID_SIZE}"
                                            stroke="{whiteStroke}"
                                            x="0"
                                            y="0"
                                            y1="{blackBoard.height + blackBoard.verticalScrollPosition}"
                                            offsetX="0"
                                            offsetY="0"
                                            moveOffsetX="{ApplicationFacade.settings.GRID_SIZE}"
                                            moveOffsetY="0"/>

#1


0  

I just had to use the scroll position in the degrafa property binding

我只需要在degrafa属性绑定中使用滚动位置

            <degrafa:VerticalLineRepeater   count="{(blackBoard.width + blackBoard.horizontalScrollPosition)/ ApplicationFacade.settings.GRID_SIZE}"
                                            stroke="{whiteStroke}"
                                            x="0"
                                            y="0"
                                            y1="{blackBoard.height + blackBoard.verticalScrollPosition}"
                                            offsetX="0"
                                            offsetY="0"
                                            moveOffsetX="{ApplicationFacade.settings.GRID_SIZE}"
                                            moveOffsetY="0"/>