Auto Layout Tutorial in Xcode with Swift for iOS 11 | iOS Development Tutorial

  Рет қаралды 80,773

David Tran

David Tran

Күн бұрын

DOWNLOAD PROJECTS: www.ductran.co/p/get-autolayout
Have you ever wanted to build universal apps meaning you build 1 app UI that can work on any screen size? That's what Auto Layout in iOS will help you.
In this Auto Layout tutorial, you'll learn:
+ What's Auto Layout
+ How to add unambiguous constraints
+ Different kinds of constraints in Auto Layout.
+ Priorities in Auto Layout Constraints
+ How to programmatically create auto layout constraints
+ What's Auto Layout Content Hugging Priority vs. Content Compression Resistence Priority
+ Stack View in iOS
+ How to create and use UIStackView with Auto Layout
First off, let's download the starter project Duc prepared for you. Just simply enter your name and email on the page to get:
+ the starter and complete projects of this episode
+ Duc's step-by-step video tutorial
+ Duc's new training on How to Build Nike E-commerce Store WITHOUT Losing Your Shirt
It's all awesome iOS development training for you, for FREE!
FREE DOWNLOAD: www.ductran.co/p/get-autolayout
*********
ABOUT CODE MASTERY
*********
Code Mastery is hosted by Duc Tran, founder of Developers Academy.
This is his free-style no notes, no teleprompter presentation and live coding broadcast with you guys everyday.
To join Duc's free courses, register for free at ductran.co/
*********
MEET DUC TRAN
*********
Duc Tran is founder of Developers Academy, one of the world's leading iOS, Android and Web development trainers.
More than 2,000,000 developers have studied his video trainings; 100,000 developers see his posts each month. Each year, Duc has helped 20,000 plus developers graduate from his online courses or video series.
*********
FREE TRAININGS IN IOS DEVELOPMENT
*********
To subscribe and get free tutorials, courses and weekly content, visit me at: ductran.co/
Connect with Duc on facebook: / ductranfan
Tweet him: / ductrongtran
Get daily inspiration: / ductran.co
*********
SOURCE CODE IN THIS COURSE
*********
NetworkProcessor.swift
class NetworkProcessor
{
lazy var configuration: URLSessionConfiguration = URLSessionConfiguration.default
lazy var session: URLSession = URLSession(configuration: self.configuration)
let url: URL
init(url: URL)
{
self.url = url
}
typealias JSONDictionaryHandler = (([String : Any]?) - Void)
func downloadJSONFromURL(_ completion: @escaping JSONDictionaryHandler)
{
let request = URLRequest(url: self.url)
let dataTask = session.dataTask(with: request) { (data, response, error) in
if error == nil {
if let httpResponse = response as? HTTPURLResponse {
switch httpResponse.statusCode {
case 200:
// successful response
if let data = data {
do {
let jsonDictionary = try JSONSerialization.jsonObject(with: data, options: .mutableContainers)
completion(jsonDictionary as? [String : Any])
} catch let error as NSError {
print("Error processing json data: \(error.localizedDescription)")
}
}
default:
print("HTTP Reponse Code: \(httpResponse.statusCode)")
}
}
} else {
print("Error: \(error?.localizedDescription)")
}
}
dataTask.resume()
}
}
Full access to source code: ductran.co/p/weather-rest-api
Episode tags: duc tran, ductran.co, developers academy, REST, REST API, REST API in ios tutorial, ios REST API, how to parse json, parse json in ios, parse json, parse json swift, parse json swift tutorial, parse json in Swift, alamofire, alamofire tutorial, uicollectionview, json ios, ios json parsing, ios json, ios json tutorial, json swift tutorial, swift json tutorial, parse json in ios,swiftyjson, nsurlsession, urlsession, firebase, alamofire, alamofire tutorial, alamofire swift tutorial, auto layout xcode,auto layout constraints,ios auto layout,duc tran,ductran.co, how to make an app,how to build an app,how to build ios app,xcode tutorial,swift tutorial for beginner,how to build an ios app, how to build an ios app in swift, xcode storyboard tutorial,build ios app xcode,auto layout table view

