Семейный альбом. Анимация

Продолжение статьи “Семейный альбом“.

После выхода первой версии “Семейного альбома” прошло 8 месяцев. И у меня появился повод продолжить эту историю в позитивном ключе. Дело в том, что при разработке данной программы я столкнулся с очень серьёзной проблемой – низкой производительностью компонентов, отвечающих за отображение изображений: обычная загрузка картинки из файла и отображение на форме может занимать секунду и даже более, в зависимости от размера файла. С такими скоростями о режиме презентации можно забыть, а сам проект перевести в разряд учебных. Однако, после серии экспериментов с прозрачностью формы, мне удалось добиться приемлемой анимации при смене изображений с эффектом плавного перехода одного изображения в другое.

Ещё одним поводом вернуться к данному проекту послужило моё желание включить в программу ClearApp модули для работы с графикой, поэтому проект “Семейный альбом” я портировал на последнюю версию ClearApp, чтобы потом синхронизировать версии отдельных модулей. В результате немного изменился внешний вид программы: она обзавелась главным меню и другими вспомогательными функциями: настройкой темы, интерактивной помощью и возможностью регистрации программы.

Режим презентации сделан на весь экран. На моём 2К мониторе он работал вполне прилично, хотя в записи почему-то анимация не такая плавная – видимо, подвела программа захвата видео.

Ловкость рук

Для достижения эффекта пришлось создать три формы:

• frmPlayer – форма с кнопками управления презентацией;
• frmFrame1 – форма отображения картинки;
• frmFrame2 – ещё одна форма отображения картинки.

frmFrame1 и frmFrame2 растянуты на весь экран, и, после загрузки картинки в компонент TdbImage, поочерёдно перемещаются на передний план. Анимация же получается за счет изменения свойства AlphaBlendValue от 0 (полная прозрачность) до 255 (полная непрозрачность) той формы, которая находится сверху.

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

Скрипты

Библиотека ClearApp должна пополниться целой папкой ImageEdit, в которой находятся четыре модуля:

• IEConstVar.pas – константы и переменные редактора изображений
• ImageEdit.pas – редактор изображения
• TargetImage.pas – виртуальный класс миниатюры редактора изображения
• TargetImagePanel.pas – виртуальный класс панели миниатюр

Добавлены две полезные процедуры для формы:

• Form_SavePosSize – сохранение позиции окна в параметрах
• Form_RestorePosSize – восстановление положения и размера окна по данным из параметров

const
  FORM_PARAM_POS_SIZE = 'FormPosSize_';
  FORM_SECTION = 'Forms';
  FORM_WIDTH_DEF = 800;
  FORM_HEIGHT_DEF = 600;

procedure Form_SavePosSize(Sender: TObject;);
// сохранение позиции окна в параметрах
var
  tmpForm: TAForm;
  tmpName: string;
  tmpValue: string;
  tmpSection: string;
begin
  tmpForm := TAForm(Sender);
  // иногда форма по непонятным причинам находится за пределами видимости
  // поэтому проверяем на предмет полного отображения на экране.
  if (tmpForm.Top > 0) and (tmpForm.Left > 0) and ((tmpForm.Top + tmpForm.Height) < Screen.Height) and
    ((tmpForm.Left + tmpForm.Width) < Screen.Width) then
  begin
    tmpName := FORM_PARAM_POS_SIZE + TComponent(Sender).Name;
    if tmpForm.WindowState = wsMaximized then
      tmpValue := 'Maximized'
    else
      tmpValue := IntToStr(tmpForm.Left) + ',' + IntToStr(tmpForm.Top) + ',' + IntToStr(tmpForm.Width) + ',' +
        IntToStr(tmpForm.Height);
     tmpSection := FORM_SECTION;
    IniFile_Write(tmpSection,tmpName,tmpValue);
  end;
end;

procedure Form_RestorePosSize(Sender: TObject;);
// восстановление положения и размера окна по данным из параметров
// ВНИМАНИЕ! у формы свойство Position должно быть установлено в poDesigned
var
  tmpName: string;
  tmpForm: TAForm;
  s: array of string;
  tmpValue: string;
  tmpImage: TdbImage;
  tmpSection: string;
begin
  try
    tmpForm := TAForm(Sender);
    tmpName := FORM_PARAM_POS_SIZE + TComponent(Sender).Name;
    tmpSection := FORM_SECTION;

    tmpValue := IniFile_Read(tmpSection,tmpName,'');
    if tmpValue <> '' then // если параметр существует, то
    begin // восстановить положение и размер
      s := SplitString(tmpValue, ',');
      if s[0] = 'Maximized' then // если форма была развернута на весь экран
      begin
        tmpForm.Width := FORM_WIDTH_DEF;
        tmpForm.Height := FORM_HEIGHT_DEF;
        Form_Centered(tmpForm);
        tmpForm.WindowState := wsMaximized;
      end
      else
      begin
        tmpForm.Left := StrToInt(s[0]);
        tmpForm.Top := StrToInt(s[1]);
        tmpForm.Width := StrToInt(s[2]);
        tmpForm.Height := StrToInt(s[3]);
      end;
    end
    else
    begin
      Form_Centered(tmpForm);
    end;
  except
    RaiseException('Form_RestorePosSize() - '+ExceptionMessage);
  end;
end;
Code language: Delphi (delphi)

Плеер

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

На форме находится невидимая таблица со списком изображений, которые должны демонстрироваться. Ключевым методом формы является процедура frmPlayer_LoadData – анимированная загрузка очередного изображения из списка:

procedure frmPlayer_LoadData;
// загрузка данных
var
  tmpRow: integer;
  i: integer;
begin
  tmpRow := frmPlayer.tgrImageList.SelectedRow;
  if tmpRow <> -1 then
  begin
    if not frmFrame1.Visible then
    begin
      ImageEdit_LoadImageFromBase( frmFrame1.imgMain, StrToInt(frmPlayer.tgrImageList.cells[0,tmpRow]), IE_FT_ORIGINAL, IE_IT_IMAGE);
      frmFrame1.AlphaBlendValue := 0;
      frmFrame1.Show;
      frmPlayer.Show;
      for i := 0 to 127 do
      begin
        frmFrame1.AlphaBlendValue := i*2;
        Application.ProcessMessages;
        sleep(5);
      end;
      frmFrame2.Visible := False;
    end
    else
    begin
      ImageEdit_LoadImageFromBase( frmFrame2.imgMain, StrToInt(frmPlayer.tgrImageList.cells[0,tmpRow]), IE_FT_ORIGINAL, IE_IT_IMAGE);
      frmFrame2.AlphaBlendValue := 0;
      frmFrame2.Show;
      frmPlayer.Show;
      for i := 0 to 127 do
      begin
        frmFrame2.AlphaBlendValue := i*2;
        Application.ProcessMessages;
        sleep(5);
      end;
      frmFrame1.Visible := False;
    end;
  end;
end;
Code language: PHP (php)

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

Продолжение следует…