¿Cómo mostrar el indicador de actividad en medio de la pantalla del iPhone?

Respuestas:

149
UIActivityIndicatorView *activityView = [[UIActivityIndicatorView alloc]     
        initWithActivityIndicatorStyle:UIActivityIndicatorViewStyleWhiteLarge];

    activityView.center=self.view.center;
    [activityView startAnimating];
    [self.view addSubview:activityView];
Arun
fuente
13
También agregaría activityView.autoresizingMask = UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleRightMargin | UIViewAutoresizingFlexibleTopMargin | UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleBottomMargin; para una orientación y rotación adecuada del paisaje
adsurbum
@adsurbum ¡Gracias! ¡Fue la clave para centrarlo en todos los tamaños de pantallas de iPhone, desde SE hasta 8 Plus! En Swift, es: activityView.autoresizingMask = [.flexibleLeftMargin, .flexibleTopMargin, .flexibleRightMargin, .flexibleBottomMargin, .flexibleWidth, .flexibleHeight]
balazs630
43

Si está usando Swift, así es como lo hace

let activityView = UIActivityIndicatorView(activityIndicatorStyle: .whiteLarge)
activityView.center = self.view.center
activityView.startAnimating()

self.view.addSubview(activityView)
Rogerio Chaves
fuente
15

Código actualizado para Swift 3

ingrese la descripción de la imagen aquí

Código SWIFT

import UIKit
class ViewController: UIViewController {

    let activityIndicator = UIActivityIndicatorView(activityIndicatorStyle: UIActivityIndicatorViewStyle.whiteLarge)

    @IBOutlet weak var myBlueSubview: UIView!

    @IBAction func showButtonTapped(sender: UIButton) {
        activityIndicator.startAnimating()
    }

    @IBAction func hideButtonTapped(sender: UIButton) {
        activityIndicator.stopAnimating()
    }

    override func viewDidLoad() {
        super.viewDidLoad()

        // set up activity indicator
        activityIndicator.center = CGPoint(x: myBlueSubview.bounds.size.width/2, y: myBlueSubview.bounds.size.height/2)
        activityIndicator.color = UIColor.yellow
        myBlueSubview.addSubview(activityIndicator)
    }
}

Notas

  • Puede centrar el indicador de actividad en el medio de la pantalla agregándolo como una subvista a la raíz en viewlugar de myBlueSubview.

    activityIndicator.center =  CGPoint(x: self.view.bounds.size.width/2, y: self.view.bounds.size.height/2)
    self.view.addSubview(activityIndicator)
    
  • También puede crear el UIActivityIndicatorViewen Interface Builder. Simplemente arrastre una Vista de indicador de actividad al guión gráfico y configure las propiedades. Asegúrese de marcar Se esconde cuando se detiene . Utilice una salida para llamar startAnimating()y stopAnimating(). Vea este tutorial .

ingrese la descripción de la imagen aquí

  • Recuerde que el color predeterminado del LargeWhiteestilo es el blanco. Entonces, si tiene un fondo blanco, no puede verlo, simplemente cambie el color a negro o cualquier otro color que desee.

    activityIndicator.color = UIColor.black
    
  • Un caso de uso común sería mientras se ejecuta una tarea en segundo plano. Aquí hay un ejemplo:

    // start animating before the background task starts
    activityIndicator.startAnimating()
    
    // background task
    DispatchQueue.global(qos: .userInitiated).async {
    
        doSomethingThatTakesALongTime()
    
        // return to the main thread
        DispatchQueue.main.async {
    
            // stop animating now that background task is finished
            self.activityIndicator.stopAnimating()
        }
    }
    
Suragch
fuente
13

Esta es la forma correcta:

UIActivityIndicatorView *activityIndicator = [[UIActivityIndicatorView alloc]initWithActivityIndicatorStyle:UIActivityIndicatorViewStyleGray];
activityIndicator.center = CGPointMake(self.view.frame.size.width / 2.0, self.view.frame.size.height / 2.0);
[self.view addSubview: activityIndicator];

[activityIndicator startAnimating];

[activityIndicator release];

Configure su máscara de tamaño automático si admite la rotación. ¡¡¡Salud!!!

