GridLayoutで指定した配列と異なった。どうしてなのか？

Question

前提・実現したいこと

課題作成中に予想外の実行結果が出たので原因が知りたいです

発生している問題

プログラムソース内でGridLayout(3,6)と指定したはずなのに（4,6)になってしまった。コンパイルにはエラーがないのですが、実行ができなかったため、ソースファイル内のJpanel[]を増やしました。すると実行はできたのですが下の画像のようになりました。
完成理想図のようにしたいのですが、現状の問題点と改善案が欲しいです。

該当のソースコード

import java.awt.*;
import javax.swing.*;

class  kadai {
	public static void  main(String[] args){
		JFrame frame = new JFrame("kadai");
		frame.getContentPane().setPreferredSize(new Dimension(600,150));
		frame.pack();
		frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
		MyPanel panel = new MyPanel();
		frame.add(panel);
		frame.setVisible(true);
	}
}

class MyPanel extends JPanel {
	JButton[] btn;
	JPanel[] pnl;
	MyPanel(){
		setBackground(Color.lightGray);
		setLayout(new GridLayout(6,3));
		this.btn = new JButton[3];
		for (int i = 0; i < 3; i++){ 
			this.btn[i] = new JButton("ボタン"+(i+1)); 
		}
		this.pnl = new JPanel[18];
		for (int i = 0; i < 18; i++){
			this.pnl[i] = new JPanel();
			this.pnl[i].setOpaque(false);
		}
		int btnPtr = 0, pnlPtr = 0;
		for (int i = 0; i < 18; i++){
			if ( i == 0 ){ 
				add(this.btn[btnPtr]);
				btnPtr++;
			}
			if ( i == 12 ){ 
				add(this.btn[btnPtr]);
				btnPtr++;
			}
			if ( i == 17 ){ 
				add(this.btn[btnPtr]);
				btnPtr++;
			}
			else {
				add(this.pnl[pnlPtr]);
				pnlPtr++;
			}
		}
		
	}
}

コンパイル結果

完成理想図

Answer 1

			else if ( i == 12 ){ 
			else if ( i == 17 ){ 

このように else if にしないと、panel は i が 17 以外の時すべて、
すなわち 17枚貼り付けるので、3つのボタンと合わせて、20個の要素を add します。
グリッドの個数を超えてしまうので、6 x 3 を 6 x 4 に勝手に変更してしまうのでしょう。

次のように書けばいいでしょう。

class MyPanel extends JPanel {
    JButton[] btn;
    JPanel[] pnl;
    MyPanel(){
        setBackground(Color.lightGray);
        setLayout(new GridLayout(6, 3));
        this.btn = new JButton[3];
        this.pnl = new JPanel[15];
        int btnPtr = 0, pnlPtr = 0;
        for (int i = 0; i < 18; i++) {
            if (i == 0 || i == 10 || i == 17) {
            	this.btn[btnPtr] = new JButton("ボタン"+(btnPtr+1)); 
                add(this.btn[btnPtr++]);
			}
			else {
				this.pnl[pnlPtr] = new JPanel();
            	this.pnl[pnlPtr].setOpaque(false);
                add(this.pnl[pnlPtr++]);
			}
        }
    }
}

Comments

[june0327]

回答ありがとうございます。
具体的でより、理解が深まりました。初心者なのですごくわかりやすいです。
とても参考になりました。

Answer 2

https://docs.oracle.com/javase/jp/8/docs/api/java/awt/GridLayout.html

コンストラクタによって、またはsetRowsメソッドおよびsetColumnsメソッドによって、行数と列数のどちらもゼロ以外の値に設定されている場合、指定された列数は無視されます。代わりに、指定された行数およびレイアウトのコンポーネントの総数から、列数が決定されます。したがって、たとえば、3行と2列が指定されていて9つのコンポーネントをレイアウトに追加する場合、コンポーネントは3列の3行に表示されます。列数の指定がレイアウトに影響するのは、行数がゼロに設定された場合だけです。

とどのつまり、setLayout(new GridLayout(6, 3));と指定しても、6,3の数字は参考程度で、最終的にはいくつのコンポーネントを追加するかでレイアウトが決まる、と。

ということなので、次のロジックで何度add()メソッドが実行されるのかを考えてみるいい。
あなたの想定では18回かもしれませんが、本当にそうですか? わたしにはそれ以上に見えます。

        for (int i = 0; i < 18; i++){
            if ( i == 0 ){ 
                add(this.btn[btnPtr]);
                btnPtr++;
            }
            if ( i == 12 ){ 
                add(this.btn[btnPtr]);
                btnPtr++;
            }
            if ( i == 17 ){ 
                add(this.btn[btnPtr]);
                btnPtr++;
            }
            else {
                add(this.pnl[pnlPtr]);
                pnlPtr++;
            }
        }

Comments

[june0327]

解答いただきありがとうございます。
そもそもソースが完成理想を叶えられるようなソースではなく、また、このプログラムが実際にどういう仕組みなのか一つ一つ確認できていなかったです。java初心者で申し訳ないです。丁寧に解説してくださりありがとうございました。