He utilizado este código para usar una imagen personalizada como el botón atrás en toda la aplicación.

[[UINavigationBar appearance] setBackIndicatorImage:[UIImage imageNamed:@"back"]];
[[UINavigationBar appearance] setBackIndicatorTransitionMaskImage:[UIImage imageNamed:@"back"]];

Las dimensiones de la imagen son de 30 x 30.

El código agrega la imagen como el botón atrás, pero la posición no es la correcta, como se puede ver en la siguiente imagen:

Cómo colocar correctamente el botón atrás en iOS7

Cualquier idea sobre cómo colocar correctamente la imagen sin modificar sus dimensiones (al menos la parte visual de la imagen (círculo + flecha))?

EDICIÓN:

No quiero usar un botón atrás porque eso me obliga a desactivar el barrido/back-gesto en iOS7

  • usted debería considerar la posibilidad de «UIImage *backButton = [[UIImage imageNamed:@»blueButton»] resizableImageWithCapInsets:UIEdgeInsetsMake(12, 12, 12, 12)];» a continuación, establezca esta imagen para el botón atrás.
  • Si hago lo que el «ios7-de nuevo gesto de» no funciona
  • ¿qué margen de que usted está proporcionando aquí «UIEdgeInsetsMake(12, 12, 12, 12)». usted tiene que cambiar, como por su exigencia. seguir esta enlace de referencia
  • No veo cómo esto puede resolver el problema, ya que el botón de atrás no es el fondo de la UINavigationBar, y yo no lo necesito para ser repetido en cualquier forma/patrón
  • He hecho una edición a mi respuesta, estuve probando diferentes cosas y se acercó con un método muy fácil. Espero que sea de ayuda.
  • Adjuntar un proyecto de demostración en GitHub para que yo pueda ofrecer una solución.
  • ¿Por qué necesita de mí para sujetar cualquier cosa en GitHub? Tienes el código, y las dimensiones de la imagen
  • Porque no quiero empezar un proyecto desde cero. Pero, de nuevo, no estoy en necesidad de ayuda.
  • Un poco de iOS novato, pero ¿por qué no puede usted hacer un botón personalizado y responder a un golpe-de nuevo gesto simplemente por hacer estallar la vista?
  • porque de esa manera se perderá interactivo gesto de animación
  • comprobar mi respuesta: stackoverflow.com/questions/25250389/…

InformationsquelleAutor Bernat | 2014-03-31

