Hard time adapting to using Xcode

3 years ago from , UX/UI Developer

Hey guys, As a Js app developer and recently using react native - I’ve started learning Swift and Xcode to really see what the differences are between making an app with react native vs a true native app. Lately my biggest issue learning is it’s really popular to use Xcode like it’s Sketch to layout the app - but as a developer it feels combersome/slow/inefficient. Im so used to css + breakpoints for screen sizes and using percentage based numbers that Xcode seems like an anti-pattern. I’m wondering if anyone has any advice or tutorials that would help me out?



  • Jathu SatkunarajahJathu Satkunarajah, 3 years ago

    I would suggest not using storyboards. Storyboard is not as flexible as doing everything programmatically and it doesn't scale well when you have many people working on one project. Use NSLayoutConstraints and do everything programmatically.

    Here is a small example where I:

    1. Set the width to 50% of some other view
    2. Set the height to some fixed constant
    3. Set the view to be horizontally center of the parent view, with a 10 pixel offset
    4. Set the y position to start at the top of the parent
    NSLayoutConstraint.activate([ view.widthAnchor.constraint(equalTo: otherView.widthAnchor, multiplier: 0.5), view.heightAnchor.constraint(equalToConstant: 100), view.centerXAnchor.constraint(equalTo: parent.centerXAnchor, constant: -10), view.topAnchor.constraint(equalTo: parent.topAnchor) ])

    Sorry about the formatting. But as you can see, I have total control of how my view is laid out. This should definitely be more familiar to someone with web front end experience (in fact iOS gives you more control IMO).

    For a tutorial, a quick YouTube search gave me this: https://www.youtube.com/watch?v=3Xv1mJvwXok

    4 points
  • Joe Blau, 3 years ago

    As someone who has been developing iOS apps for nearly 10 years, I can tell you that Xcode is not the best IDE. It's got a lot of quirks and drawbacks from a traditional web development standpoint. There is a mind shift that needs to be done to get into the Apple way of doing things. For some this is quick and for others it takes a bit longer.

    In terms of layout, auto-layout is really painful if you're coming from the web, but what Or said is right, check out UIStackView. It's similar to <tables> in the web development world and you can compose them to get whatever UI you want.

    I would say check out Meng To's Design Code[1] program. He really does a good job of helping you understand what you need to understand without having to know what you don't.

    [1] - https://designcode.io

    3 points
  • Or Arbel, 3 years ago

    I would suggest looking into UIStackView: https://developer.apple.com/videos/play/wwdc2015/218/

    3 points
  • Cihad TurhanCihad Turhan, 3 years ago

    I started ios and android development natively (ie anrdoid studio and xcode). I would say, Xcode is buggy, slow and time-consuming. It takes so much time for simpler layouts, such as adding contents to scrollview and dynamic sizes of stackviews and I don't have any idea for Content Hugging Priority and Compression Resistance although I spend so much time on it.

    As a web developer, I thought about react-native and started a project from a scratch and I'm very happy with the result.

    2 points
    • Spencer Bigum, 3 years ago

      I see, I'm just so new to the app dev world and no one seems to be very clear in what the limitations of React-Native in terms of performace are. (Or at least dont like to talk about them) As a web developer, I cannot stand janky animations. Have you seen any issues with a react-app?

      0 points
      • Cihad TurhanCihad Turhan, 3 years ago

        I have some my list of priorities during mobile development. These are:

        • Building user interfaces as fast as possible (that also mean reusable components)
        • Customisation of any UI
        • Tooling (Seeing application data in any instant and inspect all network requests)
        • Performance

        I put performance below because it depends on what type of performance you need. Do you need image manipulation, data encryption, video streaming? If you need such kind of stuff, I suggest you to stay in native. Otherwise, if you have doubts on UI performance, you don't need to worry. React-native is a library uses native functions eventually. Just check out new Skype, Instagram, Upwork Apps, and some open-source examples (like F8 app, and Chain-React app) and see it yourself.

        1 point
        • Spencer Bigum, 3 years ago

          i'd be curious to find out on say for the Instagram app - how much of it they needed native app developers to create code. It's hard to tell if an app created with React-native - uses custom native features that aren't available by default. I guess its probably trail by fire in terms of performance? Try it with RN - and if its not smooth enough - figure out how to make it in native?

          Cheers, S

          1 point