Xcode 9和iOS 11的14种自动布局最佳做法(使用情节提要)



使用“自动布局”为任何尺寸的iPhone设计iPhone应用程序。使用这14项自动版式最佳实践可以节省时间和挫败感。

阅读所有30种自动布局最佳做法:http://blog.supereasyapps.com/30-auto-layout-best-practices/

自动布局可能很难理解,因为当您将其与编写一行Swift代码进行比较时,反馈循环会延迟。为了有效地使用它,您需要了解可以节省时间并避免常见麻烦的策略。

了解以下所有30种最佳做法:

1. iPhone 8的设计
2.设置一台iPhone的用户界面
3.撤消和重做
4.相对和居中布局
5.确定结构区域
6.了解颜色
7.单向工作
8.隧道尽头的光
9.隐藏的布局错误面板
10.更改背景颜色
11.对角线阻力
12. Shift键修改器
13.添加困难约束
14.修复UIImageView内容模式
15.何时使用堆栈视图
16.设计可调整大小和可伸缩的图像
17.通过图像切片正确拉伸
18.创建自定义@IBDesignable UIViews
19.高级图像调整大小
20.使用Swift 4代码调整大小的UIImage
21.高级约束编辑器
22.测试不同的iPhone尺寸等级
23.解决约束冲突
24.一种观点
25.帧与约束常量
26.快速遍历副本
27.备份自动布局
28.清除约束并重新启动
29.对齐和打领带按钮
30.不要使用这些设置

免费的iPhone Apps课程:http://SuperEasyApps.com

阅读所有30种自动布局最佳做法:http://blog.supereasyapps.com/30-auto-layout-best-practices/

14 Xcode 9和iOS 11的自动版式最佳做法(使用情节提要)。

33 comments
  1. Hi Paual,

    Really nice and easy to understand video, Thanks for putting this up.. it was really helpful.
    At the start of the video you mentioned the tool (Sketch if i got it right) you use to create mock up screens. Appreciate if you can share some more info on that tool as about whether its available in Appstore or need to download it from website.

    Once again Thanks for superb tutorial.. Cheers…!!

  2. I am stuck with design ui in ios development. When I run up the application with big as such iphone 6, 6s, 7…are good and problem with smaller devices like 5, 5s..problem with ui anyone pls help me on this?

  3. I thought I had found the best tutorial for Auto Layout but I wish you had done it better. You never explained the difference between 'Trailing' and 'Leading'. You just did it so fast without proper explanation. You did not do the Horizontal Layout. I really really wish that you had done better on this video. I hope you redo a better and complete Auto Layout tutorial. Fairly Disappointed.

  4. I usually have complex layouts in my apps and it's such a pain in the ass to do the constraints for IOS. I spent 80% of my time trying and testing the output and 20% on codes for iOS app and the reverse for Android apps which means I complete my project quicker in Android.
    Really wish Apple could come up with a better layout solution it's just not productive..

  5. I do have existing objective c project which contains meters but i am Not enable to adjust auto layout constraints for that one can u please help me on auto layout

  6. Well, first, let me just say I really appreciate you making this and going through your full process.

    I'm trying to gauge if constraints are worth using, as someone that generally would script things but will readily use visual tools instead if they are up to snuff.

    I've been trying to get to grips with xcode's constraints for a couple of hours. Its been confusing.

    It appeared professional – until I tried to understand how any one thing is constrained to its neighbors, and to the page as a whole. That info is there… but its not quickly interpretable, instead being an unordered list of constraints. After some other surprises (duplicate constraints, xcode bugs, some things combined that shouldn't be), well, that's when I looked and found your video.

    Then hearing you have 30 best practices – I'd expected a dozen, but this sounds like a minefield of poorly communicated design decisions by apple (among other issues).

    Still, I'll hold off on that opinion till I've at least finished watching your video. I want to see what the workflow could be like at best.

  7. Thanks Paul. Here's a few tips for your viewers, from the School of been-there-done-that:

    Before you open up Xcode, make sure your design is workable on a REAL device. Designing a UI on a large screen and using it in the Simulator with a mouse can create a distorted impression of how usable your design really is. You will likely find that your "pixel-perfect" Sketch design is too small/fiddly to use with real fingers on a real phone or pad.

    So, as part of your design iteration loop, export your Sketch screens as PNGs. View them on your actual iDevice. Adjust your design — and any preconceived notions — until the design is workable. This is far less expensive than having to change your design later.

    Also, I advise designing for the smallest screens (I design for the iPhone 5S). If you design for a larger phone first, your design may be entirely unworkable on smaller screens: and there are millions of people still using those phones. (And that's when devs start saying things like "well, I'll only support iPhone X or later"). It's far easier to scale your design up in size, than reduce it later.

    Also, remember the software keyboard. The appearance of the keyboard can have a huge impact on your UI and workload, so factor it in from day one. And remember too that the software keyboard may not appear if someone is using a bluetooth keyboard, but you still have to provide a UI to accommodate the text entry…

    Cheers, and good luck with your design.

  8. Hi. For beginners, it would be useful to say that this Views would be nice to place in the Scroll View, since when the keyboard appears, it will not be enough simply to lift the entire structure upward so that it does not overlap the input fields. Sorry for my English 🙂

Comments are closed.