Подстроить координаты top/left при групповом масштабировании? Как реализовать масштабирование нескольких элементов, относительно другого элемента?
Пишу ресайз (на подобии canva.com, google presentation и т.д.) он должен ресайзить как один элемент так и несколько. Рабоатет это так, есть контейнер с элементами, и рядом с контейнером элементов лежит элемент ресайза, и когда элементы выделяются, то элемент ресайза высчитывает размеры и подстраивает его под выбраные элементы.
Проблема в том, что элементы лежат отдельно от ресайзера, так как элементы должны подстраиваться по ресайзер ,во время его ресайза.
Если бы элементы лежали внутри ресайзера, то я бы без проблем сделал это таким образом:scaleWidth = containerNewWidth / containerSourceWidth
scaleHeight = containerNewHeight / containerSourceHeight
elemenWidth = elementWidth * scaleWidth
elementLeft = elementLeft * scaleWidth
elementHeight = elementHeight * scaleHeight
elementTop = elementTop * scaleHeight
и тогда все элементы подстроятся внутри ресайзера.
но постоянно перемещать при начале ресайза элементы в ресайзер не хотелось бы, потому, что из за спецификации приложения это очень не желательно, хотя можно.
В общем если я применяю код выше, то элементы нормально масштабируются по width, heigth, а top, left не получается подогнать, я пробовал уже подстраивать координаты, прибавляя/ вычитая координаты контейнеров... что только не делал, не получается подстроить по top, left....
Подстроить координаты top/left при групповом масштабировании? Как реализовать масштабирование нескольких элементов, относительно другого элемента?
Пишу ресайз (на подобии canva.com, google presentation и т.д.) он должен ресайзить как один элемент так и несколько. Рабоатет это так, есть контейнер с элементами, и рядом с контейнером элементов лежит элемент ресайза, и когда элементы выделяются, то элемент ресайза высчитывает размеры и подстраивает его под выбраные элементы.
Проблема в том, что элементы лежат отдельно от ресайзера, так как элементы должны подстраиваться по ресайзер ,во время его ресайза.
Если бы элементы лежали внутри ресайзера, то я бы без проблем сделал это таким образом:scaleWidth = containerNewWidth / containerSourceWidth
scaleHeight = containerNewHeight / containerSourceHeight
elemenWidth = elementWidth * scaleWidth
elementLeft = elementLeft * scaleWidth
elementHeight = elementHeight * scaleHeight
elementTop = elementTop * scaleHeight
и тогда все элементы подстроятся внутри ресайзера.
но постоянно перемещать при начале ресайза элементы в ресайзер не хотелось бы, потому, что из за спецификации приложения это очень не желательно, хотя можно.
В общем если я применяю код выше, то элементы нормально масштабируются по width, heigth, а top, left не получается подогнать, я пробовал уже подстраивать координаты, прибавляя/ вычитая координаты контейнеров... что только не делал, не получается подстроить по top, left....
Пишу ресайз (на подобии canva.com, google presentation и т.д.) он должен ресайзить как один элемент так и несколько. Рабоатет это так, есть контейнер с элементами, и рядом с контейнером элементов лежит элемент ресайза, и когда элементы выделяются, то элемент ресайза высчитывает размеры и подстраивает его под выбраные элементы.
Проблема в том, что элементы лежат отдельно от ресайзера, так как элементы должны подстраиваться по ресайзер ,во время его ресайза.
Если бы элементы лежали внутри ресайзера, то я бы без проблем сделал это таким образом:scaleWidth = containerNewWidth / containerSourceWidth
scaleHeight = containerNewHeight / containerSourceHeight
elemenWidth = elementWidth * scaleWidth
elementLeft = elementLeft * scaleWidth
elementHeight = elementHeight * scaleHeight
elementTop = elementTop * scaleHeight
и тогда все элементы подстроятся внутри ресайзера.
но постоянно перемещать при начале ресайза элементы в ресайзер не хотелось бы, потому, что из за спецификации приложения это очень не желательно, хотя можно.
В общем если я применяю код выше, то элементы нормально масштабируются по width, heigth, а top, left не получается подогнать, я пробовал уже подстраивать координаты, прибавляя/ вычитая координаты контейнеров... что только не делал, не получается подстроить по top, left....
Не можешь разобраться в этой теме?
Обратись за помощью к экспертам
Гарантированные бесплатные доработки
Быстрое выполнение от 2 часов
Проверка работы на плагиат
Интересные статьи из справочника
Поможем написать учебную работу
Отвечай на вопросы, зарабатывай баллы и трать их на призы.
Подробнее
Подробнее
Для масштабирования нескольких элементов относительно другого элемента без перемещения их внутрь ресайзера, можно использовать следующий подход:
Получите текущие координаты и размеры всех элементов, которые вы хотите масштабировать относительно элемента ресайзера.
Вычислите коэффициенты масштабирования для ширины и высоты элементов:
scaleWidth = containerNewWidth / containerSourceWidth;scaleHeight = containerNewHeight / containerSourceHeight;Примените коэффициенты масштабирования к размерам всех элементов:elemenWidth = elementWidth * scaleWidth;
elementHeight = elementHeight * scaleHeight;Теперь для каждого элемента вычислите новые координаты top и left относительно элемента ресайзера:elementLeft = (elementLeft - containerSourceLeft) * scaleWidth + containerNewLeft;
elementTop = (elementTop - containerSourceTop) * scaleHeight + containerNewTop;
Где containerSourceLeft, containerSourceTop - это координаты контейнера исходного размера, а containerNewLeft, containerNewTop - это координаты контейнера нового размера.
Таким образом, вы сможете масштабировать несколько элементов относительно элемента ресайзера с учетом их текущих координат и размеров.