iOS 13 Swift Tutorial: Build a Complex UI with SwiftUI from Start to Finish



Learn how to build more complex user interfaces with SwiftUI.

? GAME DEVELOPMENT COURSE – JUST $20 ?
https://www.udemy.com/2d-games-with-spritekit/?couponCode=YOUTUBE20

? Support me on Patreon: http://patreon.com/brianadvent

➡️ Web: http://www.brianadvent.com

✉️ COMMENTS ✉️
If you have questions about the video or Cocoa programming, please comment below.

44 thoughts on “iOS 13 Swift Tutorial: Build a Complex UI with SwiftUI from Start to Finish”

  1. [
    {
    "id":1001,
    "name":"Cappuccino",
    "imageName":"Cappuccino",
    "description":"Outside of Italy, cappuccino is a coffee drink that today is typically composed of double espresso and hot milk, with the surface topped with foamed milk. Cappuccinos are most often prepared with an espresso macchine. The double espreso os poured into the bottomof the cip, followed by a similar amount of hot milk, which is prepared by heating and texturing the milk using the espresso machine steam wand. The top third of th drink consistes of milk foam; this foam can be decorated with artisticc drawings made with the same milk, called latte art.",
    "category":"hot"
    },
    {
    "id":1002,
    "name":"Espresso",
    "imageName":"Espresso",
    "description":"Espresso is both a coffee beverage and a brewing method. It is not a sprecific bean, bean blendm or roast level. Any bean or roasting level can be used to produce authentic espresso. For example, in southrn Italy, a darker roast is generally preferred. Farther north, the trend moves toward slightly lighter roasts, while out sidde Italy a wide range is popular.",
    "category":"hot"
    },
    {
    "id":1003,
    "name":"Latte",
    "imageName":"Latte",
    "description":"In Italy, caffe latte is almost always prepared at home, for breakfast only. The coffe is brewed with a stovetop moka pot and poured into a cup containing heated milk. (Unlike the 'international' latte drink, the milk in th Italian original is generally not foamed, and sugar is added by the drinker, if at all).",
    "category":"hot"
    },
    {
    "id":1004,
    "name":"Iced coffee",
    "imageName":"IcedCoffee",
    "description":"Iced coffee is a type of caffee beverage servaed cilled, brewed variously with the fundamental division veing cold brew – brewed the coffee cold, yielding a different flavour, and not requiring cooling – or brewing normaly (hot) and the cooling, generally by simply pouring over ice or into ice cold milk. In hot brewing, sweeteners and flavourings are often mixed into the hot coffee before cooling, due to faster dissolution in hot warter. Alternatively, syrup (sugar pre-dissolved in water) may be used, paticularly gum syrup.",
    "category":"cold"
    },
    {
    "id":1005,
    "name":"Cold Brew",
    "imageName":"ColdBrew",
    "description":"Could brewing, also caled cold water extracgtion or cold pressing, is the process of steeping coffee grounds in water at cool temperatures for an extenperatures for an extended preiod. Coarse-ground beans are seaked in water for a prolonged period of time, for 12 to 24 hours. The water is normally kept at room temparature, but cchilled water is also used. The grounds are filtered out of the water after thay jave been steeped using a paper coffee filter, a fine metal sieve, a French press, or felt, in the case of the Toddy brewing system.",
    "category":"cold"
    },
    {
    "id":1006,
    "name":"Iced Cappuccino",
    "imageName":"IcedCappucino",
    "description":"In Italy, caffe latte is almost always prepared at home, for breakfast only. The coffe is brewed with a stovetop moka pot and poured into a cup containing heated milk. (Unlike the 'international' latte drink, the milk in th Italian original is generally not foamed, and sugar is added by the drinker, if at all).",
    "category":"cold"
    }
    ]

    Reply
  2. https://stackoverflow.com/questions/56926884/swiftui-navigationlink-not-behaving-the-same-way-as-the-old-navigationbutton

    Reply
  3. Hey Brian, I'm using Xcode 11 beta 3 where NavigationButton is deprecated. I have tried to replace it with NavigationLink but couldn't add navigation to each drinkItem instead navigation is added to whole DrinkRow. How can I resolve this issue?

    Reply
  4. I'm having a problem, video time -> 19:50. In the line "ForEach (self.museums.identified (by: .name))" I changed to use in my case. This error appears: Type of expression is ambiguous without more context

    Reply
  5. I have the new xcode beta and it's not responding. It won't open at all. It was fine yesterday. Any suggestions???

    Reply
  6. Oh, c'mon, guys, you can download images from e.g. Pexels and get info about each coffee from Wikipedia and put it in json manually. It's not that hard

    Reply
  7. I am not able to use the load() on the 7:46 I have an error that says: Use of unresolved identifier 'load'; did you mean 'laod'?

    Reply
  8. I uploaded my attempt to GitHub. You need to use Xcode beta 2 or it will break.

    also, the images in the detail view are square. If you fix this issue please create a pull request 🙂

    https://github.com/MrBenFTW/CoffeeDBApp

    Reply
  9. Hello, could you make a video explaining how to use size classes with swiftui? will it be that to create a universal app with different layouts for iPhone and iPad have to use multiple if to detect the device?

    Reply
  10. For the new beta change "ScrollView(showsHorizontalIndicator: false)"
    to "ScrollView(.horizontal, showsIndicators: false)"

    Reply
  11. Hi Brian, It is a great video, but It is hard to follow, Can you help to set up data with out Jason file.
    Can you please set up core data model for next video.
    look forward for next video as CoreData model.

    Reply
  12. This is all lovely… but I'm having a hard time finding a way to link a UI designed in SwiftUI with a CoreData data model. Swift UI seems to be good for simple data structures but that's about it. I hope this changes.

    Reply
  13. Thanks Brian, I'm loving these SwiftUI courses all over YouTube. Quick question: At 24:10 should we use [unowned self] for the closure to prevent memory leaks like we do in closures with Swift, or is that handled somehow in SwiftUI? Any ideas? Cheers!

    Reply
  14. Hi Brian, what about a design pattern like MVC. Is it still usefull with SwiftUI? In your example the view knows the model.

    Reply
  15. Any idea what this error is:

    '(Edge.Set) -> _ModifiedContent<_ModifiedContent<VStack<Text>, _PaddingLayout>, _PaddingLayout>' is not convertible to '(Edge.Set, Length?) -> _ModifiedContent<_ModifiedContent<VStack<Text>, _PaddingLayout>, _PaddingLayout>' (aka '(Edge.Set, Optional<CGFloat>) -> _ModifiedContent<_ModifiedContent<VStack<Text>, _PaddingLayout>, _PaddingLayout>')

    Reply
  16. This is my first time seeing how the SwiftUI works as I haven't touched swift again after I found Flutter. But, this thing got me really excited. It seems like things will be easier with SwiftUI. I really like building my UI by codes so SwiftUI looks a lot sexier to me.

    Reply
  17. Hey Brian, I loved the tutorial, but could you please post a link to the assets and json used please. It would make following along with the video much better. Thanks!

    Reply
  18. Quick Question, how would I go about making it print out the row in a specific row. For example, make the Hot Section first and the Cold second.

    Reply
  19. I got a question… is optimal to use the "ForEach" SwiftUI method in order to render all the elements, it has the optimization of the, for example, reuseds cells of UITableViews?

    Reply
  20. This was very good. Thank you Brian.
    A query: it seems that the detail view doesn't need to be in a list. (That would also remove the redundant separator line).
    Also, the load method could be an extension on Bundle, instead of being a free-floating function.
    Also, the data model should probably refactored out in to its own type, and would provide the dictionary, so that Views don't have to do any thinking.
    Cheers.

    Reply
  21. Good stuff as usual Brian. The one issue I see is that you set the frame width of the DrinkItem to a fixed width and that might not display consistently on all devices as they have different widths. Or what if you enable landscape mode. One way to handle this would be wrap your scrollview in GeometryReader. I demonstrate this in this tweet https://twitter.com/StewartLynch/status/1142473049779818498

    Reply

Leave a Comment