Page 1 of 1

Product Grid with Image

Posted: Sun Jul 05, 2015 2:04 pm
by yashmangupta

Hi,

I am new to Appery world and also to the mobile app development, so need some help. I have gone through the Tutorials and based on that achieved what I wanted so far. Now, I want to achieve the attached layouts. Can you please guide what components should I use to achieve the same results, basically the responsiveness according to the screen size.

Image 1: In Mobile Vertical view, should only show 2 Products

Image

Image 2: In Tablet Vertical should show 4 products with SlidePanel hidden

Image

Image 3: Tablet Horizontal
Image

Appreciate


Product Grid with Image

Posted: Sun Jul 05, 2015 3:37 pm
by Evgene Karachevtsev

Hello yashmangupta,

You may call the following JS code:
preAppery("component name").css("height","100%");
Appery("component name").css("width","100%"); /pre


Product Grid with Image

Posted: Sun Jul 05, 2015 3:45 pm
by yashmangupta

Thanks but which container component should I use. I have tried Grid and dragged the image and label component inside to show and fixed the image size to 30px x 30 px but when in run mode, image exceeds the phone area.

Appreciate your help.


Product Grid with Image

Posted: Sun Jul 05, 2015 5:22 pm
by Evgene Karachevtsev

yashmangupta,

Yes, you should use image and label inside a grid. You may set property auto to them to display as you want.
Could you please clarify your second issue with more details? Perhaps screenshots will help us to better understand it.