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?

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

3 Answers 3

Reset to default
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/

Improve this answer
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

Improve this answer
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

Improve this answer
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.
    – RobbyReindeer
    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, privacy policy and cookie policy

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