Actualmente, estoy tratando de configurar los botones siguiente/anterior en mi teclado de la barra de herramientas a la nueva y elegante de iOS 7 botón atrás/adelante botones que se te meten en la navegación de los controladores de volver. Aquí es lo que estoy tratando. ¿Cómo puedo utilizar el sistema de botón de la barra de elemento en lugar de la aburrida texto estático?

[self setToolbar:[[UIToolbar alloc] initWithFrame:self.frame]];
        [self.toolbar setBarStyle:UIBarStyleDefault];
        [self.toolbar setAutoresizingMask:(UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleRightMargin | UIViewAutoresizingFlexibleWidth)];
        [self addSubview:self.toolbar];

        [self setSegmentedControl:[[UISegmentedControl alloc] initWithItems:@[ NSLocalizedStringFromTable(@"Previous", @"BSKeyboardControls", @"Previous button title."),
                                                                               NSLocalizedStringFromTable(@"Next", @"BSKeyboardControls", @"Next button title.") ]]];

Aquí es lo que se ve ahora:

Siguiente/Anterior del Teclado de la Barra de herramientas iOS7

Aquí es lo que quiero que se vea así:
Siguiente/Anterior del Teclado de la Barra de herramientas iOS7

Cualquier idea sobre cómo acceder a los elementos del sistema sin el uso de imágenes? Sé que es exactamente iOS 7 botón de la barra de punto, sólo que no sé cómo acceder a ella en una barra de herramientas. He buscado por todas partes. Si ayuda, estoy usando BSKeyboardControls.

EDIT: Para que se vea exactamente igual a la de la segunda imagen, el uso de las imágenes proporcionadas por Josué, y guardar como [email protected] y [email protected] en su xcode proj. El uso de Chun del código, pero asegúrese de llamar al método para la obtención de las imágenes como ésta: imageNamed:@»volver», y no @»[email protected]». Ahora tienes iOS 7 botones atrás y adelante 🙂

EDIT2: Para conseguir que se vea exactamente igual a la anterior/siguiente botones de flecha utilizar las siguientes personalizaciones en la correcta aplicación de los métodos:

[self.segmentedControl setWidth:50 forSegmentAtIndex:0];
[self.segmentedControl setWidth:38 forSegmentAtIndex:1];

negativeSeparator.width = -19;

EDIT3: La barra de herramientas con el < > flechas que viene por defecto con todos los UIWebViews, y aparece cuando toque un campo de texto.

Si alguien está interesado en un proyecto de ejemplo, hágamelo saber y voy a subir un link!

EDIT4: a partir de 24 de Mayo de 2014, BSKeyboardControls que ahora tiene esta funcionalidad por defecto.

