Descarga de WaterfallGrid - Descargar el código fuente de WaterfallGrid

WaterfallGrid

Otro código fuente

1.1.0

Descargar

WaterfallGrid

Una vista de diseño de cuadrícula de cascada para Swiftui.

Características

Cuadrícula irregular de contenido.
Las columnas son diferentes por orientación del dispositivo.
Espaciado y relleno de cuadrícula personalizable.
Dirección de desplazamiento horizontal o vertical.
La actualización de elementos se puede animar.

Uso

Inicialización

Puede crear una cuadrícula que muestre los elementos de la recopilación pasando su recopilación de datos y un cierre que proporciona una vista para cada elemento de la colección. La cuadrícula transforma cada elemento en la colección en una vista infantil mediante el uso del cierre suministrado.

WaterfallGrid funciona con datos identificables (como Swiftui.List). Puede hacer que sus datos sean identificables de una de dos maneras: al pasar junto con sus datos una ruta clave a una propiedad que identifica de manera única cada elemento, o haciendo que su tipo de datos se ajuste al protocolo identificable.

Ejemplo 1

Una cuadrícula de vistas de Image de tipo de una colección de datos identificados por una ruta clave.

 WaterfallGrid ( ( 0 ..< 10 ) , id :  . self ) { index in
  Image ( " image ( index ) " )
    . resizable ( )
    . aspectRatio ( contentMode : . fit )
}

Ejemplo 2

Una cuadrícula de vistas de tipo RectangleView de una colección de datos Identifiable .

 WaterfallGrid ( rectangles ) { rectangle in
  RectangleView ( rectangle : rectangle )
}

O, para casos simples como este, solo:

 WaterfallGrid ( rectangles , content : RectangleView . init )

Estilo de cuadrícula

Para personalizar la apariencia de la cuadrícula, llame a la función gridStyle y pase los parámetros que desea personalizar.

Columnas

 WaterfallGrid ( cards ) { card in
  CardView ( card : card )
}
. gridStyle ( columns : 2 )

 WaterfallGrid ( cards , content : CardView . init )
. gridStyle (
  columnsInPortrait : 2 ,
  columnsInLandscape : 3
)

Espaciado y relleno

 WaterfallGrid ( rectangles , content : RectangleView . init )
. gridStyle ( spacing : 8 )
. padding ( EdgeInsets ( top : 16 , leading : 8 , bottom : 16 , trailing : 8 ) )

Animación

 WaterfallGrid ( rectangles , content : RectangleView . init )
. gridStyle ( animation : . easeInOut ( duration : 0.5 ) )

Comportamiento de desplazamiento

Incrustar en la opción de ScrollView e Indicadores

 ScrollView ( showsIndicators : true ) {
  WaterfallGrid ( rectangles , content : RectangleView . init )
}

Dirección de desplazamiento horizontal

 ScrollView ( . horizontal ) {
  WaterfallGrid ( rectangles , content : RectangleView . init )
  . scrollOptions ( direction : . horizontal )
}

Un ejemplo completo

 ScrollView ( . horizontal , showsIndicators : false ) {
  WaterfallGrid ( cards ) { card in
    CardView ( card : card )
  }
  . gridStyle (
    columnsInPortrait : 2 ,
    columnsInLandscape : 3 ,
    spacing : 8 ,
    animation : . easeInOut ( duration : 0.5 )
  )
  . scrollOptions ( direction : . horizontal )
  . padding ( EdgeInsets ( top : 16 , leading : 8 , bottom : 16 , trailing : 8 ) )
}

Aplicación de muestra

Explore la aplicación WaterfallGridSample para ver algunos ejemplos más detallados e interactivos.

Instalación

Administrador de paquetes Swift

Dependencia de la aplicación

Seleccione Archivo> PAQUETES SWIFT> Agregar dependencia del paquete e ingrese la URL del repositorio (agregando dependencias del paquete a su aplicación)

Dependencia del paquete

Agrégalo como una dependencia dentro de su Package.swift Swift Manifest:

dependencies: [
  . package ( url : " https://github.com/paololeonardi/WaterfallGrid.git " , from : " 1.1.0 " )
]

Cocoapods

Puede instalar WaterfallGrid a través de Cocoapods agregando la siguiente línea a su Podfile :

 pod 'WaterfallGrid' , '~> 1.1.0'

Ejecute el comando pod install para descargar la biblioteca e integrarla en su proyecto Xcode.

Guías de migración

Guía de migración de WaterfallGrid 1.0.0

Versiones

Para las versiones disponibles, consulte los lanzamientos en este repositorio.

Que contribuye

Las contribuciones son más que bienvenidas. Cree un problema de GitHub antes de enviar una solicitud de extracción para planificar y discutir la implementación.