Primeng: New Galleria

[harshaldhake]

when using Gallery component in mobile version, It add horizontal scrollbar and width become more than width of mobile screen width.

It should be responsive. Issue can be replicated in current theme(Ultima) as well.

Can u plz let us know when it can be fix?

Thanks

I'm submitting a ... (check one with "x")

[ ] bug report => Search github for a similar issue or PR before submitting
[ ] feature request => Please check if request is not on the roadmap already https://github.com/primefaces/primeng/wiki/Roadmap
[ ] support request => Please do not submit support request here, instead see http://forum.primefaces.org/viewforum.php?f=35

Plunkr Case (Bug Reports)
Please fork the plunkr below and create a case demonstrating your bug report. Issues without a plunkr have much less possibility to be reviewed.

http://plnkr.co/edit/VZbdZfQ7SuTV87tTkbYR?p=preview

Current behavior

Expected behavior

Minimal reproduction of the problem with instructions

What is the motivation / use case for changing the behavior?

Please tell us about your environment:

• Angular version: 2.0.X
  

• PrimeNG version: 2.0.X
  

• Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]
  

• Language: [all | TypeScript X.X | ES6/7 | ES5]

• Node (for AoT issues): node --version =

[harshaldhake]

Hi Catagay,

Is there any plan for this enhancement?

[Sjerd]

You can do this with a hostlistener:

  @HostListener('window:resize', ['$event'])
  onResize(event) {
    this.width = event.target.innerWidth;
    this.height = event.target.innerHeight - 50;
  }

The - 50 is the height of the filmstrip in the gallery.
where width and height are the size properties of the gallery:

    <p-galleria
      [images]="images"
      [panelWidth]="width"
      [panelHeight]="height"
    ></p-galleria>

[quekqh]

there's still spacing between the gallery and filmstrip in mobile view. Any advice?

[cagataycivici]

In 9.1.0, we'll reimplement the Galleria, it will be like we recently did for PrimeReact.

https://primefaces.org/primereact/showcase/#/galleria