iphone - custom - uisearchbar swift 4

Fondo gris claro en "área de rebote" de una UITableView

Question

Las aplicaciones para iPhone de Apple, como Música y Contantes, usan una barra de búsqueda en una UITableView. Cuando se desplaza hacia abajo para que la barra de búsqueda se mueva hacia abajo, el espacio vacío sobre el contenido de la vista de desplazamiento tiene un color de fondo gris claro (consulte la captura de pantalla).

(Tenga en cuenta que la barra de búsqueda tiene una línea de borde ligeramente más oscura en su parte superior. Esto no está allí para el UISearchBar predeterminado, pero la subclasificación debería ocuparse de eso).

Intenté establecer el color de fondo de UITableView, pero eso también afecta a las filas. ¿Alguien sabe cómo lograr este efecto? ¿Voy a tener que anular la implementación de drawRect: o hay un camino integrado?

Answer 1

LA SOLUCIÓN MÁS FÁCIL

La forma más fácil de crear diferentes colores en la parte inferior y en la parte superior de un área de rebote de una vista de tabla es establecer la clave tableHeaderBackgroundColor de la vista de tabla. De esta manera, establece el color superior. No estoy seguro, pero tal vez haya otra clave para el pie de página, eche un vistazo. Si no encuentra nada, solo tiene que establecer el fondo de la vista de tabla con el color que desea mostrar en la parte inferior. Arriba puedes ver un código de ejemplo:

self.table.setValue(UIColor.blue , forKey: "tableHeaderBackgroundColor")

Espero que te ayude En caso afirmativo, informe a otras personas acerca de esta manera fácil de dar una respuesta positiva :)

Answer 2

A partir de iOS 7, puede modificar esto cambiando la vista de fondo de la vista de tabla.

[self.tableView setBackgroundView:view];

hacer que el color de fondo de la vista sea el mismo que el color de vista principal.

Answer 3

Acabo de encontrarme con este problema y encontré una solución.

Porque

Usé Spark Inspector para examinar el diseño de la vista de tabla, lo que realmente me ayudó.

La cosa es que en este escenario, UITableView tiene 3 subvistas:

1. UITableViewWrapperView
2. UIView - Con backgroundColor configurado en color gris claro
3. UISearchBar

Mientras desliza hacia abajo el contenido de la vista de tabla, la altura de la segunda subvista aumenta dinámicamente para llenar el espacio entre el UITableViewWrapperView del marco UITableViewWrapperView y UITableView .

Solución

Establecer la propiedad backgroundColor o backgroundView no afectará a la segunda subvista. Lo que debe hacer es buscar la segunda vista y cambiar su color, de esta forma:

if (_tableView.subviews.count > 1) {
    _tableView.subviews[1].backgroundColor = THE_TARGET_COLOR;
}

En mi caso, necesitaba que todas las vistas fueran blancas, así que usé lo siguiente, que es menos propenso a cambios futuros de la jerarquía de vistas de UITableView por parte de Apple:

for (UIView *subview in _tableView.subviews) {
    subview.backgroundColor = [UIColor whiteColor];
}

Answer 4

Configurar transparencias es malo para el rendimiento. Lo que desea es el área gris sobre la barra de búsqueda, pero aún debe ser blanca más allá del final de la lista.

Puede agregar una subvista a su UITableView que viva sobre el contenido en su lugar.

CGRect frame = self.list.bounds;
frame.origin.y = -frame.size.height;
UIView* grayView = [[UIView alloc] initWithFrame:frame];
grayView.backgroundColor = [UIColor grayColor];
[self.listView addSubview:grayView];
[grayView release];

Podría agregar cosas más sofisticadas a la vista si lo desea, tal vez un desvanecimiento, o una línea divisora ​​sin subclasificar UISearchBar .

Answer 5

En Swift (probado en iOS9)

    let backView = UIView(frame: self.tableView.bounds)
    backView.backgroundColor = UIColor.clearColor() // or whatever color
    self.tableView.backgroundView = backView

Answer 6

Este código funciona en Swift fot UITableView :

var frame = self.tableView.bounds
frame.origin.y = -frame.size.height
frame.size.height = frame.size.height
frame.size.width = UIScreen.mainScreen().bounds.size.width
let blueView = UIView(frame: frame)
blueView.backgroundColor = UIColor.headerBlueColor()
self.tableView.addSubview(blueView)

Answer 7

Este es uno de mis trucos favoritos.

UIView *topview = [[[UIView alloc] initWithFrame:CGRectMake(0,-480,320,480)] autorelease];
topview.backgroundColor = [UIColor colorWithRed:226.0/255.0 green:231.0/255.0 blue:238.0/255.0 alpha:1];

[self.tableView addSubview:topview];

Básicamente, estás creando una gran vista del tamaño de la pantalla y colocándola "por encima" del área de contenido. Nunca podrás desplazarte hacia arriba para pasarlo.

Y no se preocupe por el impacto de la memoria de un UIView de 320x480 píxeles, no consumirá ninguna memoria significativa porque el CALayer no tiene ningún contenido significativo.

NOTA: ¿Por qué esta respuesta es relevante cuando la respuesta "aceptada" es mucho más simple? ¿Por qué no simplemente establecer el backgroundView en la vista de tabla? Es porque, en el caso de la aplicación Contactos como se muestra en la pregunta original, el área "arriba" de la vista de tabla tiene un color de fondo diferente (azul claro) que el área "debajo" de la vista de tabla (blanca). Esta técnica le permite tener dos colores diferentes arriba y debajo de la vista de tabla, lo que no se puede lograr con un fondo simple.

