Latihan Kode Program PHP: Membuat Pola Diamond Bintang

Latihan algoritma kode program PHP kali ini akan membahas cara membuat pola diamond bintang. Pola ini kadang disebut juga sebagai belah ketupat bintang atau pola permata.

Materi ini melatih logika program, terutama pemahaman terkait konsep perulangan bersarang (nested loop).


Soal Membuat Pola Diamond Bintang

Buatlah kode program dalam bahasa PHP untuk menampilkan pola gambar diamond dalam bentuk kumpulan karakter bintang (karakter *). Sebagai bonus, buat juga sebuah form untuk menginput tinggi diamond.

Berikut contoh tampilan akhir yang diinginkan (1) :

Kode Program PHP - Diamond Bintang (5)

     *
    * *
   * * *
  * * * *
 * * * * *
  * * * *
   * * *
    * *
     *

Berikut contoh tampilan akhir yang diinginkan (2) :

Kode Program PHP - Diamond Bintang (9)

       *
      * *
     * * *
    * * * *
   * * * * *
  * * * * * *
 * * * * * * *
  * * * * * *
   * * * * *
    * * * *
     * * *
      * *
       *

Tips Membuat Kode Program Diamond Bintang

Soal ini melatih pemahaman terkait perulangan bersarang (nested loop). Berikut tutorial pendahuluan yang bisa di ikuti:

Pada dasarnya pola diamond bintang adalah gabungan dari pola piramida bintang dan pola piramida bintang terbalik dalam satu program.

Artinya kita butuh 6 perulangan for untuk membuatnya. Karena itu pemahaman tentang cara membuat piramida bintang sangat diperlukan.


Kode Program PHP Pola Diamond Bintang

Berikut salah satu konsep dasar cara membuat pola diamond bintang menggunakan bahasa pemrograman PHP:

<?php
  echo "<p>Kode Program PHP - Diamond Bintang (9)</p>";
  echo "<pre>";

  $lebar_diamond = 7;

  for($i = 1; $i <= $lebar_diamond; $i++) {
    for($j = 1; $j <= $lebar_diamond - $i; $j++) {
      echo " ";
    }
    for($k = 1; $k <= $i; $k++) {
      echo " *";
    }
    echo "<br>";
  }

  for($i = 1; $i < $lebar_diamond; $i++) {
    for($j = 1; $j <= $i; $j++) {
      echo " ";
    }
    for($k = 1; $k <= $lebar_diamond - $i; $k++) {
      echo " *";
    }
    echo "<br>";
  }

  echo "</pre>";
?>

Hasil kode program:

Latihan Kode Program PHP - Membuat Pola Diamond Bintang

Kode program diawali dengan perintah echo untuk menampilkan tag <h1> yang berisi judul program, serta tag <pre> agar hasil diamond bintang terlihat lebih rapi.

Di baris 5, variabel $lebar_diamond di isi angka 7. Variabel inilah yang akan menentukan tinggi dan lebar diamond.

Proses menampilkan karakter bintang dilakukan oleh 6 perulangan for antara baris 7-25. Seperti yang dijelaskan dalam bagian tips, kode program ini merupakan gabungan dari kode untuk piramida bintang dan piramida bintang terbalik.

Tiga perulangan for pertama antara baris 7-15 dipakai untuk membuat sisi atas diamond. Sedangkan tiga perulangan for berikutnya antara baris 17-25 dipakai untuk membuat sisi bawah diamond.

Perulangan luar pertama dimulai dari $i = 1 sampai i <= $lebar_diamond. Sedangkan perulangan luar kedua dimulai dari $i = 1 sampai i < $lebar_diamond. Sedikit perbedaan dari penggunaan tanda <= dan < adalah agar alas piramida atas tidak berhimpit dengan alas piramida bawah. Dalam setiap perulangan $i, jalankan perulangan $j dan $k untuk membuat pola piramida dan piramida terbalik.


Membuat Pola Diamond Bintang dengan Inputan Form

Jika ingin membuat kode program PHP yang bisa menerima nilai input dari user, maka butuh sebuah form HTML. Bahasan tentang cara memproses form lumayan panjang, jika butuh materi dasar bisa lanjut ke tutorial cara memproses form HTML dengan PHP.

Berikut kode program membuat pola diamond bintang dengan perpaduan kode HTML, CSS dan PHP:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Latihan Soal Algoritma Bahasa PHP</title>
  <style>
    body  { text-align: center; font-family: "Trebuchet MS", serif; }
    h1,h2 { margin-bottom: 0; }
    hr    { width: 80%; }
    form  { margin-top: 2rem; }
    pre   { margin-top: 1.4rem; text-align: left; }
    .result {
      margin: 1rem auto; 
      padding: 0.25rem 0.25rem 1rem 0.25rem;
      background-color: ghostwhite;
      width: 50%;
      display: flex;
      flex-direction: column;
      align-items: center;
    }
  </style>
</head>
<body>
  <h1>Kode Program PHP - Diamond Bintang</h1>
  <hr>
  <form action="" method="post">
    <div>
      Lebar Diamond: <input type="text" name="lebar_diamond" size="1">
      <input type="submit" name="submit">
    </div>
  </form>
  
    <?php
      if (isset($_POST['submit'])) {
        $lebar_diamond = $_POST['lebar_diamond'];

        echo "<div class='result'>";
        echo "<h2>Hasil Kode Program</h2>";
        echo "<span>(tinggi diamond: $lebar_diamond)</span>";
        echo "<pre>";

        for($i = 1; $i <= $lebar_diamond; $i++) {
          for($j = 1; $j <= $lebar_diamond - $i; $j++) {
            echo " ";
          }
          for($k = 1; $k <= $i; $k++) {
            echo " *";
          }
          echo "<br>";
        }
      
        for($i = 1; $i < $lebar_diamond; $i++) {
          for($j = 1; $j <= $i; $j++) {
            echo " ";
          }
          for($k = 1; $k <= $lebar_diamond - $i; $k++) {
            echo " *";
          }
          echo "<br>";
        }
      
        echo "</pre>";
        echo "</div>";
      }
    ?>
  
</body>
</html>

Latihan Kode Program PHP - Membuat Pola Diamond Bintang dengan Form

Selain struktur dasar HTML, pada script ini juga terdapat kode CSS di dalam tag <style> untuk mempercantik tampilan halaman (baris 7-22).

Kode untuk membuat form HTML ada di baris 27-32. Di dalamnya terdapat tag <input> untuk menampung nilai input lebar_diamond, serta tag <input type="submit" name="submit"> untuk membuat tombol "Submit".

Kode PHP sendiri ada di baris 34-55. Kondisi if(isset($_POST['submit'])) berguna untuk memeriksa apakah form sudah di submit atau belum. Hanya jika kondisi ini terpenuhi, barulah kode PHP lain akan di proses.

Agar lebih praktis, nilai form yang tersimpan di global variable $_POST['lebar_diamond'] dipindahkan ke variabel $lebar_diamond pada baris 36.

Perintah echo antara baris 38-41 berguna untuk membuat struktur HTML sebagai tempat dari diamond bintang kita. Setelah itu baru masuk ke perulangan for yang akan menampilkan pola diamond bintang seperti bahasan sebelumnya.


Itulah tutorial singkat membahas cara membuat pola diamond bintang menggunakan bahasa PHP, semoga bisa bermanfaat.

Add Comment