Перейти к содержанию
Fire Monkey от А до Я

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


Brovin Yaroslav

Рекомендуемые сообщения

  • Администраторы

Описание:

  • Назначение: Компонент - слайдер, предназначенный для отображения по очереди картинок из набора
  • Поддерживаемые платформы: 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

Ссылка на комментарий
  • 6 месяцев спустя...
  • Модераторы

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

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

Не могу запустить проект на 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:

Ссылка на комментарий
  • 1 год спустя...

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

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

Ссылка на комментарий
  • 2 месяца спустя...
  • Администраторы
В 22.09.2016 в 18:58, FeLDMARShaL сказал:

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

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

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

Ссылка на комментарий
  • 1 месяц спустя...

Добрый день!

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

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

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

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

 

Ссылка на комментарий
  • 5 месяцев спустя...
В 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?

 

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

Ссылка на комментарий
  • 1 месяц спустя...

Добрый день!

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

Ссылка на комментарий
  • 2 месяца спустя...

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

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

Ссылка на комментарий

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

Ссылка на комментарий

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

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

 

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

Ссылка на комментарий

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

Цитата

 

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

FGX.FlipView.Sliding.pas

 

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

Ссылка на комментарий
  • 3 недели спустя...

Присоединяйтесь к обсуждению

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

Гость
Ответить в этой теме...

×   Вставлено с форматированием.   Вставить как обычный текст

  Разрешено использовать не более 75 эмодзи.

×   Ваша ссылка была автоматически встроена.   Отображать как обычную ссылку

×   Ваш предыдущий контент был восстановлен.   Очистить редактор

×   Вы не можете вставлять изображения напрямую. Загружайте или вставляйте изображения по ссылке.

×
×
  • Создать...