4

In Android, the native button in material style has a "loading" state. This loading state can also be "disabled" state. It looks like this:

HD Screencast - https://gfycat.com/IncompatibleConfusedBergerpicard

GIF

The buttons in iOS look like this, on the right:

Does anyone have any design guidelines on how the "loading" state would be?

1
  • If I'm not forgetting, I haven't seen loading anim inside button in iOS Mar 8, 2018 at 8:24

3 Answers 3

4

As per the iOS Guidelines you can give a shot at this!

Loading Spinner

Before Click After Click

Updated Image:

Note: This is for Download Functionality. For a Progress there's a loader displayed after a button is clicked.

As per iOS Guidelines for Native Button Loading.

This One:

iOS loader

Ref: https://developer.apple.com/ios/human-interface-guidelines/controls/progress-indicators/

4
  • Very interesting thank you @mehul - however these buttons look very custom. These do not look like the standard buttons of the iOS platform. I was looking for a "loading state of a button" which is true to the iOS style guidelines and iOS look and feel. Is there any native buttons in apps by Apple you see that has a button with loading state?
    – Noitidart
    Mar 8, 2018 at 10:33
  • 2
    There does not exist such a native design which you are looking for in the iOS Human Interface Guidelines. However, I have Updated the answer for the available Guidelines Loading on a Button Click. Hope that helped you!
    – Mehul Shah
    Mar 9, 2018 at 5:49
  • 1
    Thanks very much! This is a real big help! I noticed that in iOS changing text and border color seem to morph.
    – Noitidart
    Mar 9, 2018 at 7:42
  • Exactly!!!!!!!!
    – Mehul Shah
    Mar 29, 2018 at 10:19
0

 Loding state button

Three options for Loading Button State

1
  • Thank you @NAP but these are not in iOS style.
    – Noitidart
    Mar 8, 2018 at 10:31
0

The iOS loader looks like this:

enter image description here

3
  • Thank you @RobE, this I know, but I was wanting to see how iOS style incorporates a "loading state" into buttons. True to the iOS style guidelines.
    – Noitidart
    Mar 8, 2018 at 10:31
  • 1
    I can't find anything in the iOS guidelines about this kind of element. I think you'll have to go custom. Mar 8, 2018 at 11:20
  • Thanks Rob, I know they have a circular loading icon button in App store. It is a cloud download icon, and when press it turns to square with ring around it, and the ring gets thicker. Do you recall seeing any loading icons in iOS apps?
    – Noitidart
    Mar 8, 2018 at 14:04

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.