Продолжая тему работы с Изображениями в это статье я приведу пример, как можно вывести несколько изображений на панель по подобию работы таких программ, как ShotWell и DigiKam.
Для работы разместим на форме два элемента: ScrollView и ButtonBox. В ScrollView мы будем выводить изображения, а по кнопке ButtonBox откроем папку с фотографиями.
Для ScrollView1 нужно задать свойство Arrangement = Row — это чтобы наши изображения при выводе располагались рядами.
Вот что у нас получится в итоге:
Привожу полный код программы с комментариями:
Dim sFile As String Dialog.Path = "/home" 'Задаем директорию в которой будет открыт диалог выбора mFiles = Dir(Dialog.Path, "*.jpg", 1) 'Оператор Dir возвращает массив файлов из директории по заданому шаблону For Each sFile In mFiles 'начинаем цикл по массиву файлов - наших изображений hArea = New DrawingArea(ScrollView1) 'Динамически создаем новый объект hArea Draw.Begin(hArea) 'Выводим изображение
Public Sub ButtonBoxOpenFile_Click()
Dim hImage As Image
Dim hArea As DrawingArea
Dim SizeArea As Integer = 100
Dim mFiles As String
If Dialog.SelectDirectory() Then Return 'Инициируем диалог выбора директории
ButtonBoxOpenFile.Text = Dialog.Path
hImage = Image.Load(Dialog.Path & "/" & sFile) 'Загружаем изображение в объект hImage
hImage = hImage.Stretch(SizeArea, SizeArea) 'Уменьшаем изображение до размера эскиза 100*100, чтобы вошло несколько изображений на панель
Object.Attach(hArea, FMain, "MyhArea") 'Ассоциируем имя "MyhArea" с новым объектом
hArea.Cached = True 'Задаем свойство кеширования
hArea.Border = 3 'Устанавливаем тип границы
hArea.Width = SizeArea 'Задаем размер облости вывода изображения
hArea.Height = SizeArea
Draw.Image(hImage, 0, 0)
Draw.End
Next
End
Тут стоит обратить внимание на следующие важные моменты.
hArea = New DrawingArea(ScrollView1) 'Динамически создаем новый объект hArea
Здесь мы с помощью оператора «New» создаём в цикле новый объект «DrawingArea». Програмно создавать и инициировать можно не только переменные и массивы, но и видимые элементы формы (хоть 100 кнопок вывести на форму в цикле можно). При желании можно вобще всю форму прописать программно, как это делается в языках в которых отсутствует графические средства разработки интерфейса IDE, например python, C++.
Object.Attach(hArea, FMain, "MyhArea") 'Ассоциируем имя "MyhArea" с новым объектом
Для данного примера это строка не важна, оно будет необходима, если мы заходим обращаться к какому-либо событию динамически созданного объекта.
Об этом я расскажу в следующей статье.
Draw.Begin(hArea) 'Выводим изображение
Draw.Image(hImage, 0, 0)
Draw.End
А этот момент описан в статье
Метод «Draw.Image» обеспечивает вывод изображения в контейнер hArea. Как бы рисует его.
Единственный недостаток этого примера и предыдущего, это то, что изменение размера изображения происходит непропорционально, а для фотографии это неприемлемо.
Но применив немного математических расчётов это легко можно исправить. Все что нужно это определить на сколько нужно изменить ширину изображения если длинна его будет задана. Ну и в дополнение я определю сдвиг изображения на центр hArea. Это парамерты dH и dW.
If hImage.Height > hImage.Width Then
K = SizeArea / hImage.Height
Width = Int(hImage.Width * K)
Height = Int(SizeArea)
dW = Int((SizeArea - Width) / 2)
dH = 0
Else
K = SizeArea / hImage.Width
Height = Int(hImage.Height * K)
Width = Int(SizeArea)
dH = Int((SizeArea - Height) / 2)
dW = 0
Endif
Вот таким кодом мы просто рассчитаем ширину и высоту изображения и сдвиг его относительно вертикали и горизонтали.
Весь код последнего варианта выглядит так: Dim sFile As String Dim K As Float Dialog.Path = "/home" 'Задаем директорию в которой будет открыт диалог выбора mFiles = Dir(Dialog.Path, "*.jpg", 1) 'Оператор Dir возвращает массив файлов из директории по заданому шаблону For Each sFile In mFiles 'начинаем цикл по массиву файлов - наших изображений If hImage.Height > hImage.Width Then hImage = hImage.Stretch(Width, Height) 'Уменьшаем изображение до размера эскиза 100*100, чтобы вошло несколько изображений на панель hArea = New DrawingArea(ScrollView1) 'Динамически создаем новый объект hArea Draw.Begin(hArea) 'Выводим изображение
Public Sub ButtonBoxOpenFile_Click()
Dim hImage As Image
Dim hArea As DrawingArea
Dim SizeArea As Integer = 100
Dim mFiles As String
Dim Height, Width, dH, dW As Integer
If Dialog.SelectDirectory() Then Return 'Инициируем диалог выбора директории
ButtonBoxOpenFile.Text = Dialog.Path
hImage = Image.Load(Dialog.Path & "/" & sFile) 'Загружаем изображение в объект hImage
K = SizeArea / hImage.Height
Width = Int(hImage.Width * K)
Height = Int(SizeArea)
dW = Int((SizeArea - Width) / 2)
dH = 0
Else
K = SizeArea / hImage.Width
Height = Int(hImage.Height * K)
Width = Int(SizeArea)
dH = Int((SizeArea - Height) / 2)
dW = 0
Endif
Object.Attach(hArea, FMain, "MyhArea") 'Ассоциируем имя "MyhArea" с новым объектом
hArea.Cached = True 'Задаем свойство кеширования
hArea.Border = 3 'Устанавливаем тип границы
hArea.Width = SizeArea 'Задаем размер облости вывода изображения
hArea.Height = SizeArea
Draw.FillRect(0, 0, SizeArea, SizeArea, Color.Gray) 'Здесь мы просто заполним всю область серым цветом
Draw.Image(hImage, dW, dH, Width, Height) 'выведем со сдвигом
Draw.End
Next
End
Проект можно скачать отсюда: mArea
До новых встреч!