7 Comentarios

  1. 21

    EDITAR

    Creo que yo podría haber encontrado el truco (en iOS 7 Recursos de Diseño — UIKit Interfaz de Usuario del Catálogo).

    Bajo Botón De La Barra De Elementos

    Tenga en cuenta que un botón de la barra de imagen será automáticamente se representa como una imagen de la plantilla dentro de una barra de navegación, a menos que se establezca explícitamente su modo de representación a UIImageRenderingModeAlwaysOriginal. Para obtener más información, consulte la Plantilla de Imágenes.

    Bajo Imágenes de plantillas de tienen algún código para especificar el UIImageRenderingMode.

    UIImage *myImage = [UIImage imageNamed:@"back"];
    UIImage *backButtonImage = [myImage imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];  
    //now use the new backButtomImage
    [[UINavigationBar appearance] setBackIndicatorImage:backButtonImage];
    [[UINavigationBar appearance] setBackIndicatorTransitionMaskImage:backButtonImage];

    trata de la creación de la UIImage con la alineación de los márgenes y, a continuación, coloque la parte Trasera del Indicador de la imagen.

    UIEdgeInsets insets = UIEdgeInsetsMake(10, 0, 0, 0); //or (0, 0, -10.0, 0)
    UIImage *alignedImage = [[UIImage imageNamed:@"back"] imageWithAlignmentRectInsets:insets];  
    [[UINavigationBar appearance] setBackIndicatorImage:alignedImage];
    [[UINavigationBar appearance] setBackIndicatorTransitionMaskImage:alignedImage];

    También podría tratar de ajustar la posición de la UINavigationBar de texto título de

    [[UINavigationBar appearance] setTitleVerticalPositionAdjustment:(CGFloat)adjustment forBarMetrics:(UIBarMetrics)barMetrics];

    • esto deja a la flecha (imagen) en el mismo lugar, no funciona para mí
    • Véase mi edición — de Apple UIKit Interfaz de Catálogo. «Si usted tiene UIImageRenderingModeAutomatic establece en su imagen, será tratada como plantilla o original basado en su contexto.» Que es el predeterminado para cualquier UIIImage. Personalizado botón atrás probablemente estaba siendo tratada como una plantilla o stencil – imagen (y esperemos que el tratamiento original de rendir adecuadamente en el UINavigationBar.)
    • Acabo de intentar pero el resultado es el mismo :/
    • Bueno, si hay una respuesta podría estar en algún lugar en el que documento. Sólo por curiosidad, ¿has probado la eliminación de la aplicación de simulador/dispositivo y hacer una Limpia/Rebuild?
    • Voy a tener una mirada más profunda en el documento más tarde, pero sí, yo he hecho eso!
    • Siempre se puede tratar de Desarrollador de Apple soporte técnico (cada cuenta dispone de dos incidentes por año) aquí.
    • Yo tengo que trabajar, con un mashup de la parte superior de las dos piezas de código FYI
    • La 2ª opción trabajado para mí (imagen con márgenes). He tenido que utilizar el recuadro de la parte inferior de -10 así. Gracias!
    • Para aquellos que vienen aquí último, hay dos soluciones globales personalizadas de nuevo el botón. 1.) El uso de inserciones para compensar la 30×30 imagen y establecerla en el UINavigationBar apariencia. 2.) El uso de inserciones de definir claramente el ancho de la 30×30 imagen y establecerla en el UIBarButtonItem apariencia. Haciendo #2 quita el gesto atrás pero puede caber imágenes más grandes muy bien. Elegí #1 con un 30×30 imagen con un desplazamiento así: UIEdgeInsetsMake(0, 0, 0, -10)

  2. 8

    Bien simplemente siga una de las sugerencias para corregir el diseño y perder el iOS 7 «gesto de vuelta», y luego fijarlo con un UIScreenEdgePanGestureRecognizer!

    Un UIScreenEdgePanGestureRecognizer busca panorámica (arrastrando) gestos que comienzan cerca de un borde de la pantalla. El sistema utiliza el borde de la pantalla los gestos, en algunos casos, para iniciar el controlador de vista de las transiciones. Usted puede utilizar esta clase para replicar el mismo gesto comportamiento de sus propias acciones.

  3. 6

    POR FAVOR, CONSULTE EDICIÓN DE ABAJO!!!

    He creado una costumbre botón atrás en iOS7 no hace mucho tiempo. La mina tiene una flecha y la palabra de nuevo en él. Yo creo que pawan la sugerencia es un buen comienzo. Para crear el botón atrás con la imagen personalizada que se puede utilizar,

    UIBarButtonItem *backButton = [[UIBarButtonItem alloc] initWithTitle:@"Back" style:UIBarButtonItemStylePlain target:self action:@selector(backButtonClicked)];
    [backButton setBackgroundImage:finalImage forState:UIControlStateNormal barMetrics:UIBarMetricsDefault];
    [backButton setTitlePositionAdjustment:UIOffsetMake(-20, 0) forBarMetrics:UIBarMetricsDefault];
    
    self.navigationItem.leftBarButtonItem = backButton;

    Mi imagen finalImage es un compuesto de dos imágenes diferentes, pero sólo puede usar su «espalda» de la imagen. Pero creo que es donde radica el problema. Mi imagen era un compuesto, es posible que desee realizar una composición, pero poner un claro espacio por encima de su icono. Coloqué un espacio libre a la derecha de mi icono para ajustar el espaciado. Aquí está el código,

    UIImage *arrow = [UIImage imageNamed:@"back.png"];
    UIImage *wordSpace = [UIImage imageNamed:@"whiteSpace.png"];
    CGSize size = CGSizeMake(arrow.size.width + wordSpace.size.width, arrow.size.height);
    UIGraphicsBeginImageContext(size);
    [arrow drawInRect:CGRectMake(0, 0, arrow.size.width, size.height)];
    [wordSpace drawInRect:CGRectMake(arrow.size.width, 0, wordSpace.size.width, wordSpace.size.height)];
    UIImage *finalImage = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext(); 

    La Imagen wordSpace es un claro png que he hecho en photoshop, así que mi nuevo botón atrás de la imagen no fue estirado. Es posible que desea colocar una clara png en la parte superior, presione el icono de abajo un poco. Hacer que el tamaño.la altura de la misma en photoshop por lo que considera que el ajuste debe ser. Usted puede ser que necesite para preocuparte más con esto un poco. Y asegúrese de cambiar el CGSize para que se adapte a su icono y el espacio claro.

    Mi palabra de vuelta fue un poco fuera, así que lo miré a

    [backButton setTitlePositionAdjustment:UIOffsetMake(-20, 0) forBarMetrics:UIBarMetricsDefault];

    Tuve que jugar con esa línea un poco para que se vea tan bien como sea posible, pero, finalmente, me dio lo que yo quería con el -20. Yo incluso ajustado de la segunda variable que es 0 en la mina, esta movido el icono real a su alrededor. -5 poner el icono de abajo en forma de lejos, pero su otra opción de la clara png.

    Ahora para lidiar con el hecho de que usted quiere ser un botón atrás. Mira la primera línea de código que he publicado. La acción en el botón de es @selector(backButtonClicked). Así que todo lo que necesitas hacer es hacer que el método y usted debe ser bueno para ir!

    - (void)backButtonClicked
    {
      NSLog(@"going back");
      [self.navigationController popViewControllerAnimated:YES];
    }

    Espero que esto ayude un poco.

    Cómo colocar correctamente el botón atrás en iOS7

    EDIT*****

    Yo estaba jugando con mi código un poco y encontrar una mejor manera de mover el icono de nuevo. Acabo de utilizar un barco de rueda porque no tengo el mismo que usted hizo, pero funcionará de la misma.

    Puesto que usted realmente no quiere un título que puede crear el botón con este código,

    UIImage *image = [UIImage imageNamed:@"781-ships-wheel.png"];
    
    UIBarButtonItem *backButton = [[UIBarButtonItem alloc] initWithImage:image style:UIBarButtonItemStylePlain target:self action:@selector(backButtonClicked)];

    Acaba de cambiar el 781 cosas con el icono de tu nombre. A continuación, puedes moverlo con el siguiente,

    [backButton setImageInsets:UIEdgeInsetsMake(20, 0, -20, 0)];

    Echa un vistazo a esta imagen.

    Cómo colocar correctamente el botón atrás en iOS7

    Esto muestra el icono de abajo considerablemente, pero quería mostrar la idea. Los números para el Borde de los márgenes están en la parte Superior, Inferior, Izquierdo y Derecho. No toque a la izquierda y a la derecha si usted no necesita moverse de esa manera, el cambio de la parte superior e inferior. Notar sin embargo, que si usted necesita para moverlo hacia abajo por 20 puntos como lo hice yo, (demasiado) que usted necesita para compensar por la negativa de la parte inferior o en el icono de comprimirse. Esto es lo que se ve con todos los ceros.

    Cómo colocar correctamente el botón atrás en iOS7

    Así que prácticamente se puede mover donde quieras, pero usted todavía tiene que configurar el @selector(backButtonClicked) para que funcione como un verdadero botón atrás.

    • Hola @Douglas, su respuesta funcionaría SI yo estaba dispuesto a desactivar el gesto atrás en iOS7 (que no soy). Ese es el problema!
    • No lo entiendo, esto permite el gesto atrás. Usted sólo va a sustituir el genérico de la parte posterior de la flecha y la palabra de nuevo con su propio icono. Pero, al hacerlo girar en el nuevo icono de la acción a la parte de atrás gesto.
    • Gesto != Acción // norton ghost.ser/H8w1NCkBhV4?t=25 años
    • Así que usted quiere que el gesto atrás (deslizar el dedo para volver) y el botón atrás con la acción(pulsar para volver)?
    • exactamente——–
    • el círculo con la flecha no es el predeterminado botón atrás en iOS7. ¿Agregar que a ti mismo? Si es así, entonces todo lo que necesita hacer ahora es poner en un UISwipeGestureRecognizer junto con el código que tengo en mi edición y que tendrá tanto. Has probado el pase? UISwipeGestureRecognizer *swipeMe = [[UISwipeGestureRecognizer alloc] initWithTarget:auto action:@selector(swipeLeft)]; swipeMe.dirección = UISwipeGestureRecognizerDirectionleft; [self.ver addGestureRecognizer:swipeMe]; a Continuación, en el método swipeLeft hacer lo mismo popViewControllerAnimated:SÍ.
    • Yo voy a usar tu «solución» por ahora, pero no puedo comprobar como correcta tu respuesta, ya que todavía tengo el problema con el gesto atrás.
    • El gesto de no trabajar? He hecho un proyecto de prueba con el botón de trabajo y el pase a funcionar de nuevo. Aunque sólo aparece la opinión no es una ingeniosa de transición. Déjeme saber si usted desea ver. Pero gracias por la pregunta, que ha sido divertido buscando en él!
    • Hey, yo no quiero usar el gesto personalizado, pero el gesto que apple ofrece por defecto, en iOS7, cuando se utiliza un UINavigationController con UINavigationBar. Si usted echa un vistazo a el vídeo que he publicado en este mismo hilo verás a lo que me refiero!
    • USTED ES EL HOMBRE! Esta es la única solución que funcionó para mí!

  4. 5

    Este es Swift 2 versión.
    La forma más sencilla es como este. Poner este código en AppDelegate.’

    func application(application: UIApplication, didFinishLaunchingWithOptions launchOptions: [NSObject: AnyObject]?) -> Bool {
            let navigationBarAppearace = UINavigationBar.appearance()
            let image = UIImage(named: "back-btn")
            navigationBarAppearace.backIndicatorImage = image
            navigationBarAppearace.backIndicatorTransitionMaskImage = image
    
            return true
        }

    si tu botón de atrás tiene un color de fondo, puede que no funcione correctamente.

    Agregar el icono con asset folder para cada una resolución como esta:
    Cómo colocar correctamente el botón atrás en iOS7

  5. 3

    Usted puede probar este

    self.navigationItem.leftBarButtonItem.imageInsets = UIEdgeInsetsMake(0, 0, 10, 0);
    • esto deja a la flecha (imagen) en el mismo lugar, no funciona para mí
  6. 3

    El problema es que la imagen es demasiado alto. Para probar esto, primero pruebe este código:

    UIGraphicsBeginImageContextWithOptions(CGSizeMake(10,20), NO, 0);
    CGContextFillRect(UIGraphicsGetCurrentContext(), CGRectMake(6,0,4,20));
    UIImage* im = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
    self.navbar.backIndicatorImage = im;
    UIGraphicsBeginImageContextWithOptions(CGSizeMake(10,20), NO, 0);
    UIImage* im2 = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
    self.navbar.backIndicatorTransitionMaskImage = im2;

    Se ve bien. Ahora cambio el 20 a 30 en los dos CGSizeMake llamadas:

    UIGraphicsBeginImageContextWithOptions(CGSizeMake(10,30), NO, 0);
    CGContextFillRect(UIGraphicsGetCurrentContext(), CGRectMake(6,0,4,20));
    UIImage* im = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
    self.navbar.backIndicatorImage = im;
    UIGraphicsBeginImageContextWithOptions(CGSizeMake(10,30), NO, 0);
    UIImage* im2 = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
    self.navbar.backIndicatorTransitionMaskImage = im2;

    El icono de ahora es demasiado alto.

    Tan sólo hacer que su imagen de 20 píxeles de altura y todo estará bien.

  7. 1
    UIEdgeInsets insets = UIEdgeInsetsMake(0, 0, -2, 0); //or (2,0,0,0)
    UIImage *backArrowImage = [[UIImage imageNamed:@"back"] imageWithAlignmentRectInsets:insets];
    
    [[UINavigationBar appearance] setBackIndicatorImage:backArrowImage];
    [[UINavigationBar appearance] setBackIndicatorTransitionMaskImage:backArrowImage];

Dejar respuesta

Please enter your comment!
Please enter your name here