My application gathers input from users and hence it is full of Labels, text boxes and buttons and I have to show or hide set of labels and text boxes based on certain conditions.
To accomplish it, I did the following.
Set fixed height (lets say 30) for all the controls
Set height constraint on each of the controls and created an outlet to the height constraint in the ViewController
Alter the heightConstraint.constant value programatically (between 0.0 and 30.0) based on the scenarios.
Having programmed like this, it is very difficult for me if there is any change in layout. (i.e., if user requested to add/remove any particular control from the view Controller).
I am using Auto Layout constraints. Could anyone suggest if there is a better way to accomplish my goal.
I am using IOS9 and Swift.
Many thanks in advance.
You can use UITableViewController with static cells for this case.
For hide/show row or section, you can change the size in the tableView:heightForRowAtIndexPath method.
UITableViewController automatically manages the layout and with static cell you can even create outlet for all the controls.
Have you considered using a table for this? It has mechanisms for inserting and deleting rows and would manage the layouting for you - only part you'd need to care about are the contents of the cells.
Instead of making IBOutlets to the height constraints of all the views that you might need to hide, you can just use the hidden property of UIViews to hide/show the view.
In case you need the view to make space for other views, you could set a simple animation and move the view out of screen bounds. You might face issues with layout constraints but it's surely worth the effort from a UI/UX perspective.
Additionally, if you know that you don't need a view any more you can even remove the view from it's superview.
Related
I am building an app about meetings where I want to show a preview of the VIP participants in each meeting cell.
These participants are not clickable nor scrollable, the only purpose it's to quickly see them at a glance.
The problem is that the view is very dynamic:
VIP's appear with image or initials
The rest of the attendees is just a number
if >5 VIP's, the circles start going together overlapping (spacing goes smaller)
if 9 VIPs, big wrapping circle “All VIPs in Attendance"
This is how it will look:
What should I do?
CollectionView (seems over-kill as I am not interested in any kind of interaction with the images)?
StackView?
Images (and change constrains programmatically)?
NOTE:
These is just one kind of Table View Cell, but we have a lot more variations, so we are building the custom cells in xib files. Xcode doesn't allow me to add a Collection View Cell in to the Collection View within the xib.
Interesting task - I'm sure there are numerous approaches, but here is one using UIStackView plus some on-the-fly calculations.
The idea is to define a maximum gap between views; a maximum width for all views; calculate the actual gap needed, and then let UIStackview handle the actual positioning.
Certainly not every feature you need, but should get you going in the right direction.
You can see/download the source for this here: https://github.com/DonMag/ScratchPad
Look at the Swift3/SpreadingViews sub-project for this example.
The problem with scrollable views (UIScrollView based views as UICollectionView), is that you will have to deal with the scroll, or pre-compute the width of your content, which is not always easy. For this reason, if you don't want to have scrollable content, I'd not use a UICollectionView, neither any UIScrollView based view.
Then you have the option to go with an UIStackView. Stack views are great to "append" multiple views and create some kind of "pile" of views in a very easy way. However, if you don't control how many items you need, you will overpass the boundaries of your container view.
Therefore, this is what I'd do:
"Fixed container view width" case: If your container view (your cell) has a fixed width (that never changes), I'd manually add as many UIImageViews I want to support in the XIB itself, and then hide/unhide them depending on the number of items I want to display.
"Variable container view width" case: If your container view (your cell) has a variable width (that changes depending on the screen size or whatever other factor), then you will have to compute in any case (do the math!) the amount of items you are able to display within the width you have available. Then, you can choose between using an UIStackView or adding your views & constraints manually to your container view.
Does what I say make sense?
Thanks,
some elements from my storyboard don't appear since I change the viewcontroller size to 4.7inch. But if I create another viewcontroller and I put some object inside, they are appearing. What's wrong with these viewcontrollers?
This is because the UI elements or constraints you have added to the view controller with specific size class will become inactive while to change to some other size class. for example the UI elements or constraints added to view controller with compact width | Any height will become inactive while you change to Any width | Any height.
You can enable it by checking the option in your attribute inspector[scroll down to the bottom]. Please refer to the screen shot.
If you want to display all your objects in different size classes, you should use auto layout....it manage your object to display in different size classes...
So, The solution to prevent your object to hidden from different size classes, use autolayout
Here is the image...that explains better than words
In this image I gave autolayout to button using wAnyhAny...for best practice..
I've been using the old way of doing things for quite a while, by setting the origin and size on individual frames and putting things exactly how I want them on the screen. Now i'm trying to move to using AutoLayout. But I'm having a bit of trouble that I cant seem to find an exact answer for.
I'm used to mainly using code for creating views and view controllers. As such, I've come familiar with creating custom view classes which combine multiple views to my liking. For example, i have a custom Profile Pin view that combines a UIImageView and a UILabel into one view to represent a profileImage and username. I then use these custom views in different places as a part of other views and view controllers.
It seems to me that autolayout is intended for views that need re-adjust sizing when screen orientation changes, or for readjusting subviews for different screen sizes.
My question is, should I be meticulous and use autolayout for custom views that have static placement and sizes? Like the UIImageVIew and the UILabel view in the Profile Pin view I described? The positions for the UIImageView and the UILabel view wont change, but the position for the Profile Pin view (their parent) probably will. Should I be using Autolayout for everything? Or is this not a situation that AutoLayout was intended for?
If your custom view has static contents where the size and position of it's subviews never change, then feel free to stick with manual frames internally. There's not much benefit to Autolayout in that case.
What you should do, though, is override intrinsicContentSize and return the correct size. This allows any parent view to use Autolayout to position and know the size of your custom view.
Many UIKit components use this technique - UISwitch being a prime example.
I have a UIView, defined in a nib, and I need to be able to show/hide a middle button in that view. When I show the button, I need to reposition the two bottom buttons below it, as well as make the view taller to make room for everything. When I hide the middle button, I need to move the two bottom buttons up and vertically resize the view to make it less tall. I do NOT need to animate any of this since it the changes will never occur while the view is visible to the user.
I'm new to iOS and I'm used to using Autolayout, but I can't use Autolayout in this case to handle this automatically, so my current approach is to hardcode the frame position and dimensions for the two bottom buttons for each of the two different situations. I'm also hardcoding the two different frame sizes for the view itself. In viewDidLoad, I determine if I need to show/hide the middle button and set the frames for the view and bottom buttons appropriately. This works, but if feels hacky. Is there a better way I should be doing this?
Thanks in advance for your wisdom!
You don't need to hardcode your frame sizes in viewDidLoad. The only thing you should take care of is determining that whether you need to show you middle button or not. Within the implementation file where you are allocating your UIButtons, check if the middle button has to be shown, if Yes allocate it, if not then don't. The frames of two buttons and the view should contain a factor which can set/size them accordingly.
You'd basically be managing the Auto-layout programmatically. And if you're not even allowed to that then whatever else you'd end up doing would pretty much be a hack.
I have a UIScrollView with multiple subviews representing rows (similar to a UITableView). I want to insert a new view underneath one of my rows. If I were using a UITableView I would simply use tableview:insertRowsAtIndexPaths:withRowAnimation: to insert a row at a particular index. What is the best way to replicate this behavior? My only thought at the moment is to iterate through all the subviews beneath my new view and push each frame down by Y (height of view I am inserting). Is there any way to make my subviews self aware of their surroundings (much like inserting a DIV in HTML) so I do not have to explicitly specify the frame of each view?
My advice here is to make your life easier and use a UICollectionView with a flow layout.
It's very flexible and it allows you to easily manage insert/deletion of items.
Another approach with you custom UIScrollView would be to use Auto Layout to specify the relative constraints between the newly inserted view and the surrounding ones. Animating the layout change will likely give you the desired effect.