Welcome!

Welcome to the official BlackBerry Support Community Forums.

This is your resource to discuss support topics with your peers, and learn from each other.

inside custom component

Native Development

Reply
Developer
Posts: 541
Registered: ‎05-17-2009
My Device: Not Specified

Snapping horizontal list view to center of screen

I have a horizontal ListView and when I swipe, the cell always sticks to the right edge of the screen, showing part of the cell that is to the left but not showing any of the cell that's to the right. I would like this cell to be centered in the middle of the screen so that the cells on either side of the cell in focus partially show.

 

Any ideas on how I can accomplish this?

 

Thanks,

Scott

Developer
Posts: 1,524
Registered: ‎12-18-2012
My Device: Z30, Z10 LE, DevAlpha C, PlayBook

Re: Snapping horizontal list view to center of screen

AFAIK this is currently not supported. I had to fake snap-to-center mode while implementing the spinner control by cutting cell backgrounds in the middle and using LeadingEdge snap mode.

Andrey Fidrya, @zmeyc on twitter
Developer
Posts: 541
Registered: ‎05-17-2009
My Device: Not Specified

Re: Snapping horizontal list view to center of screen

I am not above faking it Smiley Happy

 

I'm not sure I quite understand. Do you mean you decrease the size of the background of the cell that should be centered?

 

Thanks,

Scott

Developer
Posts: 6,152
Registered: ‎07-05-2012
My Device: Playbook, Dev Alpha C, Z10 LE, Z30
My Carrier: Orange

Re: Snapping horizontal list view to center of screen

For stokLocker I wrote my own CustomControl but then I also wanted the center to overlap the left and right images.

 


If you've been helped click on Like Button, if you've been saved buy the app. Smiley Happy

Developer of stokLocker, Sympatico and Super Sentences.
Developer
Posts: 1,524
Registered: ‎12-18-2012
My Device: Z30, Z10 LE, DevAlpha C, PlayBook

Re: Snapping horizontal list view to center of screen

spinnerTop.png (note the empty space at the top):

 

spinnerMiddle.png:

 

spinnerBottom.png (has some empty space at the bottom!):

When they are split like this, snapping to top produces "snap to center" effect. It's a really weird workaround, but I haven't found any simpler method. 

 

This is how the final control looks like:

 

 

 


Andrey Fidrya, @zmeyc on twitter
Developer
Posts: 541
Registered: ‎05-17-2009
My Device: Not Specified

Re: Snapping horizontal list view to center of screen

Ahh I see! Thanks for the great visuals. That is a great idea.

 

I actually need to show the next cell over though because I'm trying to force the UI to pre-render that cell. The goal is that the cell is fully rendered when the user swipes left or right. The only way I know how to do this is to show it (at least partially) on the screen.

 

Scott

Highlighted
Developer
Posts: 293
Registered: ‎10-15-2012
My Device: bb10 developer
My Carrier: Orange

Re: Snapping horizontal list view to center of screen

This is definitely possible

Use padding on the listview (on whichever side you need to) to force the 'current' item into the middle of the list.
Developer
Posts: 6,152
Registered: ‎07-05-2012
My Device: Playbook, Dev Alpha C, Z10 LE, Z30
My Carrier: Orange

Re: Snapping horizontal list view to center of screen

[ Edited ]

If you do fancy writing your own then this example is a good starting point to writing a flexible carousel like horizontal scroller, obviously you can strip out the QT parts, circular imagery, the scaling aspects and overlapping if you desire...

 

https://github.com/blackberry/Cascades-Community-Samples/tree/master/stumpers/bbjamcarousel

 

Now I've written this, hacking it with padding sounds a lot easier. Smiley Happy


If you've been helped click on Like Button, if you've been saved buy the app. Smiley Happy

Developer of stokLocker, Sympatico and Super Sentences.
Developer
Posts: 541
Registered: ‎05-17-2009
My Device: Not Specified

Re: Snapping horizontal list view to center of screen

Use padding on the listview (on whichever side you need to) to force the 'current' item into the middle of the list.

 Padding would increase the visual space between cells, wouldn't it? I can't have a gap between cells.

 

Scott

Developer
Posts: 293
Registered: ‎10-15-2012
My Device: bb10 developer
My Carrier: Orange

Re: Snapping horizontal list view to center of screen

No. Simply put padding on the ListView component itself, not on the items.