2012-04-25 4 views
2

Примечание. Это не для веб-страницы, это простая программа, которая содержит набор изображений и будет произвольно выбирать количество изображений и отображать их на экране. Представьте, что вы работаете с редактором изображений и вручную позиционируете импортированные изображения на холсте.Алгоритмы для размещения изображений на экране «красиво»

Я имею трудности придумывают способ расположить набор произвольных изображений на экране фиксированного размера (это просто окно)

Так, например, если у меня есть один образ, я бы, наверное, просто расположите его в центре экрана.

 
      | 

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

 
    |   | 

Но что, если одно изображение больше, чем два других? Я мог бы иметь что-то вроде

 
    |-----| 

    |   | 

Точно так же, может быть, у меня есть два более крупных и два поменьше

 
|-----| |-----| 

    |   | 

Так что появляется большой один «в спину», а маленькие есть фронт.

Неизбежно, что некоторые изображения будут покрывать части других изображений, но лучшее, что я могу сделать, - попытаться сделать его как можно более упорядоченным.

Я могу быстро захватить размеры каждого объекта изображения, который должен быть нарисован, и существует ограничение на количество изображений (от 1 до 8 включительно).

Изображения можно нарисовать в любом месте экрана, и если какая-либо часть изображения находится за пределами экрана, эти части будут отрезаны. Все изображения имеют размеры, меньшие размеров экрана, и обычно не больше 1/4 всего экрана.

Что такое хороший способ решения этой проблемы? Даже обработка базовых дел, таких как наличие двух изображений (возможно, разных размеров), уже довольно запутанна.

+0

Является ли масштабирование изображений разных размеров до одного фиксированного размера? Говоря о масштабировании, просто помните, что вы захотите убедиться, что поддерживаете исходные пропорции. –

+0

Я бы предпочел, чтобы изображения сохраняли свои первоначальные размеры. – MxyL

+1

[проблема с упаковкой двумерного бина?] (Http://stackoverflow.com/questions/1213394/algorithm-needed-for-packing-rectangles-in-a-fairly-optimal-way) Оптимизирует для неперекрывающихся прямоугольников в «компактный» способ, хотя эстетика не будет рассматриваться. –

ответ

1

Вы можете рассматривать это как 2D bin packing problem, который будет оптимизировать для неперекрывающихся прямоугольников «компактным» способом, хотя эстетика не будет рассматриваться.

Если вы хотите катить самостоятельно, вы можете попробовать разместить все изображения на холсте на сетке, причем расстояние между центрами достаточно велико, чтобы изображения не перекрывались. Затем «сквойте» изображения ближе друг к другу, слева направо и сверху вниз, чтобы уменьшить количество пробелов.

0

HTML таблицы шириной 100% и высота (с отключенным перетоков) являются хорошей отправной точкой ИМО - в первой итерации просто заказать фотографии по размеру и сделать 8 шаблонов как:

  1. <tr><td><img></td></tr>
  2. <tr><td><img></td><td><img></td></tr>
  3. 2 ряда, сначала с Colspan = 2
  4. ...

затем найти некоторые уродливые случаи и делают для них особые правила (например, для трех вертикальных изображений делают 1 ряд, ...)

Смежные вопросы