Desarrollo web Programación con PHP Maquetación con HTML, CSS y JavaScript SEO on site y WPO Estándares recomendados por W3C Accesibilidad web Redacción de contenidos multilingües Fotografía

Galería dinámica con Lightbox y PHP (II)

Ver los efectos de la página Original Hover Effects me ha motivado para crear una demo similar (la suya es más guay) implementándola como Galería dinámica con lightbox y PHP.

No penséis que va a ser exactamente igual, ya que también me ha motivado a escribir un nuevo código PHP que facilite la implementación de la galería, esta vez utilizando un clase en PHP y no implementando el código en la propia página.

Bueno, lo primero es lo primero, aquí os dejo la demo Galería dinámica con lightbox y PHP (II) y, a continuación vamos a ver las partes del código más importantes, aunque más abajo pondré enlaces para descargar el ejemplo completo en PHP y en HTML.

PHP

Primero la clase con la que crear objetos para obtener las imágenes de un determinado directorio que pasaremos como parámetro.

class Galeria{
	// Propiedades de la clase
	private $array_imagenes = array();
	private $path = array();
	
	// constructor	
	public function __construct(){
		if (func_get_args()){
			$this->path = func_get_args();
		}
		$this->addimagen();
	}
	
	// completar $array_imagenes con las imágenes válidas	
	private function addimagen() {
		for ($i = 0; $i $lt; sizeof($this->path); $i++) {
			$mydir = opendir($this->path[$i]);
			while ($archivo = readdir($mydir)){
				if ($this->comprobarExtension($archivo)) {
					$this->array_imagenes[] = $this->path[$i].'/'.$archivo;
				}
			}
		}
	}
	
	// comprueba que coincidan las extensiones
	private function comprobarExtension($archivo){
		// extensiones válidas
		$arr_ext = array("jpg","png","gif");
		$ext = substr($archivo,-3);		
		if (in_array($ext,$arr_ext)) {
			return true;
		}
		return false;
	}
	
	// obtener el array con las imagenes 
	public function getImagenes(){
		return $this->array_imagenes;
	}
	
}

Ahora el fragmento de código más importante para incluir las imágenes en la página.

// incluir la clase
include_once 'lib/classGaleria.php';
// variables donde indicamos los path_directorio por ejemplo: "img/galeria"
// podemos incluir varios directorios con más variables y pasarlos como parámetro a la clase. Por ejemplo $elpath2="img/galeria2"  
$elpath1 = '[path_directorio]';
// creamos el objeto
$imagenes = new Galeria($elpath1); 
// podemos pasar varias variables con distintos path al crear el objeto. Por ejemplo: $imagenes = new Galeria($elpath1, $elpath2, $elpath3);
// recorrer el array de imágenes
foreach ($imagenes->getImagenes() as $archivo){
 
}

NOTA: PHP no permite la sobrecarga de constructores, por eso en el constructor de la clase se usa la función func_get_args() que en la documentación explica que obtiene un array con los argumentos. Si queréis obtener el número de argumentos pasados se usa la función func_num_args().

Hasta aquí todo bien ¿no?.

La verdad es que artículo se me está haciendo algo largo de explicar ya que tiene varios pasos a comentar, y viendo que es domingo y que no me apetece mucho escribir voy a dejar los enlaces para descargar las demos tal como he comentado más arriba. Galería dinámica en HTML y Galería dinámica en PHP.

Por lo demás si tenéis alguna duda podéis dejar algún comentario que intentaré responder en el menor tiempo posible. También podéis criticar e insultar.

Recordad que para ejecutar la versión en PHP debéis tener instalado un servidor para PHP (por ejemplo Apache) y ejecutarlo en él. Sino lo tenéis instalado os recomiendo descargar la versión en HTML, así por lo menos podréis "bichear" el código CSS y JS.

En adelante y si surgen dudas iré ampliando el artículo para solucionarlas o contestando a los comentarios (si los hay).

Por lo demás buen domingo y espero sea de ayuda a alguien.

ACTUALIZACIÓN:

Tras el comentario de Miguel dejo la modificación de la clase para obtener el nombre del fichero tal como indica en el comentario:

class Galeria{
	// Propiedades de la clase
	private $array_imagenes = array();
	private $path = array();
	private $name_imagenes = array();
	
	// constructor	
	public function __construct(){
		if (func_get_args()){
			$this->path = func_get_args();
		}
		$this->addimagen();
	}
	
	// completar $array_imagenes con las imágenes válidas	
	private function addimagen() {
		$con = 0;
		for ($i = 0; $i < sizeof($this->path); $i++) {
			$mydir = opendir($this->path[$i]);
			while ($archivo = readdir($mydir)){
				if ($this->comprobarExtension($archivo)) {
					$this->name_imagenes[$con] = substr($archivo, 0, -4);
					$this->array_imagenes[] = $this->path[$i].'/'.$archivo;
					$con++;
				}
			}
		}
	}
	
	// comprueba que coincidan las extensiones
	private function comprobarExtension($archivo){
		// extensiones válidas
		$arr_ext = array("jpg","png","gif");
		$ext = substr($archivo,-3);		
		if (in_array($ext,$arr_ext)) {
			return true;
		}
		return false;
	}
	
	// obtener el array con las imagenes 
	public function getImagenes(){
		return $this->array_imagenes;
	}
	
	// obtener el array con los nombres
	public function getNombre(){
		return $this->name_imagenes;		
	}
	
}

Es necesario modificar el código en el template donde queremos obtener las imágenes:

<?php
$i = 0;
$nombre = $imagenes->getNombre();
foreach ($imagenes->getImagenes() as $archivo):
?>
<img src="/blog/<?=$archivo?>" alt="Imagen" width="100" />
<h2><?=$nombre[$i];?></h2>
<?php
$i++;
endforeach;
?>

No está completo, ya que es un ejemplo de como obtenerlo.

T F G+

Escribir un comentario

¡Gracias por dejarnos tus comentarios! — por favor intenta mantener tu opinión relacionada con la anotación, no usar insultos, agresiones, o faltas de respeto al autor y otros participantes de la discusión, en caso de no hacerlo tu comentario podría ser borrado.
A excepción de la página web, el resto de datos solicitados son necesarios para incluir comentarios. El email no será mostrado en los comentarios. Tampoco será usado por parte del administrador para enviarle ninguna información ni será vendido a terceros para ningún tipo de uso.
Código de seguridad
Refescar

Algunos derechos reservados ©

Esta web utiliza cookies de terceros. Si sigue navegando entiendo que está de acuerdo con su uso: Más información Cerrar