iOS Autolayout: constraints for three squares - ios

I'm trying to achieve a very simple scenario using auto layout but without success. Please help me...
I need 3 squares with a dynamic size(ex: on iPad, all of them should be scaled) on a table cell.
I have spend already some hours finding a solution....
This picture showing how the view should look like:
Thanks

You can do it with autoresizing tool which is appear in size inspector.
Step1: Place your views in which ever pattern you want.
Step2: Then select a view and click on size inspector.
Step3: Click to select inner arrows of autoresizing tools rectangle and deselect outer arrows (predefined selections).
Step4: Repeat same step for the remaining squares. Thats it. Verify below image which i have done.
Do same for by placing table view in your storyboard, verify below image for which points autoresizing settings for table view clearly.

Related

Fitting a tableView into its parent UIViewController

I dropped a TableView into my ViewController using Storyboard and I want it to be filled without any margins like the lower ViewController with TableView in the image below.
I tried some suggestions from the answers in other similar questions but didn't work at all.
Some say I need to set PIN. and I tried it like below:
I've typed '0' for all 4 constraints but this is what I got:
This AutoLayout thing makes me really hard to layout things automatically, unlike it's name.
What should I do now?
Just Click on Resolve Auto layout Issues after that click on Update frames as shown into below image.
In the Document Outline, tap the yellow arrow:
Tap the yellow triangle:
Then select Update Frames, Fix Misplacement.
This will fix the misplaced view. Alternatively you could have resized the table view before specifying the constraints.
I recommend you have a look at an auto layout tutorial, for example link.

Update UIView inside a UIScrollView using Autolayout

I'm stuck on this problem since 2 days and I don't know how to proceed & I didn't find a solution on internet so I'm going to ask advices here.
My problem is about AutoLayout, UIScrollView and UIView : Please take a look on the schema I made to explain you what I want to do.
The blue box represent labels, the green box the UIScrollView and the Pink the UIView. The UIView contains a chart (using the great iOS-Charts library). The thing is, when the user scroll to the right, I add data to the chart and it becomes longer, no problem with that.
But as soon I add constraints, nothing is display.. And I would like to give the possibility to the user to see this in landscape.
The hierarchy is :
• View
• ScrollView
• LineChartView
So what constraints should I add to do that ?
Thank you very much
Based on the coments I have elaborated an answer:
First Step:
Right click from child ScrollView to parent View
Second Step:
Chose these constrains (You can select multiple at once by holding shift key) then tap on Add Constraints:
Third Step:
Drag with right click from scrollview onto itself and it will pop another message:
Forth step:
Tell him to keep current height( you can add here different constraints but it will do it for now)
As for the child UIView you can do the same and see after that what happens.
To be able to scroll please note that after you modified the size of the graph containing UIView you must also set the UIScrollView contentSize to match the graph UIView size.

Detail Text and Accessory Don't show [duplicate]

I'm trying to use Auto Layout for a custom Table View Cell in my app.
I can't seem to get the constraints quite right.
I layed the labels out in the custom Table View Cell, but the labels are still getting cut off. Any ideas?
Thanks! Will post anything else needed. Tried to show needed info in picture below:
Debugging in Xcode. Somehow what shows in Simulator looks different than in Xcode debug.
Here's the width of my TableView shown:
UPDATE:
The problem here was related to what user matt said in the accepted answer, but I wanted to make the Q&A a bit clearer now that I have it figured out for anyone else that comes across this.
In his initial comment, he mentioned the Xcode View debugging, which was great and I was able to dig into a little bit more. Its called the Assistant Editor: Device Preview, where you are able to see the layout and layers of what is onscreen to see if maybe you have labels overlapping or going offscreen based on the device it is running on. If you want to check multiple device sized, just hit the plus icon in the lower left hand corner of this picture.
This helped me find overlapping layers and sizing issues with the TableView. I was able to see how it looked on each device size.
What also helps here sometimes to use the Pin menu. Sometimes the labels can run off screen because it doesn't know where the constraints of the cell are based on the device size. So your label can run offscreen if the label is based off of a landscape layout but the device is an iPhone 5 and is in Portrait for example. This is the Pin menu:
Hope that makes sense and gives some more color to the problem. Let me know if you have any questions at all, thanks for the help everyone!
The problem is that you are using auto layout but you have not done anything about sizing the table view. The table view here is not your view controller's view; it is a subview. Your view controller's view is automatically sized to the size of the device / window, but its subviews are not automatically resized. So you are ending up with the table view much too wide for the device; the whole table is sticking off into space on the right side.
Use a trailing space from the right side of your labels to the edge of their superview, and set it to greater than instead of equals with a value of ~ 5
Review the constraints of your tableview with the View. Draw cell border, label border and tableview border with different colors to know which elements do not display correctly.
Ex:
#import <QuartzCore/QuartzCore.h>
...
cell.layer.border.width = 1;
cell.layer.border.color = [UIColor blackColor].CGColor;
The thing that worked for me to solve views being clipped was to uncheck "Constrain to margins" in Auto Layout.

UITableview blocking uiview

So I had a UITableView that I tried to make smaller by adjusting its constraints. I then added three labels and textfields to my UIView. However, upon running the app the UITableView doesn't seem to have been made smaller, instead it's "overlapping" my labels and textfields. Here is a picture of what I am describing. http://imgur.com/BoC6l1R. And here is a picture of the storyboard editor. Note the dotted lines. http://imgur.com/wUyccDk. I've tried changing many things with the constraints but they all make everything more messed up. I feel like the solution should be pretty simple. Thanks!
In the second image (the storyboard) you see there's a dotted line and a yellow line with +78. That indicated that the constraint specifies that the table view should be 78 points above where it is now. That's a warning in your storyboard meaning that the UITableView will appear in a different position at runtime.
The easiest way to solve it is to open the storyboard file, then at your left there should be the Document Outline. Find your view controller, and there should be a small yellow arrow next to the view controller name. Click on it and you'll go to a screen showing you the constraint warnings. It should say "Misplaced views". Click on the small yellow arrow next to the misplaced view (your UITableView) and a popup will appear. Select "Update Constraints" and then click on "Fix misplacement". That should do it.
However, a better way to solve it is to put a constraint between your text fields and the UITableView. Delete the constraint between the table view and the top layout guide (the one appearing yellow), then add a Vertical Spacing constraint between the UITableView and the UITextField below the Sea_State label.

Autosizing mask cant click center arrows

No doubt an obvious question for those in the know but I'm trying to make my view look nice (ie. expand vertically) on an iPhone 5. To do this I've been told I should have the autosizing mask set in such a way that all items are ticked, including the interior two arrows.
Trouble is on this particular view I can't tick those arrows, it won't let me.
Any ideas?
Here's what the image looks like:
In interface builder go to the pane on the right hand side of the screen. If you go to the 4th tab from the left:
You will probably see that you have the "Size" set to something other than "Freeform". If you set it to freeform you will then be able to set the "springs" on the view so that it fills it's superview.
Hope this helps.

Resources