Почему мои полигоны нарисованы не в том месте?

Question

Я практикую базовый рисунок CFL в WPF / XAML на C # для задания и сразу же не могу понять, почему мои полигоны прорисовываются не в том месте.

Мое окно имеет фиксированный размер 1280x720, неизменяемого размера.Я пытаюсь программно создать свои полигоны:

1. Создавая точки в координатах, я хочу, чтобы они были: `

   • [0,0]
   • [максимальная высота, 0],
   • [максимальная высота, максимальная ширина],
   • [0, максимальная ширина],
   • [максимальная высота / 2,максимальная ширина / 2]

`

Создание полигонов, состоящих из трех точек каждая, [0,0] и двух ребер.Предполагается, что мой экран разделен на четыре треугольника.

Я попытался разбить код на что-то действительно явное, чтобы посмотреть, смогу ли я выяснить, где проблема, так вот что у меня есть:

private void CreatePolygons()
{ 
    List<Point> PointList = new List<Point>
    {
        new Point(MainUI.Height / 2, MainUI.Width / 2),
        new Point(0, 0),
        new Point(0, MainUI.Height),
        new Point(MainUI.Width, MainUI.Height),
        new Point(MainUI.Width, 0)                
    };

    Polygon p1 = new Polygon();
    Polygon p2 = new Polygon();
    Polygon p3 = new Polygon();
    Polygon p4 = new Polygon();

    p1.Points.Add(PointList[0]);
    p1.Points.Add(PointList[1]);
    p1.Points.Add(PointList[2]);

    p2.Points.Add(PointList[0]);
    p2.Points.Add(PointList[2]);
    p2.Points.Add(PointList[3]);

    p3.Points.Add(PointList[0]);
    p3.Points.Add(PointList[3]);
    p3.Points.Add(PointList[4]);

    p4.Points.Add(PointList[0]);
    p4.Points.Add(PointList[4]);
    p4.Points.Add(PointList[1]);

    p1.Stroke = System.Windows.Media.Brushes.LightSkyBlue;
    p2.Stroke = System.Windows.Media.Brushes.LightSkyBlue;
    p3.Stroke = System.Windows.Media.Brushes.LightSkyBlue;
    p4.Stroke = System.Windows.Media.Brushes.LightSkyBlue;

    p1.StrokeThickness = 1;
    p2.StrokeThickness = 1;
    p3.StrokeThickness = 1;
    p4.StrokeThickness = 1;

    MainGrid.Children.Add(p1);
    MainGrid.Children.Add(p2);
    MainGrid.Children.Add(p3);
    MainGrid.Children.Add(p4);
}

Конечным результатом является полностью неуместная сетка, и я не могу понять, к каким координатам это привело в результате:

Что мне не хватает?

Answer 1

Кроме того, что вы перепутали ширину и высоту первой точки, я бы посоветовал не создавать элементы пользовательского интерфейса, такие как полигоны, в коде позади.Лучше использовать ItemsControl следующим образом:

<Grid SizeChanged="MainUISizeChanged">
    <ItemsControl x:Name="polygons">
        <ItemsControl.ItemsPanel>
            <ItemsPanelTemplate>
                <Canvas/>
            </ItemsPanelTemplate>
        </ItemsControl.ItemsPanel>
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <Polygon Stroke="LightSkyBlue" StrokeThickness="1"
                         Points="{Binding}"/>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>
</Grid>

и назначить его свойство ItemsSource для коллекции PointCollections, например, при изменении размера вашего элемента MainUI:

private void MainUISizeChanged(object sender, SizeChangedEventArgs e)
{
    var points = new List<Point>
    {
        new Point(e.NewSize.Width / 2, e.NewSize.Height / 2),
        new Point(0, 0),
        new Point(0, e.NewSize.Height),
        new Point(e.NewSize.Width, e.NewSize.Height),
        new Point(e.NewSize.Width, 0)
    };

    polygons.ItemsSource = new List<PointCollection>
    {
        new PointCollection(new Point[] { points[0], points[1], points[2] }),
        new PointCollection(new Point[] { points[0], points[2], points[3] }),
        new PointCollection(new Point[] { points[0], points[3], points[4] }),
        new PointCollection(new Point[] { points[0], points[4], points[1] }),
    };
}

Answer 2

В качестве альтернативы всем вычислениям точек Polygon, вы можете использовать этот простой элемент Path, который выдает тот же результат и автоматически растягивается:

<Grid>
    <Path Stretch="Fill" Stroke="LightSkyBlue" StrokeThickness="1"
          Data="M0,0 L1,0 1,1 0,1Z M0,0 L1,1 M0,1 L1,0"/>
</Grid>

Answer 3

Вы случайно поменяли местами Width и Height в первой точке:

new Point(MainUI.Height / 2, MainUI.Width / 2),

Должно быть:

new Point(MainUI.Width / 2, MainUI.Height / 2),

Далее, предполагая, MainUI это приложениеСамо окно, точки все равно будут немного смещены, поскольку Height окна включает в себя высоту строки заголовка .Вам лучше использовать MainGrid.ActualWidth и MainGrid.ActualHeight:

List<Point> PointList = new List<Point>
{
    new Point(MainGrid.ActualWidth / 2, MainGrid.ActualHeight / 2),
    new Point(0, 0),
    new Point(0, MainGrid.ActualHeight),
    new Point(MainGrid.ActualWidth, MainGrid.ActualHeight),
    new Point(MainGrid.ActualWidth, 0)
};