Brovin Yaroslav

Описание TfgFlipView - слайдер изображений

В теме 23 сообщения

Описание:

  • Назначение: Компонент - слайдер, предназначенный для отображения по очереди картинок из набора
  • Поддерживаемые платформы: Windows, OSX, iOS, Android
  • Демо проект: Samples\FlipViewDemo\FlipViewDemo.dproj
  • Доступен с версии: XE8

Возможности:

  1. Два принципиально отличающихся способа смены изображения: Эффекты (21 эффект) и сдвиги (горизонтальный и вертикальный)- Mode.
  2. Доступно редактирование скорости смены изображений (SlideOptions.Duration) и направления (SlideOptions.Direction) для режима смены изображения путем сдвига.
  3. Доступно редактирование скорости смены изображений (EffectOptions.Duration) и эффекта (EffectOptions.Kind) для режима смены изображения при помощи эффектов.
  4. Контролирование начала и окончания процесса смены изображений: OnStartChangingOnFinishChanging
  5. Доступен режим Слайдшоу, когда изображения меняются с интервалом (SlideShowOptions.Duration)
  6. Для эффектов возможно выбора случайного эффекта на каждый слайд 
  7. Пролистывание изображений жестом - pan (swype)
  8. Отлавливание момент нажатия на слайд OnImageClick
  9. Управление видимостью кнопок смены слайдов ShowNavigationButtons

post-1-0-93012800-1423921520_thumb.png

post-1-0-04067300-1423921522_thumb.png

post-1-0-58613800-1423921558_thumb.png

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Шикарная тема. Когда можно будет затестить?

 

После выхода XE8, в новой версии компонентов FGX.

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Как динамически добавлять картинки в этот компонент?

На андроиде не работает?

Не могу запустить проект на android'e пустой экран

 

 

Чтобы заработало на Android нужно стиль грузить в ресурсы...

 

Ярослав, Вынесите в след. версии два метода в public (нижний)

    procedure GoToNext(const Animate: Boolean = True);
    procedure GoToPrevious(const Animate: Boolean = True);

чтобы можно было реализовать переключение картинок жестами

 

ещё вот эти не помешают

    function IsFirstImage: Boolean;
    function IsLastImage: Boolean;

Вот еще может реализуете такую штуку, в режиме слайда и ImagesCount = 1 чтобы не переключались картинки

procedure TfgFlipViewSlidingPresentation.ShowNextImage(const ANewItemIndex: Integer; const ADirection: TfgDirection; const AAnimate: Boolean);
begin
  AssertIsNotNil(Model);

  inherited;
  if (csDesigning in ComponentState) or not AAnimate then
  begin
    if ImageContainer <> nil then
      ImageContainer.Bitmap.Assign(Model.CurrentImage);
    Model.FinishChanging;
  end
  else
  begin
    if Model.ImagesCount = 1 then
    begin
      exit;
    end;

    if (FNextImageContainer <> nil) and (FNextImageAnimator <> nil) and (FImageAnimator <> nil) then
    begin
      FNextImageContainer.Bitmap.Assign(Model.CurrentImage);
      InitAnimatorParams(ADirection);
      FImageAnimator.Start;
      FNextImageContainer.Visible := True;
      FNextImageAnimator.Start;
    end;
  end;
end;
Изменено пользователем ZuBy

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Не вопрос. Спасибо за предложения. Добавлю в следующей версии.

Только не очень понял на счет вынести в паблик. О каком классе именно идет речь?

 

IsFirstImage и IsLastImage тоже в паблике у модели уже.

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Не вопрос. Спасибо за предложения. Добавлю в следующей версии.

Только не очень понял на счет вынести в паблик. О каком классе именно идет речь?

 

IsFirstImage и IsLastImage тоже в паблике у модели уже.

из модели в основной в класс, для большего удобства

 

это для GoToNext, GoToPrevious

У Вас два public

