Как преобразовать позицию элемента в зависимости от размера его контейнера

1

Это немного гипотетический вопрос, я надеюсь, что это разрешено здесь.

У меня возникла проблема, пытаясь понять, как это сделать, и выглядит безумно просто (что еще больше расстраивает).

Скажем, у меня есть дочерний элемент 100x100 на холсте 500x500, который я могу перемещать внутри этого родителя. Скажем, что текущие координаты дочернего элемента draggable равны x = 42 и y = 30.

<Canvas Width="500" Height="500">
 <Grid Background="Gray" Canvas.Left="42" Canvas.Top="30" Width="100" Height="100" />
</Canvas>

Если бы я изменил размер родительского холста, как бы я хотел настроить параметры верхнего и левого элементов дочернего элемента, чтобы они всегда находились в относительной позиции внутри родителя, независимо от того, какой размер является родителем?

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

Я с радостью принимаю любые идеи в С#, VB.NET или XAML, если кто-нибудь знает, как я могу это достичь.

Теги:
xaml
wpf

3 ответа

1
Лучший ответ

Если вам нужен постоянный верхний/левый, то формула должна просто поддерживать постоянство отношения смещения/размера. Так:

  • старый левый/старый ширина = новый левый/новый ширина
  • новый левый = старый левый * новый ширина/старый ширина
  • новый левый = 42/500 * новая ширина

Если вы хотите учесть ширину дочернего элемента, хотя (вероятно, вы, вероятно, это делаете), то вы вычитаете его ширину из расчета.

  • новый левый = старый левый * (новый ширина - ребенок ширина)/(старый ширина - ребенок ширина)
  • новый левый = 42 * (новая ширина - 100)/(500 - 100)
  • новый левый = (42/400) * (новая ширина - 100)

Первый подход дает вам пропорциональный верхний/левый:

Изображение 174551

Второй дает вам пропорциональный центр:

Изображение 174551

  • 0
    Спасибо за помощь, я действительно ценю это. Я думаю, что это именно то, что я искал!
  • 1
    Хороший ответ. Просто остерегайтесь целочисленного деления. Например: 42 / 400 будет 0. То же самое касается (new width - child width) / (old width - child width) , возможно, не 0, но также не то, что вы ожидаете. Вам нужно деление с плавающей запятой здесь.
Показать ещё 1 комментарий
1

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

Обратите внимание, что коэффициент будет отличаться для высоты и вершины, тогда он будет для ширины и слева.

  • 0
    Можете ли вы поделиться примером
0

что, если вы используете значения% для верхнего и левого?

Canvas.Left = "10%" Canvas.Top = "15%"

  • 1
    процентные значения не допускаются в XAML; (

Ещё вопросы

Сообщество Overcoder
Наверх
Меню