Niezalogowany (Zaloguj się)

Kategorie

Vanilla 1.0.3 jest produktem Lussumo. Więcej informacji: Dokumentacja, Forum.

    • CommentAuthoradmirau
    • CommentTimeDec 27th 2006 zmieniony
     
    Złote majtki dla tego kto mi powie, jak zrobić taki patent:

    Mam tablicę, załóżmy, że to obrazki:
    <code lang="php">
    $tablica=array('obr01','obr02','obr03',...'obr27');
    </code>

    i chcę ją wyświetlić na stronie w X kolumnach,
    w postaci:
    <code>
    [obr01][obr02][obr03]
    [obr04][obr05][obr06]
    .....
    [obr25][obr26][obr27]
    </code>
    • CommentAuthortomek
    • CommentTimeDec 27th 2006 zmieniony
     
    Zacznij od utworzenia pliku przyklad.php, wszystko jest opisane w kometarzach:

    przyklad.php
    <code>
    <?php
    // konfiguracja PHPTAL
    require ('_include/phptal.inc.php');

    // tablica do wyświetlenia
    $tablica=array('obr01.jpg',
    'obr02.jpg',
    'obr03.jpg',
    'obr04.jpg',
    'obr05.jpg',
    'obr06.jpg',
    'obr07.jpg',
    'obr08.jpg',
    'obr09.jpg',
    'obr10.jpg',
    'obr11.jpg',
    'obr12.jpg',
    'obr13.jpg',
    'obr14.jpg',
    'obr15.jpg',
    'obr16.jpg',
    'obr17.jpg',
    );
    // nowy szablon
    $template = new PHPTAL('przyklad.html');
    // przypisanie tablicy do szblonu
    $template->tablica=$tablica;

    // wyświetlenie i obsługa błędów
    try {
    echo $template->execute();
    }
    catch (Exception $e){
    echo $e;
    }
    ?>
    </code>

    Teraz szablon:

    przyklad.html
    <code lang="xml">
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html>
    <head>
    <title>tytul</title>
    <style type="text/css">
    .lista {
    float: left;
    width: 60px;
    border: 1px solid #999;
    margin: 0 15px 15px 0;
    padding: 5px;
    }
    .break {
    clear: both;
    }
    </style>
    </head>
    <body>
    <span tal:omit-tag="" tal:repeat="obrazek tablica">
    <div class="lista" tal:content="obrazek"></div>
    <span tal:omit-tag="" tal:condition="php: !(repeat.obrazek.number % 5)">
    <br class="break" />
    </span>
    </span>

    </body>
    </html>
    </code>

    Zacznijmy od tal:repeat...czyli nic innego jak pętla przypisująca wartości z tablicy do zmiennej obrazek. Dalej wyświetlamy po kolei zawartość tablicy przy pomocy tal:content. tal:condition, tworzymy warunek (szukamy numerów elementów podzielnych przez 5) i dla nich dodajemy <br />.

    Teraz ważna sprawa, aby wyświetlić tablicę na stronie w X kolumnach. Tworzymy 2 klasy, dla wyświetlanych elementów tablicy i dla <br />.
    Teraz wszystko ładnie obrabiamy w CSS

    dla przypomnienia

    <code lang="css">
    <style type="text/css">
    .lista {
    float: left;
    width: 60px;
    border: 1px solid #999;
    margin: 0 15px 15px 0;
    padding: 5px;
    }
    .break {
    clear: both;
    }
    </style>
    </code>

    No i juz mamy galerię z prawdziwego zdarzenia :-)
    Pozdrawiam