Home > Software design >  Why Xcode Storyboard preview and emulator button texts are not compatible?
Why Xcode Storyboard preview and emulator button texts are not compatible?

Time:07-31

I am trying to drag and drop buttons to the storyboard. The buttons seem good in my storyboard and preview like the following; enter image description here

However, when I run the simulator, the button texts seem like the following;

enter image description here

Why the buttons are not shown to fit in the buttons of the simulator and how can I fix this?

Note: Preview and device types are iPhone13 Pro.

CodePudding user response:

I think it's because of the auto layout constraints. I am not very familiar with storyboards, if you don't set width of the view component, it seems fine on the storyboard but when compiling the view it actually has default size.

Try to set some constraints for width. Maybe it would help.

CodePudding user response:

The first thing you need to do is to create identical buttons with identical size and with identical font size.

As you can see in your project, the buttons have different sizes, but the text is the same size in all buttons.

To make it faster - you can create one button and make a copy with option drag’and’drop…

Then, you can put them in a Stack View. So, it will be easier for you to work with them in the future.

Select all buttons and make a Stack View...

https://i.stack.imgur.com/QLTJP.png

https://i.stack.imgur.com/OlOia.png

After that, resize your Stack View like you want.

Then, tap on a Stack View and clear the constraints.

https://i.stack.imgur.com/1pMT8.png

Fix the dimensions like this. But, without “Constrain to mergins”.

https://i.stack.imgur.com/8HKKF

After that, make for the Stack View - horizontally and vertically position in your storyboard.

https://i.stack.imgur.com/a29wL.png

The result is…

https://i.stack.imgur.com/mvQjg.png

Hope it’s break your problem! :)

  • Related