“条件渲染”如何在 Swift/Xcode 中工作？

Question

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?

Answer 1

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.

Answer 2

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.

Answer 3

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 Book s 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.