Как изменить ориентацию элемента управления UniformGrid?

По умолчанию UniformGrid отображает дочерние элементы следующим образом:

1 2 3
4 5 6
7 8 9

Я хочу быть следующим:

1 4 7
2 5 8
3 6 9

Есть идеи?

2 ответа

Решение

Проще всего вставить их в том порядке, в котором вы хотите, чтобы они отображались.

Если вы используете UniformGrid в качестве ItemsPanel в списке и получаете элементы через привязку данных, сортируйте коллекцию, в которой вы связываете данные, с вашим предпочтительным заказом.

Наконец, если вы хотите сделать это в представлении, эта ссылка описывает два способа: Построение основной столбца UniformGrid в WPF


Страница продолжает исчезать.

Это здесь (без изображений) по состоянию на 2017-06-20.

Он поворачивает сетку на 90 градусов с помощью преобразования макета, а затем поворачивает каждый элемент сетки с помощью другого преобразования макета, чтобы они были направлены вверх.

Решение, не зависящее от битых ссылок:

В последнем ответе есть неработающие ссылки, но... для всех, кто наткнулся на эту страницу, я собрал для вас решение. Я применил это к своему UniformGrid:

Пример XAML UniformGrid

      <UniformGrid> <!--Remember to invert the number of rows and columns here-->
    <!--content here-->
    <UniformGrid.LayoutTransform>
        <TransformGroup>
            <RotateTransform Angle="90"/>
            <ScaleTransform ScaleX="-1"/>
        </TransformGroup>
    </UniformGrid.LayoutTransform>
</UniformGrid>

Это повернет весь элемент на 90 градусов против часовой стрелки и отобразит его в перевернутом виде относительно собственной оси X (на самом деле это Y для наших глаз, так как он повернут сейчас). Сделав это, сетка будет заполнена столбцом первым, а верхняя левая ячейка будет заполнена первой.

Различные направления:

Если вы хотите, чтобы это работало по-другому, вы всегда можете поиграть с TransformGroupценности. Например, столбец-первый из правого нижнего угла будет достигнут с помощью Angle="270"а также ScaleX="-1". Два других угла достигаются путем использования последних двух значений угла и удаления коэффициента ScaleX или просто присвоения его ScaleX="1".

Однако есть второй шаг:

Дети внутри вращаются вместе с сеткой, поэтому мы должны повернуть их обратно, если мы надеемся увидеть их «прямыми». Мы делаем это, задавая каждому из них отрицательный угол (скажем, угол сетки Angle="90", мы будем использовать Angle="-90"), например:

      <Ellipse> <!--I put an ellipse just as an example,
              you will apply this to your desired control.-->
    <Ellipse.LayoutTransform>
        <TransformGroup>
            <RotateTransform Angle="90"/>
            <ScaleTransform ScaleX="-1"/>
        </TransformGroup>
    </Ellipse.LayoutTransform>
</Ellipse>

Удачи!

Надеюсь, вы видели это, и это помогло вам, прежде чем расплавить ваш мозг, пытаясь понять, почему Microsoft до сих пор не реализовала это даже в .NET 6.

Другие вопросы по тегам