CODEWITHSUNDEEP
iosstoryboardinterface-builderwatchkitapple-watch
Sagar S. Kadookkunnan
Sagar S. Kadookkunnan

Reputation: 673

How to make Apple Watch center aligned UI as given in Apple Videos

I am trying to implement a UI in apple watch similar to what Apple shows in their videos.

I would like to show this in the GlanceInterfaceController as well as Apple Watch app's regular Interface Controller. I tried to group the label(WKInterfaceLabel) and image(WKInterfaceImage) objects using the WKInterfaceGroup object, however the view is not coming as both center aligned. Could you please give me some tips on how to implement it using Storyboard (interface builder). Also in the Interface builder, it is not allowing me to place a label(WKInterfaceLabel) on top of the image(WKInterfaceImage) object.

Expected UI (almost):

enter image description here

Developed UI (using Interface builder and Storyboard):

enter image description here

Is it due to some mistake in my Layout implementation?

Thank you in advance!

Upvotes: 0

Views: 738

Answers (1)

Tiago Almeida
Tiago Almeida

Reputation: 14237

You can do that in several ways.

One of the easiest and fastest way is to put your elements inside a group and use the image for the group background.

Another way you can do that is generating an image with the text inside using something like this example from Apple.

Upvotes: 2

Related Questions