Как разместить список путей внутри границы в WPF

Я пишу программу C # WPF для просмотра и редактирования SVG. Итак, у меня есть список путей (PathList), и я отображаю их внутри границы на холсте, вот мой XAML:

            <ItemsControl ItemsSource="{Binding PathList}" >
                <ItemsControl.ItemsPanel>
                    <ItemsPanelTemplate>                          
                        <Canvas>
                            <i:Interaction.Triggers>
                                <i:EventTrigger EventName="MouseDown" >
                                    <cmd:EventToCommand Command="{Binding Path= OnMouseDownCommand}" PassEventArgsToCommand="True" />
                                </i:EventTrigger>
                            </i:Interaction.Triggers>
                        </Canvas>

                    </ItemsPanelTemplate>
                </ItemsControl.ItemsPanel>

                <ItemsControl.ItemTemplate>
                    <DataTemplate>
                        <Viewbox Stretch="Uniform"  Height="500" Width="500">
                        <Path Stroke="{Binding Stroke}" 
                              StrokeThickness="{Binding StrokeThickness}" 
                              Fill="{Binding Fill}" 
                              Data="{Binding Data}" 
                              Tag="{Binding Tag}"
                        </Viewbox>
                    </DataTemplate>
                </ItemsControl.ItemTemplate>
            </ItemsControl>

как я сказал в заголовке, моя цель состоит в том, чтобы разместить эти пути внутри границы, и, как вы можете видеть в моем коде, я использовал Viewbox, чтобы растянуть пути, но проблема в том, что он растягивает каждый путь внутри списка, чтобы заполнить размер (500 *500) искажает форму векторной графики. Я хочу, чтобы масштабирование происходило сразу для всего списка как объекта, оставляя относительный масштаб и расположение этих путей нетронутыми.


svg wpf xaml viewbox itemscontrol
person Mohab Mesherf    schedule 23.03.2015    source источник
comment
Вы пытались поместить весь ItemsControl в Viewbox вместо отдельных элементов?   -  person Clemens    schedule 23.03.2015
comment
@Clemens да, когда я это делаю, svg не отображается   -  person Mohab Mesherf    schedule 23.03.2015
comment
Вы также должны установить ширину и высоту ItemsControl (или Canvas ItemsPanel) на 500.   -  person Clemens    schedule 23.03.2015

Ответы (1)


arrow_upward
1
arrow_downward

В следующем упрощенном примере показано, как поместить список элементов Geometry в масштабируемый ItemsControl. Необходимо, чтобы вы установили ширину и высоту ItemsControl.

<Viewbox>
    <ItemsControl Width="500" Height="500">
        <ItemsControl.ItemsPanel>
            <ItemsPanelTemplate>
                <Canvas/>
            </ItemsPanelTemplate>
        </ItemsControl.ItemsPanel>
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <Path Stroke="Black" StrokeThickness="3" Data="{Binding}"/>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
        <ItemsControl.Items>
            <EllipseGeometry Center="150,150" RadiusX="100" RadiusY="100"/>
            <EllipseGeometry Center="350,350" RadiusX="100" RadiusY="100"/>
        </ItemsControl.Items>
    </ItemsControl>
</Viewbox>
person Clemens    schedule 23.03.2015
comment
хорошо, это определенно сработало, но кое-что нужно подправить, но это, безусловно, помогло - person Mohab Mesherf; 23.03.2015