TfgCustomFlipView = class(TPresentedControl, IfgFlipViewNotifications)
... 
public
    constructor Create(AOwner: TComponent); override;
    destructor Destroy; override;
    function CanSlideShow: Boolean;
    { Manipulation }
    procedure GoToImage(const AImageIndex: Integer; const ADirection: TfgDirection = TfgDirection.Forward;
      const Animate: Boolean = True);
    property Model: TfgFlipViewModel read GetModel;
  public
    // тут видет это методы
    procedure GoToNext(const Animate: Boolean = True);
    procedure GoToPrevious(const Animate: Boolean = True);

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

А в чем смысл переноса двух методов из паблика в паблик?

в том что они не доступны были пока не перенес ниже :ph34r:

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

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

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

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
В 22.09.2016 в 18:58, FeLDMARShaL сказал:

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

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

Пока нет. Но я сам подумываю добавить такой эффект.

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
В 07.12.2016 в 20:31, Brovin Yaroslav сказал:

Но я сам подумываю добавить такой эффект.

былобы просто шикарно

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Добрый день!

Спасибо за отличный компонент! Хорошая работа!

Хотел бы узнать: при сворачивании приложения и разворачивании вновь спустя непродолжительное время, на Андроид наблюдается "выпадание" картинки: она просто становится черной.

Применение метода Repaint не спасает...

Возможно ли "вылечить" в следующем обновлении?

 

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
В 27/01/2017 в 08:08, ra.eremeev сказал:

Bom dia!

Obrigado por uma grande componente! Bom trabalho!

Eu gostaria de saber: quando o aplicativo é dobrar e desdobrar novamente após um curto período de tempo, não é sobre o Android "cair fora" imagens: ele simplesmente se torna negro.

Método Repaint aplicação não salva ...

É possível "curar" na próxima atualização?

 

У меня та же проблема, удалось решить?

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Добрый день!

Да, решил с использованием "костыля": при смене изображения (событие компонента) происходит полная перерисовка изображения

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Ещё не пробовал. Но есть вопрос. Может ли слайдер менять изображения смахиванием, как это делают все стандартные андроид-галереи - пальцем влево/вправо?

Или для этого нужно что-то дописывать?

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Со смахиванием разобрался - работает.

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Вопрос вот в чем.

Слайдер растягивает картинку, что очень не красиво.

Как отключить, чтобы картинка вписывалась в размер слайдера?

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Была такая проблема, идеальное решение - залезть во внуторь стиля компонента, и там у имиджа изменить свойство отвечающее за растягивание на fit к примеру

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Я стили так и не смог подключить. Добавил в проект ресурсы.

Делал по инструкции вроде, но в списке в инспекторе свойств нет добавленных стилей.

 

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

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

когдато мне Ярослав помог с этим вопросом, вот его ответ (актуально для режима слайдинга):

Цитата

 

procedure TfgFlipViewSlidingPresentation.ApplyStyle;
Нужно задать WrapMode для ImageContainer и FNextImageAnimator

FGX.FlipView.Sliding.pas

 

Мне помогла, если у Вас дургой режим, там по аналогии другой модуль поправить придется

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Автор, Вы поправите проблему с неправильным растягиваем картинок?

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Запустил демку. Ничего не происходит.

Screenshot_11.png

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
Project raised exception class EArgumentOutOfRangeException with message 'Argument out of range'.

Если нет картинок и нажать на кнопку пролистывания, то вываливается ошибка

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Для публикации сообщений создайте учётную запись или авторизуйтесь

Вы должны быть пользователем, чтобы оставить комментарий

Создать учетную запись

Зарегистрируйте новую учётную запись в нашем сообществе. Это очень просто!

Регистрация нового пользователя

Войти

Уже есть аккаунт? Войти в систему.

Войти

  • Похожий контент

    • От x11
      У слайдера у каждой картинки есть свойство name.
      Но визуально у слайдера не вижу, чтобы оно во время работы программы где-то отображалось.
      Что/где настроить, чтобы отображалось это свойство у слайдера?
    • От x11
      Компонента  TfgFlipView растягивает изображение. Не красиво. А как сделать, чтобы оно было в своём правильном масштабе?
  • Последние посетители   0 пользователей онлайн

    Ни одного зарегистрированного пользователя не просматривает данную страницу