CODEWITHSUNDEEP
iosobjective-cuitableviewuser-interfaceuiscrollview
Logan Shire
Logan Shire

Reputation: 5103

Netflix style UIScrollView in iOS

I'm new to iOS but I have plenty of experience with C++. I'm working on a fun little game that I plan to use with gamecenter but right now I'm trying to set up my GUI. Here's a picture of what I would like to create: enter image description here

Essentially, a player has a hand of about 7 cards which they can swipe through at the bottom of the screen. I want it to snap to one card at a time, rather than just inertial scrolling, and I want them to be able to tap on a card to play it. Do you think this is doable? By the way, I currently have custom cards that are stored as a PNG/Vector back over which I place my custom text to generate the cards. Is it possible in iOS to create custom scrollview objects that are templated with my custom background and generated from a string, specified text size, and font? (Size 48 Helvetica)

Thanks!

Upvotes: 0

Views: 536

Answers (2)

Steven McGrath
Steven McGrath

Reputation: 1727

For the second part of your question, I suggest you have a look at CAShapeLayer, which handles Bezier path imaging. The base layer class, CALayer, also has a property for setting the radius for corner rounding, which will fit your cards well.

On iOS, Core Animation layers are the imaging component that go into views, and can be used and manipulated directly, but event handling is provided through full views. To use custom CALayer classes in UIViews, you override the layerClass method to return the class of CALayer you want the view to use. Layers can be nested and/or stacked within a view, so you could, for example, stack a CATextLayer over a CAShapeLayer on top of a CALayer whose contents have been set to your PNG image, within one view. However, I doubt the CATextLayer will give you the layout control you want for the cards, so you'll probably end up rendering the glyphs in the shape layer.

The Core Animation Programming Guide is worth reading.

Upvotes: 0

RegularExpression
RegularExpression

Reputation: 3541

I think I would approach this with a UICollectionView holding the cards, and just implement gesture recognizers for the gestures. There is code here to handle the "snap-to":

Stopping the scroll in a UICollectionView

The top portion of the screen is going to be a different view within the same view controller, so you'll implement the gesture recognizers in the vc to handle pans (for the slide) and taps.

This looks very straightforward to do. The collection view generally wants a single tap to indicate selection of a cell; you'll need to disable selection on the collection view to keep it from using selecting the tapped cell.

Upvotes: 1

Related Questions