D33pN16h7
fuente
4

Prueba de esta manera

UIActivityIndicatorView *activityIndicator = [[UIActivityIndicatorView alloc]initWithActivityIndicatorStyle:UIActivityIndicatorViewStyleGray];
    activityIndicator.frame = CGRectMake(10.0, 0.0, 40.0, 40.0);
    activityIndicator.center = super_view.center;
    [super_view addSubview: activityIndicator];

[activityIndicator startAnimating];
Anand
fuente
4

Swift 4, versión de diseño automático

func showActivityIndicator(on parentView: UIView) {
    let activityIndicator = UIActivityIndicatorView(activityIndicatorStyle: .gray)
    activityIndicator.startAnimating()
    activityIndicator.translatesAutoresizingMaskIntoConstraints = false

    parentView.addSubview(activityIndicator)

    NSLayoutConstraint.activate([
        activityIndicator.centerXAnchor.constraint(equalTo: parentView.centerXAnchor),
        activityIndicator.centerYAnchor.constraint(equalTo: parentView.centerYAnchor),
    ])
}
Orkhan Huseynov
fuente
1
Bienvenido a S / O, su respuesta nunca debe ser 100% código. Siempre agregue alguna explicación.
Taslim Oseni
No estoy seguro si esta es una regla en blanco y negro. Si el alcance de la pregunta es lo suficientemente simple y el código se explica por sí mismo, creo que está bien tener una respuesta de solo código. La respuesta de @ Orkhan es acertada.
André Herculano
2

Puedes establecer la posición así

        UIActivityIndicatorView *activityView = 
[[UIActivityIndicatorView alloc] initWithActivityIndicatorStyle:UIActivityIndicatorViewStyleWhite];
activityView.frame = CGRectMake(120, 230, 50, 50);
[self.view addSubview:activityView];

En consecuencia, cambie el tamaño del marco .....

Minakshi
fuente
2

Si desea centrar la ruleta usando AutoLayout, haga:

UIActivityIndicatorView *activityView = [[UIActivityIndicatorView alloc] initWithActivityIndicatorStyle:UIActivityIndicatorViewStyleWhiteLarge];
[activityView startAnimating];
[self.view addSubview:activityView];
[self.view addConstraint:[NSLayoutConstraint constraintWithItem:activityView
                                                      attribute:NSLayoutAttributeCenterX
                                                      relatedBy:NSLayoutRelationEqual
                                                         toItem:self.view
                                                      attribute:NSLayoutAttributeCenterX
                                                     multiplier:1.0
                                                       constant:0.0]];
[self.view addConstraint:[NSLayoutConstraint constraintWithItem:activityView
                                                      attribute:NSLayoutAttributeCenterY
                                                      relatedBy:NSLayoutRelationEqual
                                                         toItem:self.view
                                                      attribute:NSLayoutAttributeCenterY
                                                     multiplier:1.0
                                                       constant:0.0]];
Shaheen Ghiassy
fuente
2

Swift 3, xcode 8.1

Puede usar una pequeña extensión para colocar UIActivityIndicatorView en el centro de UIView y las clases UIView heredadas:

Código

extension UIActivityIndicatorView {

    convenience init(activityIndicatorStyle: UIActivityIndicatorViewStyle, color: UIColor, placeInTheCenterOf parentView: UIView) {
        self.init(activityIndicatorStyle: activityIndicatorStyle)
        center = parentView.center
        self.color = color
        parentView.addSubview(self)
    }
}

Cómo utilizar

let activityIndicator = UIActivityIndicatorView(activityIndicatorStyle: .whiteLarge, color: .gray,  placeInTheCenterOf: view)
activityIndicator.startAnimating()

Ejemplo completo

En este ejemplo, UIActivityIndicatorView colocado en el centro de la vista ViewControllers:

import UIKit

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.
        let activityIndicator = UIActivityIndicatorView(activityIndicatorStyle: .whiteLarge, color: .gray,  placeInTheCenterOf: view)
        activityIndicator.startAnimating()
    }
}

extension UIActivityIndicatorView {

