Membuat Segitiga, Persegi dan Motif dengan PHP For Loop

Pada artikel sebelumnya telah kita bahas tentang for loop pada PHP, pada kesempatan kali ini kita akan sedikit berkreasi dengan membuat motif bidang dengan for loop tersebut, kita akan membuat agar motif tersebut tampak seperti ubin yang tertata rapi. Kode yang digunakan di artikel ini hanya salah satu contoh saja banyak kode lain yang dapat menghasilkan output yang sama, sebagaimana istilah “Seribu jalan ke Roma”.

1. Pertama

Pertama kali mari kita buat persegi dengan motif bersilang, kode yang kita perlukan:

<?php
/** 
	$num_char merupakan jumlah karakter vertikal dan horizontal
	untuk kerapian isikan nilai ganjil misal 27 atau 31 
*/
$num_char 	 = 29; 
// onehalf_var nantinya nilainya bisa bertambah / berkurang, sedangkan half tetap
$onehalf 	 = floor($num_char / 2);
$onehalf_var = $onehalf;
$char1 		 = '-';
$char2 		 = '*';

echo '<div style="font:bold 16px courier new; line-height:10px">';
// loop baris
for ($row = 1; $row <= $num_char; $row++)
{
	// loop kolom
	for ($col = 1; $col <= $num_char; $col++)
	{
		$char =	$col > $onehalf_var && $col <= ($num_char - $onehalf_var) ? $char2 : $char1;
		echo $char;	
	}
	$row <= $onehalf ? $onehalf_var-- : $onehalf_var++;	
	echo '<br/>';
}
echo '</div>';
?>

output yang dihasilkan adalah:

Penjelasan kode:
Pada kode tersebut diatas, loop kolom ($col) yang menentukan bentuk  karakter *, jika ada diposisi tengah cetak * dengan jumlah karakter sesuai dengan urutan barisnya, misal pada baris ketiga, jika kolom > 11 ($col > $onehalf_var) maka cetak * dan jika kolom <= 17 ($col <= ($num_char - $onehalf_var)) juga cetak * .

$onehalf_var menentukan jumlah  karakter * perbarisnya, untuk baris pertama $onehalf_var bernilai 13 (setengan dari jumlah karakter – pembulatan kebawah –  floor($num_char / 2)), baris kedua 12 dan seterusnya hingga bernilai 0 pada baris 14, selanjutnya bernilai 1 mulai baris 15 dan seterusnya hingga kembali bernilai 13 pada baris terakhir ($row <= $onehalf ? $onehalf_var-- : $onehalf_var++)

2. Kedua

Selanjutnya kita buat motif lebih bervariasi, yaitu dengan membuat keempat sisi bujursangkar bermotif beda dan membuat sebuah  bujursangkar  kecil di tengah  dengan warna yang lebih cerah, kode yang diperlukan sama dengan sebelumnya dengan beberapa penambahan:

<?php
/** 
	$num_char merupakan jumlah karakter vertikal dan horizontal
	untuk kerapian, karena motifnya agak banyak, isikan nilai dengan menambahkan atau mengurangi
	kelipatan 4, misal 25 atau 33
*/
$num_char 	= 29;
$onehalf	= floor($num_char / 2);
$onehalf_var 	= $onehalf;
$onequarter 	= floor($num_char / 4);
$threequarters	= ceil($num_char * 3/4);
$char1 		= '-';
$char2 		= '*';

