php - 在 PHP 中创建两个等高的随机纵向和横向图像列-6ren

php - 在 PHP 中创建两个等高的随机纵向和横向图像列

转载作者：塔克拉玛干更新时间：2023-11-03 05:39:14

给定随机数量的纵向和横向图像，我正在尝试编写 PHP 代码来输出等高的两列:

通过将值“1”分配给横向图像并将值“2”分配给肖像，我的想法是将总图像($totalphotos)除以二，然后检查图像值($photoval)是否在遍历循环时超过该数字。
例如，如果您总共有 6 张图像，第一列已经有 2 张风景图像，而它遇到的第三张图像是肖像，它将重新排列数组 (array_splice) 并将肖像图像向下移动，然后继续到下一张图片。
如果输出已经创建了两个等高的列(比如第一列中有 3 个风景，第二列中有 1 个风景 + 1 个肖像，最后一张图像将被丢弃)

我不确定我的方法在循环期间尝试输出 html 是否正确，或者首先分析数组并重新排序图像然后创建第二个循环来输出 html 是否更有意义html.

我的代码有点脏，我的“array_splice”方法甚至可能不完全正确。如果您看到更好的方法，请随时废弃我的代码并向我展示更好的方法!非常感谢任何帮助!!

<?php

     $photoval = 0;
     $totalcolumns = 0;
     $totalphotos = count($photos);

     for ($counter = 0; $counter < $totalphotos; $counter++) :

            $photo = $photos[$counter];

            if ($photoval == 0) echo "        <div class=\"column\">\n";

            if ($photo['orientation'] == "portrait" && $photoval >= $totalphotos/2) {
            if ($counter == $totalphotos)
                    echo "        </div>\n";                
                    array_splice($photos, $counter, 1, array($photo));

                    continue;
            }
?>
     <div class="<? echo $photo['orientation'] ?> thumbnail">
          <a href="<?php echo $photo['link'] ?>">
               <img src="<?php if ($photo['orientation'] == "landscape") echo $photo['src']; else echo $photo['src_medium'];?>" alt="<? echo htmlentities($photo['caption'], ENT_QUOTES) ?>">
          </a>
     </div>
<?php
            if ($photoval >= $totalphotos/2 || $counter == $totalphotos) {
                echo "        </div>\n";
                $photoval = 0;
                $totalcolumns++;
                if ($totalcolumns == 2)
                    break;
            }

     endfor;
?>

最佳答案

这是我的解决方案:

<?php

/*
**  Simulated photo array for testing purposes, to be substituted with the real photo array
*/
$photos = array(
  array('orientation' => 'portrait' , 'link' => '#', 'src' => '', 'src_medium' => '', 'caption' => ''),
  array('orientation' => 'portrait' , 'link' => '#', 'src' => '', 'src_medium' => '', 'caption' => ''),
  array('orientation' => 'portrait' , 'link' => '#', 'src' => '', 'src_medium' => '', 'caption' => ''),
  array('orientation' => 'landscape', 'link' => '#', 'src' => '', 'src_medium' => '', 'caption' => ''),
  array('orientation' => 'landscape', 'link' => '#', 'src' => '', 'src_medium' => '', 'caption' => ''),
  array('orientation' => 'landscape', 'link' => '#', 'src' => '', 'src_medium' => '', 'caption' => ''),
  array('orientation' => 'landscape', 'link' => '#', 'src' => '', 'src_medium' => '', 'caption' => ''),
  array('orientation' => 'landscape', 'link' => '#', 'src' => '', 'src_medium' => '', 'caption' => ''),
  array('orientation' => 'landscape', 'link' => '#', 'src' => '', 'src_medium' => '', 'caption' => '')
);

$album = array(
  'portrait'  => array(),
  'landscape' => array()
);

foreach ($photos as $photo) {
  extract($photo);
  $album[$orientation][] = array(
    'orientation' => $orientation,
    'link'        => $link,
    'src'         => ($orientation == 'landscape') ? $src : $src_medium,
    'caption'     => htmlentities($caption, ENT_QUOTES)
  );
}

$columns = array(
  array(),
  array()
);

while (count($album['portrait']) >= 2) {
  if (count($album['landscape']) >= 2) {
    $columns[0][] = array_shift($album['portrait']);
    $columns[1][] = array_shift($album['landscape']);
    $columns[1][] = array_shift($album['landscape']);
  } else {
    $columns[0][] = array_shift($album['portrait']);
    $columns[1][] = array_shift($album['portrait']);
  }
}

