python 自动生成图像_从图像目录自动生成图库：已更新

最新推荐文章于 2024-06-25 14:18:46 发布

culuo8053

最新推荐文章于 2024-06-25 14:18:46 发布

阅读量554

点赞数

文章标签： python php java html css

原文链接：https://davidwalsh.name/generate-photo-gallery

版权

python 自动生成图像

Two years ago Chris Coyier wrote an outstanding tutorial detailing how you can generate a photo gallery based on the images within two directories: a thumbnails directory and an originals directory. I've decided to take his tutorial a step further by showing you how to generate thumbnails for the gallery using PHP. I've also implemented a MooTools lightbox: Smoothbox. The following code will show you how to create a beautiful photo gallery by simply dumping your photos in a directory.

两年前，克里斯·科耶尔(Chris Coyier)撰写了一篇出色的教程，详细介绍了如何基于两个目录(缩略图目录和原始目录)中的图像生成照片库。我决定通过向您展示如何使用PHP为画廊生成缩略图来使他的教程更进一步。我还实现了MooTools灯箱： Smoothbox 。以下代码将向您展示如何通过简单地将照片转储到目录中来创建漂亮的照片库。

View Demo 观看演示

CSS (The CSS)


.clear			{ clear:both; }
.photo-link		{ padding:5px; margin:5px; border:1px solid #ccc; display:block; width:200px; float:left; }
.photo-link:hover	{ border-color:#999; }

The images/links will be floated next to each other. The other option would be to use a table. Booooo.

图像/链接将彼此相邻浮动。另一种选择是使用表格。 Booooo。

PHP：实用程序功能 (The PHP: Utility Functions )


/* function:  generates thumbnail */
function make_thumb($src,$dest,$desired_width) {
	/* read the source image */
	$source_image = imagecreatefromjpeg($src);
	$width = imagesx($source_image);
	$height = imagesy($source_image);
	/* find the "desired height" of this thumbnail, relative to the desired width  */
	$desired_height = floor($height*($desired_width/$width));
	/* create a new, "virtual" image */
	$virtual_image = imagecreatetruecolor($desired_width,$desired_height);
	/* copy source image at a resized size */
	imagecopyresized($virtual_image,$source_image,0,0,0,0,$desired_width,$desired_height,$width,$height);
	/* create the physical thumbnail image to its destination */
	imagejpeg($virtual_image,$dest);
}

/* function:  returns files from dir */
function get_files($images_dir,$exts = array('jpg')) {
	$files = array();
	if($handle = opendir($images_dir)) {
		while(false !== ($file = readdir($handle))) {
			$extension = strtolower(get_file_extension($file));
			if($extension && in_array($extension,$exts)) {
				$files[] = $file;
			}
		}
		closedir($handle);
	}
	return $files;
}

/* function:  returns a file's extension */
function get_file_extension($file_name) {
	return substr(strrchr($file_name,'.'),1);
}

We'll use three utility functions to make the system work: get_files (retrieves all of the files in a given directory), get_file_extension, and make_thumb (generates a thumbnail image from a source image). These are good functions to keep at hand for other purposes too.

我们将使用三个实用程序功能来使系统正常工作：get_files(检索给定目录中的所有文件)，get_file_extension和make_thumb(从源图像生成缩略图)。这些也是很好的功能，可用于其他目的。

PHP：设置和HTML生成 (The PHP: Setting and HTML Generation)


/** settings **/
$images_dir = 'preload-images/';
$thumbs_dir = 'preload-images-thumbs/';
$thumbs_width = 200;
$images_per_row = 3;

/** generate photo gallery **/
$image_files = get_files($images_dir);
if(count($image_files)) {
	$index = 0;
	foreach($image_files as $index=>$file) {
		$index++;
		$thumbnail_image = $thumbs_dir.$file;
		if(!file_exists($thumbnail_image)) {
			$extension = get_file_extension($thumbnail_image);
			if($extension) {
				make_thumb($images_dir.$file,$thumbnail_image,$thumbs_width);
			}
		}
		echo '<a href="',$images_dir.$file,'" class="photo-link smoothbox" rel="gallery"><img src="',$thumbnail_image,'" /></a>';
		if($index % $images_per_row == 0) { echo '<div class="clear"></div>'; }
	}
	echo '<div class="clear"></div>';
}
else {
	echo '<p>There are no images in this gallery.</p>';
}

The first step is to define a few simple settings which will dictate image paths, the width by which all thumbnails will be created, and the number of images per row. The action begins with rounding up all of the files. With every image in the gallery, we check to see if a thumbnail exists. If a thumbnail doesn't exist, we use PHP and the utility function above to generate one. When the thumbnail is generated (or there was one there in the first place), we output the HTML link/image. I've given the A element the "smoothbox" CSS class so that Smoothbox will make the larger image display in the lightbox.

第一步是定义一些简单的设置，这些设置将决定图像路径，创建所有缩略图的宽度以及每行图像的数量。该操作始于四舍五入所有文件。对于图库中的所有图像，我们检查是否存在缩略图。如果没有缩略图，我们将使用PHP和上面的实用程序函数来生成一个。生成缩略图时(或首先出现缩略图的地方)，我们输出HTML链接/图像。我为A元素指定了“ smoothbox” CSS类，以便Smoothbox可以在灯箱中显示更大的图像。