EDITOR 1/2018: Como señaló Tom en los comentarios, esta respuesta es bastante antigua y supone que todos los dispositivos iOS tienen el mismo tamaño de pantalla (parece una locura, pero fue el caso en 2009 cuando respondí esto). El concepto que presento aquí todavía funciona, pero debes usar UIScreen.main.bounds para descubrir el tamaño real de la pantalla, o podrías entrar en algunas cosas fantásticas de diseño automático (sugerencias bienvenidas). No recomiendo usar tableView.bounds como en otra respuesta, porque típicamente en viewDidLoad el tamaño de sus vistas no es necesariamente el tamaño en el que se convertirán después de que el controlador las cambie de tamaño. A veces comienzan como 0x0!

Answer 8

Estoy seguro de que eso es [UITableView backgroundColor]. Ha afectado las filas, porque las filas tienen backgroundColor == clear (o semitransparente). Por lo tanto, si va a hacer que las filas no sean transparentes, todo funcionará bien. Esta será la solución.

Answer 9

No creo que quieras anular drawRect. Lo más probable es que lo que esté viendo sea el color de fondo de otra vista o la ventana, que se encuentra "detrás" (es decir, es una super visión) de la vista de tabla. Usualmente hay capas bastante complejas de UIViews en los widgets UI de Apple. Explore la jerarquía de vistas en GDB, mire [myView superview] y luego [someSuperView subviews] e intente manipular sus colores BG en el depurador para ver si puede encontrar cuál es. Sin embargo, si implementa una solución de esta manera, tenga en cuenta que puede no ser compatible en el futuro.

También puede intentar establecer el color BG de una de las vistas detrás de la vista de tabla en Interface Builder (o de la ventana misma).

Answer 10

Para ampliar la sugerencia de HusseinB :

Swift 3

let bgView = UIView()
bgView.backgroundColor = UIColor.white
self.tableView.backgroundView = bgView

C objetivo

UIView *bgView = [UIView new];
bgView.backgroundColor = [UIColor whiteColor];
[self.tableView setBackgroundView:bgView];

Answer 11

Para cualquiera que se pregunte cómo hacer lo mismo para el área de rebote inferior:

Primero agregue una subvista con el color de fondo deseado a la vista de fondo de su vista de tabla:

self.bottomView = [[UIView alloc] initWithFrame:CGRectOffset(self.tableView.frame, 0, self.tableView.frame.size.height)];
self.bottomView.backgroundColor = whateverColorYouLike;

[self.tableView.backgroundView addSubview:self.bottomView];

Y luego en el delegado de tu vista de tabla:

- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
    CGRect frame = self.bottomView.frame;
    frame.origin.y = self.tableView.contentSize.height - self.tableView.contentOffset.y;
    self.bottomView.frame = frame;
}

Answer 12

Seguí la sugerencia señalada por Peylow, para una UITableView, simplemente agregando una subvista. Mi único cambio con respecto al código fue tomar un color más parecido al usado en las aplicaciones de Apple, y me acerqué un poco más al aspecto de Apple de tener una línea sobre UISearchbar reduciendo la coordenada y del origen del fotograma en un píxel:

frame.origin.y = -frame.size.height - 1

Answer 13

Si está utilizando una mesa de vista, puede configurar el fondo de vista para que sea blanco opaco. Entonces usa

self.tableView.backgroundColor = [UIColor grayColor];

en la vista hizo el método de carga.

Answer 14

Solo he encontrado una forma de hacer esto. Debe establecer el color de fondo de UITableView para que sea transparente, establezca el backgroundColor del contentView de la celda en el color que desee que sean las celdas reales, y luego debe tener el color gris claro para aparecer detrás de UITableView. Ese último paso lo puede hacer configurando el backgroundColour de UIWindow, o de lo que contenga o su tableViewController.

Entonces, suponiendo que tiene un controlador de vista que se deriva de UITableViewController, inserte estas líneas en el método - (void) viewDidLoad: -

// sets the background of the table to be transparent
self.tableView.backgroundColor = [UIColor colorWithWhite:1.0 alpha:0.0];
// assuming we are inside a navigation or tab controller, set the background
self.parentViewController.view.backgroundColor = [UIColor lightGrayColor];

Luego, dentro de la parte de tableView: cellForRowAtIndexPath: que crea nuevas celdas, agregue: -

// set an opaque background for the cells 
cell.contentView.backgroundColor = [UIColor whiteColor];

Answer 15

Te daré la mejor manera de hacer esto.
Primero configure el color de fondo de la vista de tabla como el que desea en el constructor de interfaz.
A continuación, responda al delegado tableView:willDisplayCell:ForIndexPath: método como este

- (void)tableView:(UITableView*)tableView willDisplayCell:(UITableViewCelll*)cell forIndexPath:(NSINdexPath*)indexPath
{
     [cell setBackgroundColor:[UIColor whiteColor]];
}

Otro método es:
en el método ViewDidLoad (o en cualquier lugar que desee) establezca el color de fondo tableView para borrar el color de esta manera:

self.tableView.backgroundColor = [UIColor clearColor];

y luego establece el color de la supervista en blanco

self.tableView.superview.backgroundColor = [UIColor whiteColor];