iphone - como - Control UISegmented personalizado

personalizar centro de control ios 10

Question

¿Cómo hago un UISegmentedControl personalizado?

Tengo 2 imágenes, 1 que se debe mostrar cuando el segmento está activo y el otro si el segmento está inactivo. ¿Puedo anular el estilo o algo así que tengo un UISegmentedControl con mis propias imágenes como fondo activo / inactivo?

Answer 1

Swift 3.0 Versión de la respuesta de Jon.

var transparentImage = UIGraphicsGetImageFromCurrentImageContext() as? UIImage
UIGraphicsEndImageContext()
segControl.setBackgroundImage(transparentImage, for: .normal, barMetrics: .default)
segControl.setDividerImage(transparentImage, forLeftSegmentState: .normal, rightSegmentState: .normal, barMetrics: .default)

Answer 2

Escribí algo que funciona como @rpetrich fue explicar sin colocar en una matriz y en mi opinión es la solución más fácil para esto. Espero que alguien encuentre esto útil

.h

IBOutlet UIButton *index0;
IBOutlet UIButton *index1;
IBOutlet UIButton *index2;
IBOutlet UIImageView *segMentControl;

-(IBAction)segmentSwitch:(UIButton *) buttonIndexPressed;

.metro

-(IBAction)segmentSwitch:(UIButton *) buttonIndexPressed
{
    if (buttonIpressed == index0)
    {
        [segmentControl setImage:[UIImage imageNamed:@"Seg1Sel.png"]];
        NSLog(@"index 0 pushed");

        index0.enabled = NO;
        index1.enabled = YES;
        index2.enabled = YES;        
    }
    else if (buttonIpressed == index1)
    {
         [segmentControl setImage:[UIImage imageNamed:@"Seg2Sel.png"]];
         NSLog(@"index 1 pushed");

         index0.enabled = YES;
         index1.enabled = NO;
         index2.enabled = YES;
    }
    else if (buttonIpressed == index2)
    {
        [segmentControl setImage:[UIImage imageNamed:@"Seg3Sel.png"]];
        NSLog(@"index 2 pushed");

        index0.enabled = YES;
        index1.enabled = YES;
        index2.enabled = NO;
    }
}

Answer 3

La forma más simple sería crear su propio control que imite a UISegmentedControl . UISegmentedControl simplemente organiza una serie de botones y gestiona sus estados de imagen para usted; no hace nada especial.

Answer 4

Para hacer esto, debe escuchar UIControlEventValueChanged y cambiar la imagen usted mismo. No debería necesitar subclasificar el control UISegmentedControl: recuerde que se prefiere la composición por herencia .

Answer 5

Pruebe HMSegmentedControl, también permite imágenes y otras configuraciones. Disponible en https://github.com/HeshamMegid/HMSegmentedControl

Answer 6

Puede usar los métodos que se describen en la biblioteca del desarrollador de iOS:

http://developer.apple.com/library/ios/ipad/#documentation/uikit/reference/UISegmentedControl_Class/Reference/UISegmentedControl.html

Desplácese hacia abajo a la sección "Personalización de la apariencia". Existen métodos para establecer imágenes de fondo para varios estados de botones, imágenes de divisores de botones, etc.

Estos métodos solo están disponibles en iOS5 y versiones posteriores.

@property tintColor  
– backgroundImageForState:barMetrics:
– setBackgroundImage:forState:barMetrics:
– contentPositionAdjustmentForSegmentType:barMetrics:
– setContentPositionAdjustment:forSegmentType:barMetrics:
– dividerImageForLeftSegmentState:rightSegmentState:barMetrics:
– setDividerImage:forLeftSegmentState:rightSegmentState:barMetrics:
– titleTextAttributesForState:
– setTitleTextAttributes:forState:

Answer 7

Sí, usted REALMENTE necesita 2 imágenes (activadas y desactivadas) para cada sección de la barra de segmentos. (4 segmentos ... 8 imágenes.) ¡Pero le permite establecer un total de 16 opciones! (Todo con solo consumir 1 fila en su GUI).

Hice que todo funcionara, EXCEPTO ... ¿cómo se ocultan los gráficos de barras de segmentos originales?

No se puede establecer alfa en 0. (También ocultará sus imágenes).

No se puede configurar "tintClear" para "borrar". (No estoy seguro de por qué lo hace en blanco y negro.)

No se puede configurar como "oculto" ... nada funcionará en absoluto.

No se puede configurar "fondo" para "borrar". (El fondo NO es los gráficos de la barra de segmentos).

Answer 8

Tuve que agregar este código adicional, además de tener 2 estados diferentes para las posiciones "encendido" y "apagado":

- (void)viewDidLoad
{
    [super viewDidLoad];

    // Set set segControl background to transparent
    CGRect rect = CGRectMake(0, 0, 1, 1);
    UIGraphicsBeginImageContext(rect.size);
    CGContextRef context = UIGraphicsGetCurrentContext();
    CGContextSetFillColorWithColor(context, [[UIColor clearColor] CGColor]);
    CGContextFillRect(context, rect);
    UIImage *transparentImage = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();

    [self.segControl setBackgroundImage:transparentImage forState:UIControlStateNormal barMetrics:UIBarMetricsDefault];

    [self.segControl setDividerImage:transparentImage forLeftSegmentState:UIControlStateNormal rightSegmentState:UIControlStateNormal barMetrics:UIBarMetricsDefault];
}

EDITAR: Debido a que esto está recibiendo algo de publicidad, una solución más limpia es usar [UIImage nuevo] en lugar de crear imágenes transparentes, como tal:

 [self.segControl setDividerImage:[UIImage new] forLeftSegmentState:UIControlStateNormal rightSegmentState:UIControlStateNormal barMetrics:UIBarMetricsDefault];
 [self.segControl setBackgroundImage:[UIImage new] forState:UIControlStateNormal barMetrics:UIBarMetricsDefault];

Answer 9

funciona bien

[segmentControl setImage:[UIImage imageNamed:@"Rolenew.png"] forSegmentAtIndex:0];