echo '<div style="font:bold 16px courier new; line-height:10px">';
for ($row = 1; $row <= $num_char; $row++)
{
	for ($col = 1; $col <= $num_char; $col++)
	{
		// Sama seperti kode sebelumnya
		$char =	$col > $onehalf_var && $col <= ($num_char-$onehalf_var) ? $char2 : $char1;
		
		// Menambahakan bujursangkar di tengah
		if ( 
			$col > $onequarter  
			&& $col <= $threequarters 
			&& $row > $onequarter 
			&& $row <= $threequarters 
		)
		{
			$char = '<span style="color:#CCC">'.$char.'</span>';
		}
		
		// Mengganti karakter dan warna keempat sisi bujursangkar 
		if (
			($col <= $onequarter && $row <= $onequarter)
			|| ($col > $threequarters && $row <= $onequarter)
			|| ($row > $threequarters && $col <= $onequarter)
			|| ($col > $threequarters && $row > $threequarters)
		)
		{
			$char = '<span style="color:#CCC">'.$char2.'</span>';
		}
			
		echo $char;	
	}
	
	// Sama seperti kode sebelumnya
	$row <= $onehalf ? $onehalf_var-- : $onehalf_var++;	
	echo '<br/>';
}
echo '</div>';
?>

output yang dihasilkan:

Penjelasan kode:

Kode diatas sama dengan kode sebelumnya hanya ada 2 penambahan yaitu bujursangkar yang ada ditengah yang dapat dianalogikan seperti  margin, margin kiri ($col > $onequarter), margin kanan ($col <= $threequarters), margin atas ($row > $onequarter) dan margin bawah ($row <= $threequarters), jika nilainya didalam margin maka buat karakter berbeda, sehingga membentuk bujursangkar baru

sedangkan untuk bujursangkar yang ada di pojok kiri atas menggunakan kode ($col <= $onequarter && $row <= $onequarter), pojok kanan atas ($col > $threequarters && $row <= $onequarter), pojok kiri bawah ($row > $threequarters && $col <= $onequarter) dan pojok kanan bawah ($col > $threequarters && $row > $threequarters)

3. Ketiga

Terakhir dengan menambahkan loop satu kali lagi, kita gabungkan beberapa persegi yang telah kita buat, sehingga berbentuk seperti pola ubin, jika sebelumnya untuk karakter1 kita menggunakan dash (-), maka untuk yang terakhir ini kita gunakan spasi kosong (&nbsp) agar hasilnya tampak lebih bersih, kode yang kita gunakan:

<?php
$patterns 		= 9;
$patterns_col 		= 3;
$cont_width 		= 279 * $patterns_col;
$num_char		= 29;
$char1			= '&nbsp;';
$char2			= '*';
$onehalf 		= floor($num_char / 2);
$onehalf_var		= $onehalf;
$onefourth		= floor($num_char / 4);
$threequarters		= ceil($num_char * 3/4);

echo '<div style="width:'.$cont_width.'px">';
for ($i = 1; $i <= $patterns; $i++)
{
	$onehalf_var 		= $onehalf;
	echo '<div style="float:left;font:bold 16px courier new; line-height:10px">';
	for ($row = 1; $row <= $num_char; $row++)
	{
		for ($col = 1; $col <= $num_char; $col++)
		{
			$char =	$col > $onehalf_var && $col <= ($num_char - $onehalf_var) ? $char2 : $char1;
			
			if ( 
				$col > $onefourth 
				&& $col <= $threequarters 
				&& $row > $onefourth 
				&& $row <= $threequarters
			)
			{
				$char = '<span style="color:#CCC">'.$char.'</span>';
			}
		
			if (
				($col <= $onefourth && $row <= $onefourth)
				|| ($col > $threequarters && $row <= $onefourth)
				|| ($row > $threequarters && $col <= $onefourth)
				|| ($col > $threequarters && $row > $threequarters)
			)
			{
				$char = '<span style="color:#A0A0A0;">'.$char2.'</span>';
			}
				
			echo $char;	
		}
		$row <= $onehalf ? $onehalf_var-- : $onehalf_var++;	
		echo '<br/>';
	}
	echo '</div>';
}
echo '</div>';
?>

hasilnya akan tampak seperti gambar berikut:

Penjelasan kode:

Kode diatas sama dengan kode sebelumnya, hanya ditambahkan loop untuk memperbanyak segiempat yang telah kita buat sebelumnya.

Demikian tutorial membuat segitiga, persegi, motif dengan PHP, semoga bermanfaat dan selamat mencoba.