从 Canvas TranslateTransform 中排除一些元素答案

【问题标题】：Exclude some elements from Canvas TranslateTransform从 Canvas TranslateTransform 中排除一些元素
【发布时间】：2014-05-20 06:29:29
【问题描述】：

我正在 Silverlight 5 中创建一个设计环境，用户可以从位于屏幕左侧的面板中拖放一些项目。用户还可以通过鼠标和滚动条缩放/平移场景。 Canvas 有一个 TranslateTransform，它在平移场景时被操纵，但我不希望我的 UI 元素被平移。如何排除这些元素受到平移过程的影响？

我在 XAML 中使用以下画布转换：

        <Canvas.RenderTransform>
            <TransformGroup x:Name="transformGroup">
                <ScaleTransform x:Name="CanvasScale" ScaleX="1.0" ScaleY="1.0"></ScaleTransform>
                <TranslateTransform x:Name="CanvasPan" ></TranslateTransform>
            </TransformGroup>
        </Canvas.RenderTransform>

然后我将代码中的 CanvasScale 和 CanvasPan 更改为缩放/平移场景，但所有对象（包括 UI 元素）都会受到影响，我的场景有点复杂，所以我认为最好（或唯一）的方法是排除 UI 元素来自这些转换。

【问题讨论】：

听起来是一个有趣的项目，但很难想象你的意思？你是说你只是想（例如）一些按钮和随机的 UI 东西留在原地，而你的画布东西在它们下面的东西分别做它们的事情？
是的，你可以想象我的应用程序类似于 MS-Paint，我有一些标准的 UI（状态栏、工具栏和...）和一个用户可以在其中绘制的场景。当用户平移场景时，UI 对象应该保持不动，这怎么可能？

标签： silverlight canvas

【解决方案1】：

啊，好吧，现在我想我知道你的意思了，你想做的事情非常轻松，只需使用DOM 中的对象组织来反映你想要的结构就可以完成。所以在你的情况下，它会是这样的（以伪为例）

<Grid>
              <!-- Your Canvas -->
   <Canvas>
      <Canvas.RenderTransform>
         <TransformGroup x:Name="transformGroup">
            <ScaleTransform x:Name="CanvasScale" ScaleX="1.0" ScaleY="1.0"/>
            <TranslateTransform x:Name="CanvasPan"/>
         </TransformGroup>
      </Canvas.RenderTransform>
   </Canvas>

             <!-- Your UI elements -->
   <StackPanel Orientation="Horizontal">
      <Button/>
      <TextBlox/>
      <CheckBox/>
   </StackPanel>

</Grid>

这样，您基本上只是将这些 UI 元素浮动到 DOM 树中的其他内容上，从而实现您想要的效果。

希望这会有所帮助，干杯。

【讨论】：

谢谢 Chris，我会试一试，然后告诉你结果。
别担心，兄弟，如果没有，请告诉我，无论哪种方式，我们都会为您解决。周末愉快！
我已经测试了你所说的这个，但它似乎不起作用。 UI 安排非常混乱。我想我应该只在一个 Canvas 上工作。有没有办法从 Canvas TranslateTransform 中排除某些元素？或者是否可以中和某些元素的变换？
我必须看看你在做什么才能给出一个更准确的想法，但你将不得不打破转换和你的 UI 东西之间的继承关系，通常你只使用 DOM像我展示的那样去做。听起来你如何组织事情可能不是迄今为止最好的路线，可以使用一些重构。
@Ali_dotNet 更新了我的答案，抱歉没有早点看到您的回复。相同的概念仍然适用，您只需要分离 Canvas 和其他内容之间的关联。