Пікірлер: 127
@DucTranFan
@DucTranFan 7 жыл бұрын
Hey guys! I hope you enjoy this new workshop. If you have any questions, post it below for me. Don't forget to download my new video series at www.ductran.co/p/get-autolayout (Build Facebook, Instagram and Nike Retail Store)
@Omeir34
@Omeir34 7 жыл бұрын
Duc you're amazing. Love your videos.
@ProductsHub365
@ProductsHub365 6 жыл бұрын
Hi Duc, Thanks for the nice video.One question , how can we achieve same space between title label and descirption label in recipe app across all ios devices.i can see different space for different devices like iphone 7 plus and iphone se (beff wellington and desciption label
@stevenr12
@stevenr12 5 жыл бұрын
Hey David, thank you very much for this tutorial. Great work! This really helped me understand how to setup constraints in auto layout.
@PaulSolt
@PaulSolt 6 жыл бұрын
Nice work Duc Tran! I loved how you provided 3 different examples to demonstrate the concepts in different situations.
@yohanessatria2220
@yohanessatria2220 6 жыл бұрын
this is really help me out. Thanks and keep up the good things
@alshezawi2010
@alshezawi2010 6 жыл бұрын
wow i really enjoyed and get understanding auto layout thank you
@graysnow1891
@graysnow1891 6 жыл бұрын
your video is very detail and easy to understand... thank!!!
@rayc1835
@rayc1835 6 жыл бұрын
Excellent tutorial, was under the impression auto layout was difficult to learn, The video simplified it a lot and i had picked it up before the video had finished.
@l.a.3944
@l.a.3944 6 жыл бұрын
I was discouraged to watch this first because of the time... an hour seems so long. But I am glad I finally did! Excellent information! Very nicely explained. Thanks!
@mucrazy2223
@mucrazy2223 7 жыл бұрын
Duc, thanks very much for great video ! Excellent ! A quick question, any videos about how to handle landscape orientation ?
@clarkdowding
@clarkdowding 6 жыл бұрын
Nicely done Duc. Picked up a few tips. Helpful.
@aanandroy5434
@aanandroy5434 6 жыл бұрын
Mind = Blown ! Great stuff man! Thanks for putting in the effort. Really appreciate your work :)
@edwincreator2855
@edwincreator2855 7 жыл бұрын
thanks, this is very helpful. Can you teach segue and delegate for the next workshop ?
@uchennannodim1394
@uchennannodim1394 5 жыл бұрын
THANKS DAVE, I APPRECIATE YOU FOR THIS TUTORIAL
@marisagonzalez679
@marisagonzalez679 6 жыл бұрын
Thank you! Newbie here. Love your tutorial videos =)
@ajeetsharma2308
@ajeetsharma2308 6 жыл бұрын
Nice tutorial.. Thanks (y) big cheers!
@bergetun
@bergetun 3 жыл бұрын
Thank you so much for this video. It really helped me. Best regards from Norway
@thucpham4142
@thucpham4142 6 жыл бұрын
Thanks bro, such a great video.
@parveshmishra9940
@parveshmishra9940 6 жыл бұрын
very helpful for me, thanks a lot
@TeacherWilliam2015
@TeacherWilliam2015 6 жыл бұрын
Great teacher! Thanks
@abuzarmanzoor5545
@abuzarmanzoor5545 5 жыл бұрын
Great video, Thank you very much, i learned a lot
@alfangr
@alfangr 5 жыл бұрын
Great Tutorial for beginners like me. Thanks a lot. :)
@reenamoo6888
@reenamoo6888 6 жыл бұрын
Thank you.. that was so helpful..
@vinhphantan8347
@vinhphantan8347 6 жыл бұрын
Hi Duc, Thank you so much :D
@dsocardoso
@dsocardoso 6 жыл бұрын
Great video. Thanks for this tutorial.
@eerdemkarakaya
@eerdemkarakaya 6 жыл бұрын
It's helpfull, Thank you :)
@thecalvenator
@thecalvenator 6 жыл бұрын
great video on auto layout basics.
@Matt45_252
@Matt45_252 6 жыл бұрын
I'll tell you even though you have an accent your English is amazing. You put words together amazingly. Amazing video and very easy to understand. Fantastic work.
@venkatkrishna6575
@venkatkrishna6575 6 жыл бұрын
nice video buddy.thankyou
@shornobrahmanborno9151
@shornobrahmanborno9151 4 жыл бұрын
Awesome!
@BantexMotoVlog
@BantexMotoVlog 6 жыл бұрын
thanks to this tutorial very easy to follow and understand
@HeroOFaith
@HeroOFaith 4 жыл бұрын
Dude, you are the best!!!! Thank you!!!
@saranyar555
@saranyar555 6 жыл бұрын
Very nice video for auto layout .Can you please upload video on vary for traits too?it would be useful
@zz12345aaa12345zz
@zz12345aaa12345zz 5 жыл бұрын
Good job! Respect! Everything covered. Can we expect a Stack View Tutorial?
@carlogfilmproduction3285
@carlogfilmproduction3285 6 жыл бұрын
Awsome!!
@JLXY35
@JLXY35 6 жыл бұрын
Awesome Stuff!
@rezaabedi8479
@rezaabedi8479 6 жыл бұрын
Thank you , it is so good
@bhaumikjoshi9082
@bhaumikjoshi9082 6 жыл бұрын
Nice Video..Thank you... :)
@dogger588
@dogger588 4 жыл бұрын
This is Amaizing! Thank you man!
@mikenourian5298
@mikenourian5298 6 жыл бұрын
pretty good stuff
@seemstwo8919
@seemstwo8919 6 жыл бұрын
you're a great teacher! Can you / or do you cover 'safe area'?
@jasper5016
@jasper5016 6 жыл бұрын
Thank you for nice video. It really helped me to clear few doubts. Why there are so many warnings for first layout? I did exactly same and I also got couple warnings and I cannot solve it.
@ShuklaAmbuj
@ShuklaAmbuj 6 жыл бұрын
Thanks for the tutorial. Can you please advise for dynamic trailing space. Support one control should maintain the distance from right hand side. So how can be done using training which should increase according to device. This can also achieved via leading where we can set using multiplier but I want to do this using trailing. Thanks in advance.
@ClintonFordhimself
@ClintonFordhimself 7 жыл бұрын
Great Video! One of the best on Auto Layout! Thank you for taking the time to explain in way that makes sense.
@mohammednaseeb8197
@mohammednaseeb8197 6 жыл бұрын
OMG! Awesome
@harjeetsingh4237
@harjeetsingh4237 6 жыл бұрын
Hello Bro, Its really helpful to learn Constraint for portrait mode. But I am expecting a brief for the landscape mode as well for each and every device size and modes.
@kursadturkmenoglu9593
@kursadturkmenoglu9593 5 жыл бұрын
good teaching man
@rachdav62
@rachdav62 6 жыл бұрын
Well done David - that is a tricky subject that I have been struggling with for some time but your video has definitely improved my understanding. Do you do one on UIStackViews?
@norah.m9351
@norah.m9351 5 жыл бұрын
Cool! keep going Daivd
@rabithbo7089
@rabithbo7089 6 жыл бұрын
You are awesome
@ProductsHub365
@ProductsHub365 6 жыл бұрын
Hi Duc, Thanks for the nice video.One question , how can we achieve same space between title label and descirption label in recipe app across all ios devices.i can see different space for different devices like iphone 7 plus and iphone se (beff wellington and desciption label.)
@kiranhooda4184
@kiranhooda4184 7 жыл бұрын
Great explaination. Do you have any video showing orientation change with autolayout? I mean portrait and landscape both should be supported..
@mucrazy2223
@mucrazy2223 7 жыл бұрын
wor, I also want to know this. :)
@jabraham08
@jabraham08 7 жыл бұрын
You are the boss Duc. Thanks for this tutorial.
@gadeeladeepthi2300
@gadeeladeepthi2300 6 жыл бұрын
Thank you.....
@ashishnimbria1785
@ashishnimbria1785 4 жыл бұрын
Hi Duc, you are a very good teacher. you explain all the things in a very easy way. Thank you to make me understood about auto layouts and all. Thank you so much :)
@shradhaagrawal6078
@shradhaagrawal6078 4 жыл бұрын
Hi ashish.. were you able to download the starter project?
@ashishnimbria1785
@ashishnimbria1785 4 жыл бұрын
@@shradhaagrawal6078 no sorry, but i made it without starter project.
@sherlockabel9894
@sherlockabel9894 7 жыл бұрын
Your videos are so good!
@adminpetbulb4616
@adminpetbulb4616 7 жыл бұрын
Hey Duc I like your videos and the way you teach.
@shaikbaji1506
@shaikbaji1506 6 жыл бұрын
Hey are your Autolayouts are useful and helpful to Absolute Beginners , see i want to test in all screens for ios (4 to 7 plus) and ipad air, all devices i should be same and should set perfectly :)
@cometmace
@cometmace 5 жыл бұрын
Which is the video that teaches how to use "vary for traits"? Thanks.
@AmanSharma-pc9vt
@AmanSharma-pc9vt 6 жыл бұрын
is it good to fix the height of button, text fields or we should give their constraints based on ratio or muliplier.?
@CyberRebornCA
@CyberRebornCA 7 жыл бұрын
really nice video
@HirenMistry0125
@HirenMistry0125 4 жыл бұрын
learn much to the point but it looks weird on iPad, what should i do?
@dle75
@dle75 5 жыл бұрын
Q: Trying to make a circle uiview, how can I create a cornerRadius adjust to the current width? Here's what I have. UIView.cornerRadius = UIView.frame.size.width. However, it only keeps the original width and not the adjusted width.
@TheLORDNIGHTSHIELD
@TheLORDNIGHTSHIELD 6 жыл бұрын
Thanks David for tutorial, even-though i did not find what i came from. There are some points it would be better to go. 1) Explain how to create a layout based on vertical position. 2) Select a good approach to do that ( i mean do not show wrong approaches to not confuse beginners by click that, click this, WHY is always more important than HOW if you are teaching) 3) Use very simple applications without any MVC and etc - as the point here is basic Auto-layout itself and not other parts of Xcode as TableView and etc. 4) As soon as you explained vertical alignment - then explain landscape alignment. One without other is not useful, as person will go and look again for auto-layout courses and confuse himself at the end. THIS is important. 5)Provide best approaches - what to do, what not to do, patterns maybe. Generally speaking - focus on auto-layout only as a designer. Thanks for time spend on video and your efforts.
@mcaapps2128
@mcaapps2128 5 жыл бұрын
Hi David. I have a problem with this tutorial. There is no Preview option. I follow your tutorial with each click and the option just does not show in my list. Any idea what I'm doing wrong?
@slambodianjones
@slambodianjones 6 жыл бұрын
I only see 'leading space to container' (no margin) and it has one line vertically not the horizontal line. Any ideas?
@tejask4889
@tejask4889 6 жыл бұрын
In the quotes app, when you copy paste the same quote, on SE the UILabel has 5 lines whereas the 7 and 7 Plus have 4 lines, in an app that has more components, how should this be handled? I just can't understand auto-layout?
@ofirka991
@ofirka991 6 жыл бұрын
Well, this tutorial is really good and explains everything I need in order to understand autolayout. On the other hand, it is very long and repeat itself often. Thank you for that! Hopefully next time you can make your tutorials a bit shorter.
@Abu.deekshu
@Abu.deekshu 5 жыл бұрын
Thank you soo much greate video
@markpark3254
@markpark3254 3 жыл бұрын
At 53:03, why did we add a constraint for the Title Label to the content view for its y-position and for the Image we did not? For the image, we used the pin menu to add the constraints but for the Title Label, we used the CTRL + drag-drop method. Is it the same? Was the pin menu for the y-position of the image already referring to the content view? @David Tran
@hectorandrespv
@hectorandrespv 5 жыл бұрын
Hello - its great - for me personally - it'd be great if the music stopped while the explanation is happening. Thanks for making this.
@sudhakarreddy7669
@sudhakarreddy7669 6 жыл бұрын
what about ipad? i tired in iPad, It is not working. Can you tell how handle iPad screens.
@rohitkulhar3838
@rohitkulhar3838 6 жыл бұрын
Excellent tutorial and the best of all auto layout tutorials👍👍. Keep up the good work☺️☺️.
@yklash
@yklash 4 жыл бұрын
love the energy keep it up
@minhpham1822
@minhpham1822 7 жыл бұрын
Anh ơi, em năm nay 18 tuổi và muốn theo đuổi sự nghiệp software and app developer. A nên bắt đầu như thế nào ạ? Nên học ngôn ngữ lập trình nào trước tiên ạ? E cảm ơn a
@Vankien96
@Vankien96 7 жыл бұрын
Mình nghĩ bạn nên đi học một trường nào đó .Trường nào cũng được .Họ sẽ dạy những thứ căn bản nhất rồi từ đó học cái gì mình thích thôi .
@danylopolishchuk4191
@danylopolishchuk4191 6 жыл бұрын
it is a good tutorial if you watch it al least at 1.5x speed
@mogilogi1956
@mogilogi1956 6 жыл бұрын
i just saw your comment after i watched all the video :( would of be nicer if it just toke 30 min :(
@danielelewis9303
@danielelewis9303 6 жыл бұрын
Nice advice, you saved me 30 minutes ;)
@Piggsvin4
@Piggsvin4 6 жыл бұрын
That's what I do for nearly every tutorial :)
@ersinergul663
@ersinergul663 5 жыл бұрын
Hahaha fuck it was good XD thanks
@randomstuff6061
@randomstuff6061 5 жыл бұрын
yes you are right he is too slow
@Fijiannnn
@Fijiannnn 6 жыл бұрын
I don't get it, am I suppose to cover the top and bottom bars with images? stackoverflow.com/questions/47463717/black-bars-top-bottom-of-iphone-x-spritekit-game REPLY
@UdayBabariya
@UdayBabariya 7 жыл бұрын
helpfull
@hiendao9468
@hiendao9468 5 жыл бұрын
Hello anh Trong Duc
@NaveenYadav-zi2jg
@NaveenYadav-zi2jg 6 жыл бұрын
What about portrait mode
@habibdurodola5728
@habibdurodola5728 4 жыл бұрын
Best Autolayout video, hats off !!!
@chaunguyen-wi7bu
@chaunguyen-wi7bu 6 жыл бұрын
From Viet Nam with love
@RushMeh
@RushMeh 7 жыл бұрын
Please do a video on Realm
@shradhaagrawal6078
@shradhaagrawal6078 4 жыл бұрын
I am not able to download the starter project. The URL www.ductran.co/p/get-autolayout tells me to register. But nothing happens when i register.
@mmamoonmazhar5927
@mmamoonmazhar5927 6 жыл бұрын
kindly anyone send me the tutorial project link in comment
@mohitnigam3861
@mohitnigam3861 2 жыл бұрын
Sir not able to download project
@mohitnigam6186
@mohitnigam6186 2 жыл бұрын
not getting project on link , some issue in link
@mydoghasschizophrenia
@mydoghasschizophrenia 5 жыл бұрын
I do everything the same, but my app doesn't look nice on iPads. I don't understand why we don't use Top space to safe area in the first app with Steve Jobs. Useless.
@Annon739
@Annon739 6 жыл бұрын
Thank you, Jian Yang
@zakleet8065
@zakleet8065 5 жыл бұрын
Andrey Dimitrov this is the best comment I’ve ever read. Silicon Valley gang
@ankitpmca
@ankitpmca 5 жыл бұрын
Code is not come in mail.
@233fate3
@233fate3 5 жыл бұрын
那边也穿格子吗🙃
@niravpatel1056
@niravpatel1056 5 жыл бұрын
Your voice is like goat
@jashangoyal7976
@jashangoyal7976 6 жыл бұрын
U shouldn't took beff pic in app no. 2
@madhun5418
@madhun5418 6 жыл бұрын
Sir could you please explain the Facebook SDK
@venkateshchejarla5120
@venkateshchejarla5120 6 жыл бұрын
bro same comment "Super Easy Apps" cahnnel lo post chesav ga. Emina response vachindha.
@PaulSolt
@PaulSolt 6 жыл бұрын
Venkatesh Chejarla 😃
@madhun5418
@madhun5418 6 жыл бұрын
No response from him
@PaulSolt
@PaulSolt 6 жыл бұрын
I did a course on it a while back, but then Facebook changed the APIs, so I'll hopefully revisit it again in the near future.
@venkateshchejarla5120
@venkateshchejarla5120 6 жыл бұрын
Super Easy Apps Hey Its funny that you found our comments here in Ducs channel.
@saravananraju528
@saravananraju528 6 жыл бұрын
Need more screen practice.
@gdev4510
@gdev4510 5 жыл бұрын
wtf is that background music for?
@magarigiga
@magarigiga 5 жыл бұрын
Did you forget to show '+ How to programmatically create auto layout constraints'?
@gauravpande
@gauravpande 6 жыл бұрын
Great tutorial but your "3-Priorities-PrettyApple" app constraints are completely different than what you have taught here :\
@Ram_9292
@Ram_9292 6 жыл бұрын
try to implement short duration videos... otherwise ur tutorials are supb..
@marekhrusovsky1491
@marekhrusovsky1491 5 жыл бұрын
Appreciate educational content. However please cut your video and speed up simulator loading or cut the boring stuff.
@ffairchildd
@ffairchildd 6 жыл бұрын
Great tutorial. I would replace the person who's talking with someone with better pronounciation so it's easier to understand and we wont spend more time trying to understand the lecturer as much as the course.
@methujeraya
@methujeraya 5 жыл бұрын
ughh what bullshitry is this. I do the ctrl+drag but there is no constraints option. Only 'Push' 'Modal' 'Option'
Auto Layout Constraints in iOS
28:22
Sam Meech-Ward
Рет қаралды 6 М.
Advanced Swift: Making Programmatic Auto Layout Easy through Extensions
25:38
لقد سرقت حلوى القطن بشكل خفي لأصنع مصاصة🤫😎
00:33
Cool Tool SHORTS Arabic
Рет қаралды 29 МЛН
Fast and Furious: New Zealand 🚗
00:29
How Ridiculous
Рет қаралды 45 МЛН
Mom's Unique Approach to Teaching Kids Hygiene #shorts
00:16
Fabiosa Stories
Рет қаралды 38 МЛН
What it feels like cleaning up after a toddler.
00:40
Daniel LaBelle
Рет қаралды 91 МЛН
Beginner Auto Layout & Constraints - Swift 4.2 - Xcode 10
27:10
Sean Allen
Рет қаралды 81 М.
Parsing JSON Just Became Super Easy in Swift 4 with Decodable
19:30
Lets Build That App
Рет қаралды 274 М.
How to Create Image Scroller in iOS with UIScrollView
25:40
David Tran
Рет қаралды 10 М.
low battery 🪫
0:10
dednahype
Рет қаралды 1,8 МЛН
Как противодействовать FPV дронам
44:34
Стратег Диванного Легиона
Рет қаралды 106 М.
Yanlışlıkla Telefonumu Parçaladım!😱
0:18
Safak Novruz
Рет қаралды 985 М.
Как бесплатно замутить iphone 15 pro max
0:59
ЖЕЛЕЗНЫЙ КОРОЛЬ
Рет қаралды 8 МЛН
Новые iPhone 16 и 16 Pro Max
0:42
Romancev768
Рет қаралды 2,4 МЛН