In React and other web front-end frameworks, there is the concept of 'conditional rendering'. You render certain elements of the UI to the DOM based on certain conditions being true or not.
How does the concept of conditional rendering work in Xcode / Swift? Since you apparently build the UI on the storyboard, I don't know how to conditionally render elements.
A specific example: Let's say I've got an array of arrays and for each array in the array I want to render a tableview. How would I approach this problem?
Short answer: "It doesn't." That's not how iOS works.
Edit:
You can certainly write code that builds your UI from code, and if you do that, you're free to use conditional logic to decide what elements to add to your UI.
In fact, SwiftUI uses code to build a UI, and is a reactive style development platform. You should look into that.
A UITableView, as in your example, is a data-driven UI element. It uses a data source to decide what cells to display. Depending on the types of entries in the data source, it might create different types of cells. That is similar to what you describe.
It doesn't really make sense to have multiple table views on screen at once, so I'm not sure what "...for each array in the array I want to render a tableview" would look like.
I guess you could write a view controller that had a scroll view as it's content view, and when it loaded, it took your array of arrays, and used the outer-most array to decide how many instances of table views (or table view controllers, better yet) to instantiate. It would create table views/table view controllers in a loop, and install their views into the scroll view, keeping track of the geometry. Altnernately, you could put the table views in a stack view, and put the stack view into a scroll view.
However, the UX would be awkward. The user would need to drag up and down inside each table view to navigate inside it, and also drag up and down on the scroll view in order to move between table views.
Let's say I've got an array of arrays and for each array in the array I want to render a tableview. How would I approach this problem?
You would write code—presumably, Swift code, since you used the swift tag.
Let's make it even more concrete. You have a Bookcase object which has an array of Shelf, and each Shelf has an array of Book.
If you're using a storyboard, you can have a ShelfController scene in your storyboard with a single table view to display the Books in one Shelf. You can also have a BookcaseController scene with (let's say) a stack view. The stack view has no subviews because you don't know, when designing the storyboard, how many shelves you'll need to display.
Then, in Swift code, when BookcaseController is given its Bookcase model object, the BookcaseController instantiates the ShelfController scene once for each Shelf in the Bookcase. It adds each ShelfController as a child view controller, and adds each ShelfController's view (a table view) as an arranged subview of its (the BookcaseController's) stack view.
Let's say I've got an array of arrays and for each array in the array I want to render a tableview. How would I approach this problem?
You'd probably display a list of all the arrays (or whatever each array corresponds to) and a table. When the user selected one of the things in the list, you could then set the table view's data source to use the corresponding array.
That's not the only way, of course. If you really want to draw different tables for each array in the list, you can do that — you're in charge of your code. But why make things more complicated?
Since you apparently build the UI on the storyboard, I don't know how to conditionally render elements.
Storyboards aren't the only way to build a UI, and they're also a lot more flexible than just a static collection of elements. A storyboard is essentially a collection of connected scenes, where each scene is a template for a screenful of content. But your code can adjust the objects in a scene, including hiding or showing them, changing their position, and adding ore removing views. So if you want you could have a scene with a different table for each of the items in your list, and then just adjust the visibility of the various tables according to whatever thing is selected. Or you could have no tables at all, and your code could create one on the fly and insert it into the view.
In short: you're assuming too much about how storyboards work. Start reading about how view controllers work and you'll soon have a much better understanding of the kind of control you have over the UI.
Related
I'm completely new to swift and Xcode and everything regarding iOS development. I have a UITableView that populates UITableViewCells, I've been able to graps the fundamentals of that. But what if I wanted to add an extra cell at the bottom upon every visit?
I guess it's a mix of dynamic and static, but I can't find any answers whether this is case as of present date, since information in threads shows discrepancy.
You need to use dynamic table view. For example you have an array with some elements and your table view is displaying them. If you want to add a cell on the bottom, simply add another element to your array and then call self.tableView.reloadData()
The output of this tableview not appearing correctly.what is the reason to come like that
So the tableView that you just drag into a view will have default properties associated with it. When you run it on a phone/sim it doesn't actually have the 'Table View' heading (that's just there to make it easier to design the storyboard), it'll have a white background with no rows and will look like there's nothing on the screen. Furthermore it may not even be at the location you placed it at depending on how the constraints default when rendering the scene.
It seems like you have a little to learn about how this works. When creating a new storyboard, generally speaking you associate a ViewController class to it. Assuming you have dynamic data to display on the table, you connect references to the tableView to the class, then you need to assign a delegate to the table and then implement the protocols. Then if you have custom cells, it adds a little more to do. Theres several great tutorials from Apple itself on how to do all this in swift.
If you just want to see how the table would look; in the storyboard itself you can create prototype cells in the table and design it out that way.
Either way, make sure you read about constraints and how to make it look right when rendering on a phone. Just dragging things onto the story board does not mean that when you finally run it, it will look exactly as you designed it. You need to specify how components align relative to each other, which is essentially what constraints do.
I am attempting to make a custom view that looks like the attached picture. The top two cell would be static while the bottom three would scroll if there are more than the screen can fit, and only scroll within that given area. I am wondering what the best approach is to making these types of custom views. I know how to make custom UItableviewcells and have custom content in them, but I am struggling with an overall strategy to make a custom UITableview that has certain cells be static and others scroll. Should I just implement a table view to be part of the screen in storyboards? Or are there better ways to do so?
I would do this by making the top two "cells" just be UILabels, and the bottom a table view where both the cells and the table view would have a clear background. The table view should be set to have no separators between the cells, and the cells should have a UILabel with a background cooler the same as the top UILabels.
This was the result:
I normally do not like to use story board much. And prefer SubClassing UIView. It might take more time to code at first but in a long run it is easier and very dynamic to control the UI programmatically.
In your problem I would make two static UIView(s). If the two view are similar the advantage of using UIView class is that you can use same class with different data model to generate multiple views. But if you use story board you need to copy past multiple times. Hence try to create UIViews class objects as much as possible.
And then the bottom one will be a simple table view. Do not think there is much you can do in this case. Do submit some codes you have done so that we can better refine it.
Hi guys i have added a picker view to pick areas from it.This picker view contains more than 200 areas so it is difficult to scroll and select from picker view.
Is there any way to add a search bar and connect it with picker view?
I tried doing this by using search bar delegate method by overriding it but i am not able to achieve the goal.
So please help me so that i can do it or if any another way possible then also tell me.
Picker view is for small number of selection. Use table view instead for such big number of options.
Just to back up my statement, the Apple Human Interface Guideline says
Consider using a table view, instead of a picker, if you need to display a very large number of values. This is because the greater height of a table view makes scrolling faster."
I agree with barley that the PickerView is an awful vehicle for large selections; if at all possible to use something else, that would be appropriate and best, but having said that:
The YHCPickerView looks promising from:
http://code4app.net/ios/PickerView-with-Search-Bar/509fb2e86803faf25c000000
From a cursory view of that class, it appears that it has several different and distinct UI elements, the text field for collecting search criteria, the button for enacting the search, and the basic picker view. The search criteria simply and directly filters the picker data/model when the button pressed event occurs. That way you are simply editing the actual data from the picker.
If you handle each of these separately it should make it simpler to create what you want, since you only have to handle the basic functions and delegates of each individual UI element and linking together their effects rather than trying to hijack an existing delegate.
-Cheers
I'm writing a simple iPhone app which lets a user access a series of calculators. It consists of the following:
UITableViewController (RootViewController), with the list of calculators.
UIViewController + UIScrollView (UniversalScroller), which represents an empty scroll view - and has a 'displayedViewController' property.
UIViewController (Calculators 1-9), each of which contains a view with controls that represents a particular calculator. Each calculator takes 3-5 values via UITextFields and UISliders, and has a 'calculate' button. They can potentially be taller than 460px(iPhone screen height).
The idea is:
User taps on a particular menu item in the RootViewController. This loads and inits UniversalScroller, ALSO loads and inits the UIViewcontroller for the particular calculator that was selected, sets the displayedViewController property of UniversalScroller to the newly loaded calculator UIViewcontroller, and pushes the UniversalScroller to the front.
When the UniversalScroller hits its 'viewDidLoad' event, it sets its contentSize to the view frame size of its 'displayedViewController' object. It then adds the displayedViewController's view as a subview to itself, and sets its own title to equal that of the displayedViewController. It now displays the calculator, along with the correct title, in a scrollable form.
Conceptually (and currently; this stuff has all been implemented already), this works great - I can design the calculators how I see fit, as tall as they end up being, and they will automatically be accommodated and displayed in an appropriately configured UIScrollView. However, there is one problem:
The main reason I wanted to display things in a UIScrollView was so that, when the on-screen-keyboard appeared, I could shift the view up to focus on the control that is currently being edited. To do this, I need access to the UniversalScroller object that is holding the current calculator's view. On the beganEditing: event of each control, I intended to use the [UniversalScroller.view scrollRectToVisible: animated:] method to move focus to the correct control. However, I am having trouble accessing the UniversalScroller. I tried assigning a reference to it as a property of each calculator UIViewController, but did't seem to have much luck. I've read about using Delegates but have had trouble working out exactly how they work.
I'm looking for one of three things:
Some explanation of how I can access the methods of a UIScrollView from a UIViewController whose view is contained within it.
or
Confirmation of my suspicions that making users scroll on a data entry form is bad, and I should just abandon scrollviews altogether and move the view up and down to the relevant position when the keyboard appears, then back when it disappears.
or
Some pointers on how I could go about redesigning the calculators (which are basically simple data entry forms using labels, sliders and textfields) to be contained within UITableViewCells (presumably in a UITableView, which I understand is a scrollview deep down) - I read a post on SO saying that that's a more pleasing way to make a data entry form, but I couldn't find any examples of that online. Screenshots would be nice. Anything to make my app more usable and naturally 'iPhone-like', since shuffling labels and textboxes around makes me feel like I am building a winforms app!
I've only recently started with this platform and language, and despite being largely an Apple skeptic I definitely see the beauty in the way that it works. Help me solve this problem and I might fall in love completely.
Dan
If you have the particular calculator view, you should be able to get to the scroll view via the superview property (though there might be more than one intermediate view, so you might need the superview of the superview).