动态创建用户控件 [英] Dynamically Creating User Control

问题描述

我修改了 WPF路径上的文字 [ ^ ]控件包含文本对齐属性。当在XAML中创建 TextOnAPath 时，它在测试应用程序中运行良好。但是，在我的应用程序中，我想在代码中动态创建它，但我无法让它工作。我认为这是因为它不是继承正确的布局画布，因此没有大小。



我可能会完全反对它-MVVM方式，但是如何动态地将此控件添加到画布？我是否需要公开一些尺寸属性？我可以自动调整其包含的路径/文本吗？我应该更改ControlTemplate所以它是一种不同类型的面板（即不是画布）吗？



正如你所看到的 - 我不知道我是什么关于什么时候谈到WPF！





编辑：

进展排序 - 我可以通过设置控件的 .Width 和 .Height 来设置边框的大小，但是路径上的文字没有在里面呈现。





编辑2：

进一步的进展，我在路径上呈现了文字！但是，我使用的是任意（Ellipse）几何，而不是我想要使用的路径！

I modified the Text On A Path in WPF[^] control to include a text alignment property. It all works fine in the test app when the TextOnAPath is created in XAML. However, in my app I want to create it dynamically in code, but I can't get it to work. I think it is because it is not "inheriting" the correct canvas for layout, and consequently has zero size.

I'm probably going about it in a completely anti-MVVM way, but how can I add this control to a canvas dynamically? Do I need to expose some size property? Can I make it auto-size to the path/text it contains? Should I change the ControlTemplate so it is a different kind of Panel (i.e., not a canvas)?

As you can see - I have not idea what I'm about when it comes to WPF!



Progress of a sort - I can set the size of the border simply by setting the .Width and .Height of the control, but the text-on-the-path is not rendering inside.


EDIT 2:
Further progress, I have text rendered on the path! However, I'm using an arbitrary (Ellipse) geometry, not the path I want to use!

推荐答案

如果你想用MVVM方式做，那么你首先需要创建一个View（例如，它是带控件的窗口，你需要创建带有你需要的元素的userControl（TextOnAPath））然后，你创建一个带有控件容器的窗口并将其设置为绑定。之后，您将能够在需要时创建它。现在举一个例子，你会更清楚。

你的观点：

If you want to do it in MVVM way, then you need first to create a View(in example it is window with control, and you need to create userControl with an element that you need(TextOnAPath)from example) After that, you create a window with control container and set it to binding. After that you will be able to create it when you need. Now a little example that it will be more clear to you.
Your View:

<usercontrol x:class="TextOnAPathTestApp.UserControl1" xmlns:x="#unknown">
    xmlns=http://schemas.microsoft.com/winfx/2006/xaml/presentation
    xmlns:x=http://schemas.microsoft.com/winfx/2006/xaml
    xmlns:TextOnAPath="clr-namespace:TextOnAPath;assembly=TextOnAPath"
    Title="Test App" Height="500" Width="500">
    <grid>
    <textonapath:textonapath fontsize="30" drawpath="True" xmlns:textonapath="#unknown">
        Text="The quick brown fox jumped over the lazy hen.">
            <textonapath:textonapath.textpath>
                <pathgeometry figures="M0,0 C120,361 230.5,276.5 230.5,276.5 <br mode=" hold=" />                      L308.5,237.50001 C308.5,237.50001 419.5,179.5002 367.5,265.49993 <br mode=" />
            </textonapath:textonapath.textpath>
        </textonapath:textonapath>
    </grid>
</usercontrol>

现在让我们创建一个窗口，可以加载此视图。不要忘记使用viewModel输入命名空间

Now let's create a window, where this view can be loaded. Don't forget to enter namespaces with your viewModel

<window x:class="TextOnAPathTestApp.Window1" xmlns:x="#unknown">
    xmlns=http://schemas.microsoft.com/winfx/2006/xaml/presentation
    xmlns:x=http://schemas.microsoft.com/winfx/2006/xaml
    xmlns:TextOnAPath="clr-namespace:TextOnAPath;assembly=TextOnAPath"
    Title="Test App" Height="500" Width="500">
<window.resources>
        <datatemplate datatype="{x:Type YourViewModel}">// here you load viewModel of your userControl
            <yourusercontrolview />//here you load view(userControl)
        </datatemplate>
           </window.resources>
    <grid>
     <contentcontrol content="{Binding}" />
    </grid>
</window>

现在使用userControl在运行时加载（TextOnPath）你需要在一些点击事件中跟随：

Now to load (TextOnPath) in runtime your window with userControl you need following in some click event:

var window = new WindowThatYouCreated(){DataContext = new YourViewModel() };
window.ShowDialog();

希望这对你有帮助。如果您有任何疑问，请随时询问。

Hope this helped you. If you have questions, feel free to ask.

经过多次试验和错误后，我想我只是想把它拿到我想要的地方。

问题主要是由于我试图将一个路径对象用于两个目的 - 转换然后搞砸了结果。我也没有注意到（直到我暂时涂上画布）我没有考虑到的余量。这使我在准确定位上的尝试徒劳无功！

After much trial and error, I think I've just about got this where I want it.
The problem was largely due to me trying to use one path object for two purposes - transforms were then screwing up the results. I also didn't notice (until I temporarily coloured the canvas) that there was a margin I wasn't accounting for. This made my attempts at accurate positioning futile!

这篇关于动态创建用户控件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！