while (count($album['landscape']) >= 2) {
  $columns[0][] = array_shift($album['landscape']);
  $columns[1][] = array_shift($album['landscape']);
}

?>
<!DOCTYPE html>
<html>
<head>
  <style>
  .column { width: auto; float: left; border: dashed 1px #666; padding: 10px }
  .column div:not(:last-child) { margin-bottom: 10px }
  .portrait { width: 200px; height: 200px; background-color: red; }
  .landscape { width: 200px; height: 95px; background-color: green; }
  </style>
</head>
<body>
  <?php foreach ($columns as $photos): ?>
  <div class="column">
    <?php foreach ($photos as $photo): ?>
    <div class="<?= $photo['orientation'] ?>">
      <!-- uncomment the following line when using the real photo array -->
      <!-- a href="<?= $photo['link'] ?>"><img src="<?= $photo['src'] ?>"> alt="<?= $photo['caption'] ?>"></a -->
    </div>
    <?php endforeach ?>
  </div>
  <?php endforeach ?>
</body>
</html>

* 更新 *

另一种解决方案:

<?php

/*
**  Create a random photo array
*/
$photos = array();
$totalphotos = rand(10, 30);
for ($i = 0; $i < $totalphotos; $i++) {
    $o = (rand(0, 1) == 1) ? 'portrait' : 'landscape';
    $photos[] = array('orientation' => $o, 'link' => '#', 'src' => '', 'src_medium' => '', 'caption' => '');
}

//----------------------------------
//--- Here starts the real stuff ---
//----------------------------------

/*
**  The "last" array contains the index of the last added
**  portrait and landscape image in each column of the
**  "album" array
*/
$last = array(
    'portrait' => array(0, 0), 
    'landscape' => array(0, 0)
);

/*
**  Add each photo to the lowest height column
*/
$album = array();
$len  = array(0, 0);
for ($i = 0; $i < $totalphotos; $i++) {
    $o = $photos[$i]['orientation'];
    $c = ($len[0] < $len[1]) ? 0 : 1;
    $len[$c] += ($o == 'portrait') ? 2 : 1;
    $album[$c][] = $i;
    $last[$o][$c] = count($album[$c]) - 1;
}

/*
**  If the columns heights are different,
**  remove the last portrait or landscape image
**  from the highest column
*/
$c = ($len[0] > $len[1]) ? 0 : 1;
$diff = abs($len[0] - $len[1]);
//echo "<pre>diff={$diff}</pre>\n";
if ($diff == 1) {
    unset($album[$c][$last['landscape'][$c]]);
} else if ($diff == 2) {
    unset($album[$c][$last['portrait'][$c]]);
}

?>
<!DOCTYPE html>
<html>
    <head>
        <style>
        .column { border: dashed 1px #666; width: 50px; padding: 0 10px 10px 10px; overflow: auto; float: left; }        
        .column div { margin: 10px 5px 0 0; }
        .portrait { width: 50px; height: 100px; background-color: red; }
        .landscape { width: 50px; height: 45px; background-color: green; }
        </style>
    </head>
    <body>
        <?php for ($c = 0; $c < 2; $c++) { ?>
        <div class="column">
            <?php foreach ($album[$c] as $p): ?>
            <div class="<?= $photos[$p]['orientation'] ?> thumbnail">
                <!--a href="<?= $photos[$p]['link'] ?>"><img src="<?= $photos[$p]['src'] ?>" alt="<?= $photos[$p]['caption'] ?>"></a-->
            </div>
            <?php endforeach ?>
        </div>
        <?php } ?>
    </body>
</html>

关于php - 在 PHP 中创建两个等高的随机纵向和横向图像列，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/12958367/

文章推荐： php - Doctrine+MongoDB - 如何查询数组不为空的文档

文章推荐： php - Symfony 2 中实体管理器和 phpunit 的问题

文章推荐： php - PHP 文件中的 Symfony2 数据库配置

文章推荐： php - 具有本地 SVN 存储库的 Composer

Python 随机随机
我让随机数低于之前的随机数。 if Airplane==1: while icounter0: print "You have enoph fuel to get to New
随机 BigFloats Julia
是否可以生成 BigFloat 的随机数？类型均匀分布在区间 [0,1)? 我的意思是，因为 rand(BigFloat)不可用，看来我们必须使用 BigFloat(rand())为了那个结局。然而，
random - 无法创建抽象类的实例(随机)
我正在尝试学习 Kotlin，所以我正在学习互联网上的教程，其中讲师编写了一个与他们配合良好的代码，但它给我带来了错误。这是错误 Error:(26, 17) Kotlin: Cannot crea
java - 随机/随机比较器
是否有任何方法可以模拟 Collections.shuffle 的行为，而不使比较器容易受到排序算法实现的影响，从而保证结果的安全？我的意思是不违反类似的契约(Contract)等.. 最佳答案在
Lua:随机:百分比
我正在创建一个游戏，目前必须处理一些math.random问题。我的Lua能力不是那么强，你觉得怎么样您能制定一个使用 math.random 和给定百分比的算法吗？我的意思是这样的函数: fu
java - 如何在JavaFX场景中定位按钮？ (随机)
我想以某种方式让按钮在按下按钮时随机改变位置。我有一个想法如何解决这个问题，其中一个我在下面突出显示，但我已经认为这不是我需要的。 import javafx.application.Applicat
java - 随机#猜谜游戏无限循环
对于我的 Java 类(class)，我应该制作一个随机猜数字游戏。我一直陷入过去几天创建的循环中。程序的输出总是无限循环，我不明白为什么。非常感谢任何帮助。 /* This program wi
java - 随机(？)ElementNotVisibleException
我已经查看了涉及该主题的一些其他问题，但我没有在任何地方看到这个特定问题。我有一个点击 Web 元素的测试。我尝试通过 ID 和 XPath 引用它，并使用 wait.until() 等待它变得可见。
c# - 随机 InvalidCastException
我在具有自定义类的字典和列表中遇到了该异常。示例: List dsa = (List)Session["Display"]; 当我使用 Session 时，转换工作了 10-20 次..然后它开始抛
javascript - 数字游戏 - 随机
需要帮助以了解如何执行以下操作: 每隔 2 秒，这两个数字将生成包含从 1 到 3 的整数值的随机数。按下“匹配”按钮后，如果两个数字相同，则绿色标签上的数字增加 1。按下“匹配”按钮后，如果两个
C 随机，有问题
void getS(char *fileName){ FILE *src; if((src = fopen(fileName, "r")) == NULL){ prin
PHP MySQL 随机
如果我有 2 个具有以下字段的 MySQL 数据库... RequestDB: - Username - Category DisplayDB: - Username - Category
postgresql 随机()错误？
我有以下语句 select random() * 999 + 111 from generate_series(1,10) 结果是: 690,046183290426 983,732229881454
php - 随机标签不会消失
我有一个使用 3x4 CSS 网格构建的简单网站。但出于某种原因，当我在 chrome“检查”中检查页面时，有一个奇怪的空白显然不在我的代码中的标签。它会导致网站上出现额外的一行，从而导致出现
javascript动画后不透明度有时会(随机)改变
我有两个动画，一个是“过渡”，它在悬停时缩小图像，另一个是 animation2，其中图像的不透明度以周期性间隔重复变化。我有 animation2 在图像上进行，当我将鼠标悬停在它上面时，anim
c++ - 解释这个c++随机
如图所示post在 C++ 中有几种生成随机 float 的方法。但是我不完全理解答案的第三个选项: float r3 = LO + static_cast (rand()) /( static_c
javascript - 随机.addClass到多个div而不重复
我正在尝试将类添加到具有相同类的三个 div，但我不希望任何被添加的类重复。我有一个脚本可以将一个类添加到同时显示的 1、2 或 3 个 div。期望的效果是将图像显示为背景图像，并且在我的样式表中
python - 嵌套列表中的唯一值 - 随机
我有一个基本上可以工作的程序，它创建由用户设置的大小的嵌套列表，并根据用户输入重复。但是，我希望各个集合仅包含唯一值，目前这是我的输出。 > python3 testv.py Size of you
C# 随机(长)
我正在尝试基于 C# 中的种子生成一个数字。唯一的问题是种子太大而不能成为 int32。有什么方法可以像种子一样使用 long 吗？是的，种子必须很长。最佳答案这是我移植的 Java.Util.
c - 随机 float
我写这个函数是为了得到一个介于 0 .. 1 之间的伪随机 float : float randomFloat() { float r = (float)rand()/(float)RAN

塔克拉玛干

个人简介

我是一名优秀的程序员,十分优秀！

作者热门文章

滴滴打车优惠券免费领取

全站热门文章

首页

博学

6Ren·AI

商城

php - 在 PHP 中创建两个等高的随机纵向和横向图像列