    convenience init(activityIndicatorStyle: UIActivityIndicatorViewStyle, color: UIColor, placeInTheCenterOf parentView: UIView) {
        self.init(activityIndicatorStyle: activityIndicatorStyle)
        center = parentView.center
        self.color = color
        parentView.addSubview(self)
    }
}
Vasily Bodnarchuk
fuente
1

Para Swift 3 puedes usar lo siguiente:

 func setupSpinner(){
    spinner = UIActivityIndicatorView(frame: CGRect(x: 0, y: 0, width: 40, height:40))
    spinner.color = UIColor(Colors.Accent)
    self.spinner.center = CGPoint(x:UIScreen.main.bounds.size.width / 2, y:UIScreen.main.bounds.size.height / 2)
    self.view.addSubview(spinner)
    spinner.hidesWhenStopped = true
}
Ahmed Lotfy
fuente
0

Espero que esto funcione:

// create activity indicator 
UIActivityIndicatorView *activityIndicator = [[UIActivityIndicatorView alloc] 
    initWithFrame:CGRectMake(0.0f, 0.0f, 20.0f, 20.0f)];
[activityIndicator setActivityIndicatorViewStyle:UIActivityIndicatorViewStyleWhite];

...
 [self.view addSubview:activityIndicator];
// release it
[activityIndicator release];
iOS
fuente
0

? Si quieres intentar hacerlo usando la interfaz, puedes ver mi video para esto . De esta manera, no es necesario escribir ningún código para mostrar el indicador de actividad en el medio de la pantalla del iPhone.

NamPham
fuente
0
import UIKit

class ViewController: UIViewController {

    @IBOutlet weak var textLbl: UILabel!

    var containerView = UIView()
    var loadingView = UIView()
    var activityIndicator = UIActivityIndicatorView()

    override func viewDidLoad() {
        super.viewDidLoad()

        let _  = Timer.scheduledTimer(withTimeInterval: 10, repeats: false) { (_) in
            self.textLbl.text = "Stop ActivitiIndicator"
            self.activityIndicator.stopAnimating()
            self.containerView.removeFromSuperview()
        }
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
    }

    @IBAction func palyClicked(sender: AnyObject){

        containerView.frame = self.view.frame
        containerView.backgroundColor = UIColor(red: 0/255, green: 0/255, blue: 0/255, alpha: 0.3)
        self.view.addSubview(containerView)

        loadingView.frame = CGRect(x: 0, y: 0, width: 80, height: 80)
        loadingView.center = self.view.center
        loadingView.backgroundColor = UIColor(red: 0/255, green: 0/255, blue: 0/255, alpha: 0.5)
        loadingView.clipsToBounds = true
        loadingView.layer.cornerRadius = 10
        containerView.addSubview(loadingView)

        activityIndicator.frame = CGRect(x: 0, y: 0, width: 40, height: 40)
        activityIndicator.activityIndicatorViewStyle = UIActivityIndicatorViewStyle.whiteLarge
        activityIndicator.center = CGPoint(x:loadingView.frame.size.width / 2, y:loadingView.frame.size.height / 2);
        activityIndicator.startAnimating()
        loadingView.addSubview(activityIndicator)

    }
}
Thongchai S.
fuente
¡Gracias Thongchai! ¿Puede agregar algún texto adicional que explique su código?
Brandon Minnick
-1

Encontré una manera de mostrar el indicador de actividad con un código mínimo:

primero que nada importa tu UI Kit

import UIKit;

Entonces tienes que iniciar el indicador de actividad.

let activityIndicator:UIActivityIndicatorView = UIActivityIndicatorView();

Luego, simplemente copie y pegue estas funciones a continuación, que son autoexplicativas y llámelas donde sea que las necesite:

func startLoading(){
    activityIndicator.center = self.view.center;
    activityIndicator.hidesWhenStopped = true;
    activityIndicator.activityIndicatorViewStyle = UIActivityIndicatorViewStyle.gray;
    view.addSubview(activityIndicator);

    activityIndicator.startAnimating();
    UIApplication.shared.beginIgnoringInteractionEvents();

}

func stopLoading(){ 

    activityIndicator.stopAnimating();
    UIApplication.shared.endIgnoringInteractionEvents();

}
Harshal Lonare
fuente