UITableView con un gradiente de transparente en la parte superior e inferior

Question

He buscado este foro, Google y otros foros y no han encontrado una respuesta a mi problema en particular.

Básicamente, tengo un UIView que contiene UITableView. Seguí esto tutorial y fue parcialmente exitoso. El problema es el gradiente. Tengo una imagen de fondo detrás del UITableView. Entonces, a medida que la celda se acerca al gradiente, quiero que se muestre el fondo, en lugar del blanco.

También encontré este post que es donde encontré el tutorial, pero no quería secuestrar esa publicación con mis propias preguntas para matt.

Cualquier ayuda en la dirección correcta sería genial!

EDIT1: sé que puedo usar otra imagen con la imagen de fondo y el medio cortada, pero estoy buscando una solución que evite el uso de PNG, si es posible.

Edit2: He aquí una imagen de lo que me pasa ahora:

Edit3:

Aquí está mi código:

Cabecera:

@interface MyView : UIViewController { 
    CAGradientLayer *_maskLayer; 
    UITableView *_tableView; 
} 

@property (nonatomic, retain) CAGradientLayer *maskLayer; 
@property (nonatomic, retain) IBOutlet UITableView *tableView;

Implementación:

@implementation HighScoresView_iPhone 

@synthesize tableView = _tableView; 
@synthesize maskLayer = _maskLayer; 

- (void)viewWillAppear:(BOOL)animated { 

    [super viewWillAppear:animated]; 

    if (![self maskLayer]) { 
     [self setMaskLayer:[CAGradientLayer layer]]; 
     CGColorRef outerColor = [UIColor colorWithWhite:1.0 alpha:1.0].CGColor; 
     CGColorRef innerColor = [UIColor colorWithWhite:1.0 alpha:0.0].CGColor; 

     [[self maskLayer] setColors:[NSArray arrayWithObjects: 
            (id)outerColor, 
            (id)innerColor, 
            (id)innerColor, 
            (id)outerColor, 
            nil 
            ] 
     ]; 
     [[self maskLayer] setLocations:[NSArray arrayWithObjects: 
             [NSNumber numberWithFloat:0.0], 
             [NSNumber numberWithFloat:0.2], 
             [NSNumber numberWithFloat:0.8], 
             [NSNumber numberWithFloat:1.0], 
             nil 
             ] 
     ]; 
     [[self maskLayer] setBounds:CGRectMake(0, 0, [[self scoreTableView] frame].size.width, [[self scoreTableView] frame].size.height)]; 
     [[self maskLayer] setAnchorPoint:CGPointZero]; 
     [[[self scoreTableView] layer] addSublayer:[self maskLayer]]; 
    } 
}

Answer 1

suena como el color de fondo de la vista de tabla se establece en blanco. Intente configurar el fondo de la vista de tabla a transparente:

tableView.backgroundColor = [ UIColor clearColor ] ; 
tableView.opaque = NO ; 

Answer 2

Usted puede hacer esto con la propiedad CALayermask. Pero no puede establecer la máscara en la propia capa de la vista de tabla porque esa máscara se desplazará con las filas de la tabla. En su lugar, ponga su vista de tabla dentro de una nueva supervista (de la clase UIView) que cree solo para esto. Llámalo tableMaskView.

El nuevo supervista debe tener la propiedad backgroundColor establece en UIColor.clearColor y su propiedad opaque establece en NO. Entonces se puede establecer la máscara de la siguiente manera:

CAGradientLayer *gradient = [CAGradientLayer layer]; 
gradient.frame = self.tableMaskView.bounds; 
gradient.colors = [NSArray arrayWithObjects: 
    (__bridge id)UIColor.clearColor.CGColor, 
    UIColor.whiteColor.CGColor, 
    UIColor.whiteColor.CGColor, 
    UIColor.clearColor.CGColor, 
    nil]; 
gradient.locations = [NSArray arrayWithObjects: 
    [NSNumber numberWithFloat:0], 
    [NSNumber numberWithFloat:1.0/16], 
    [NSNumber numberWithFloat:15.0/16], 
    [NSNumber numberWithFloat:1], 
    nil]; 
self.tableMaskView.layer.mask = gradient; 

Usando una máscara de capa no es la forma más eficiente, pero es la más fácil de programar. Prueba si es lo suficientemente rápido.

Answer 3

Reemplazar esta línea:

[[[self scoreTableView] layer] addSublayer:[self maskLayer]]; 

Con éste:

self.scoreTableView.layer.mask = self.maskLayer; 

(O si usted insiste en su sintaxis de estilo hasta pensaban que no puedo ver por qué):

[[[self scoreTableView] layer] setMask:[self maskLayer]]; 

también this respuesta podría ayudarle.

Answer 4

Swift 3 versión de rob mayoff 's answer:

let gradient = CAGradientLayer() 
gradient.frame = tableMaskView.bounds 
gradient.colors = [UIColor.clear.cgColor, UIColor.white.cgColor, 
        UIColor.white.cgColor, UIColor.clear.cgColor] 
gradient.locations = [0 as NSNumber, 1.0/16.0 as NSNumber, 
         15.0/16.0 as NSNumber, 1 as NSNumber] 
tableMaskView.layer.mask = gradient