7 Comentarios

  1. 6

    1) la última Descarga de archivos desde: https://github.com/simonbs/BSKeyboardControls

    2) la Importación de las imágenes para atrás/siguiente botones. Estos pueden ser cualquier cosa que usted desea, y usted puede configurar el tamaño adecuado para que se vea bien. Joshua tiene un buen conjunto. Yo tengo la mía guarda como «keyboardBack.png» y «keyboardForward.png»

    3) En BSKeyboardControls.m, actualización initWithFields:campos. Aquí usted puede hacer algunos de personalización como el ajuste de la anchura de su espalda/botones siguiente. He quitado el botón Hecho también aquí para seguir tu captura de pantalla, pero usted puede agregar de nuevo.

    - (id)initWithFields:(NSArray *)fields
    {
        if (self = [super initWithFrame:CGRectMake(0.0f, 0.0f, 320.0f, 44.0f)])
        {
            //Creates toolbar
            [self setToolbar:[[UIToolbar alloc] initWithFrame:self.frame]];
            [self.toolbar setBarStyle:UIBarStyleDefault];
            [self.toolbar setAutoresizingMask:(UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleRightMargin | UIViewAutoresizingFlexibleWidth)];
            [self addSubview:self.toolbar];
    
            //Import images
            UIImage *backImage = [[UIImage imageNamed:@"keyboardBack"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
            UIImage *forwardImage = [[UIImage imageNamed:@"keyboardForward"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
    
            //Create segmentedcontrol
            self.segmentedControl = [[UISegmentedControl alloc] initWithItems:@[backImage, forwardImage]];
            self.segmentedControl.tintColor = [UIColor clearColor];
    
            //Set button widths
            [self.segmentedControl setWidth:50 forSegmentAtIndex:0];
            [self.segmentedControl setWidth:50 forSegmentAtIndex:1];
    
            //Other BSKeyboardControls stuff
            [self.segmentedControl addTarget:self action:@selector(segmentedControlValueChanged:) forControlEvents:UIControlEventValueChanged];
            [self.segmentedControl setMomentary:YES];
            [self.segmentedControl setEnabled:NO forSegmentAtIndex:BSKeyboardControlsDirectionPrevious];
            [self.segmentedControl setEnabled:NO forSegmentAtIndex:BSKeyboardControlsDirectionNext];
            [self setSegmentedControlItem:[[UIBarButtonItem alloc] initWithCustomView:self.segmentedControl]];
            [self setVisibleControls:(BSKeyboardControlPreviousNext)];
            [self setFields:fields];
        }
    
        return self;
    }

    4) El margen izquierdo de la barra de herramientas es un poco demasiado, así que usted puede fijar mediante la adición de un negativo separador en toolbarItems: en BSKeyboardControls.m:

    - (NSArray *)toolbarItems
    {
        NSMutableArray *items = [NSMutableArray arrayWithCapacity:3];
        if (self.visibleControls & BSKeyboardControlPreviousNext)
        {
            UIBarButtonItem *negativeSeperator = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemFixedSpace
                                                                                               target:nil
                                                                                               action:nil];
            negativeSeperator.width = -12;
    
            [items addObject:negativeSeperator];
            [items addObject:self.segmentedControlItem];
    
        }
    
        if (self.visibleControls & BSKeyboardControlDone)
        {
            [items addObject:[[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemFlexibleSpace target:nil action:nil]];
            [items addObject:self.doneButton];
        }
    
        return items;
    }

    Nota: probablemente no tiene el botón de anchos y acolchados para las especificaciones exactas, pero se puede ajustar a su gusto!

    • Maravilloso, en la profundidad de la respuesta! Gran trabajo! Si hubieras respondido un poco antes me hubiera dado la recompensa también!
  2. 21

    Estas son las imágenes que se utilizan en la barra de herramientas, por ejemplo, la espalda y el botón de avance de imágenes:

    Siguiente/Anterior del Teclado de la Barra de herramientas iOS7

    Siguiente/Anterior del Teclado de la Barra de herramientas iOS7

    • Estoy asumiendo que estos son el x2? ¿Tiene el x1 así?
    • Me temo que no, usted debería ser capaz de reducir a la mitad, para darle todavía una buena 1x imagen.
    • Allí, donde usted puede encontrar los iconos: icons8.com/icons/#!/3299/siguiente
  3. 8

    Utilizar los iconos compartida por Josué y, a continuación, pruebe con el siguiente trozo de código y usted será bueno para ir. No he añadido el botón hecho aquí.

    UIImage *backImage = [[UIImage imageNamed:@"backImage"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
    UIImage *forwardImage = [[UIImage imageNamed:@"forward"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
    self.segmentedControl = [[UISegmentedControl alloc] initWithItems:@[backImage, forwardImage]];
    [self.segmentedControl addTarget:self action:@selector(segmentedControlChangedState:) forControlEvents:UIControlEventValueChanged];
    self.segmentedControl.segmentedControlStyle = UISegmentedControlStyleBar;
    self.segmentedControl.tintColor = [UIColor clearColor];
    UIBarButtonItem *aSegmentedControlBarButtonItem = [[UIBarButtonItem alloc] initWithCustomView:self.segmentedControl];
    [self setItems:@[aSegmentedControlBarButtonItem, self.flexibleSpace]];
    • ¿Cuál es el tipo de parámetro a segmentedControlChangedState:? UISegmentedControl?
    • Sí. - (void)segmentedControlChangedState:(UISegmentedControl *)iSender
    • segmentedControlStyle está en desuso, ahora no tiene ningún efecto.
  4. 5

    Si no te importa vivir en el borde que usted podría utilizar Apple indocumentados elementos del sistema para lograr el aspecto de iOS 7. Aquí están a la izquierda y a la derecha el botón de la barra de elementos.

        [self setDoneButton:[[UIBarButtonItem alloc] initWithBarButtonSystemItem:105 target:nil action:nil]];
        [self setDoneButton:[[UIBarButtonItem alloc] initWithBarButtonSystemItem:106 target:nil action:nil]];

    Fuente: http://iphonedevwiki.net/index.php/UIBarButtonItem

    • Es permitido para las aplicaciones de la App Store?
    • La respuesta correcta es esta desde que apple maneja este tipo de imágenes en su propia manera. Debemos atenernos con ella para evitar que nuestras aplicaciones mirada absurda después de las actualizaciones de ios.
    • ¿Cómo puedo lograr esto mediante el uso de Swift?
    • Esto no funciona en Xcode 7.3/Swift 2.2: no se puede utilizar un número entero en el initWithBarButtonSystemItem parámetro.
  5. 2

    Puede utilizar este gran herramienta por @iftekhar y personalizar IQSegmentedNextPrevious de acuerdo a su necesidad para dar a las imágenes en lugar de anterior siguiente botón.

    • Estoy de acuerdo. Acabo de probar esta biblioteca, y es increíble.
  6. 1

    Con Xcode 7.3, también puede introducir un símbolo como el título para el Elemento de la Barra. Esto funciona tanto en el código y en el Interface Builder:

    • Coloque el cursor donde desea que el símbolo aparezca (por ejemplo, title cuadro en IB o dentro de comillas en el código).
    • En Xcode del menú, haga clic en Editar y, a continuación, Emoji & Símbolos. (Como alternativa, presione control-comando-espacio para abrir la lista de caracteres).
    • En el cuadro de búsqueda, escriba menos o mayor.
    • A continuación, seleccione el símbolo que desea.

    El menor que y mayor que los símbolos son de color azul en la barra de herramientas por defecto.

    Código:

    backButton.title = "<"

    IB:

    Siguiente/Anterior del Teclado de la Barra de herramientas iOS7

  7. 0

    Usar este: https://github.com/simonbs/BSKeyboardControls

    Pero utiliza la segmentación de control que tiene aplanado en iOS 7.

    Editar:
    Simplemente cambiar el texto de los segmentos:

      [self setSegmentedControl:[[UISegmentedControl alloc] initWithItems:@[@"<",@">") ]]];

    Esto puede no ser la más elegante. (Ni siquiera sé exactamente este código se compila, pero veo que el punto)

    • Que es lo que estoy utilizando. Sólo estoy curioso acerca de cómo cambiar la segmentedcontrol sólo a la <> los símbolos.
    • A qué te refieres, simplemente cambiar el texto en la fuente de la BSKeyboard código:
    • No, me refiero a realmente usar el iOS 7 flechas. Como las que aparecen en los elementos de navegación.

Dejar respuesta

Please enter your comment!
Please enter your name here