I am trying to make a storyboard program, but I am having trouble displaying the currect amount of windows per page.

my basic program looks like this
[] = button to open editor
[+] = add new button
[>] = next page
[<] = previous page


Frame
[] [] []
[] [] []
[+] [<] [>]

that is if all of your slots are filled for the first page (6 boards) if you only have 3 then it should look like this

Frame
[] []
[]
[+] [<] [>]

I got this far. my problem is limiting the buttons to 6 per page. Currently when you have 7 windows it looks like this

Frame
[] [] [] []
[] [] []
[+] [<] [>]

and you can keep adding on.

Here is my code

import javax.swing.*;
import java.awt.*;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
import java.util.*;

public class Frame implements ActionListener{

	JFrame frame = new JFrame("Storyboard");
	JPanel framePane = new JPanel(new GridLayout (2,3));
	Vector<BoardButton> boardButtons = new Vector<BoardButton> ();
	JPanel bottomPane = new JPanel (new BorderLayout());
	
	int currentpage = 0; // page number, can only change when there are more then multiples of 6
	int pages = 0;
	int boards = 0;
	JButton next, prev;
	
	public Frame (){
		frame.setDefaultCloseOperation (JFrame.EXIT_ON_CLOSE);
		frame.getContentPane ().setPreferredSize(new Dimension (600,400));
		frame.pack();
		frame.setLayout (new BorderLayout ());
		//bottom pane
		ImageIcon ico = new ImageIcon ("Images/add.png");
		JButton addButton = new JButton(ico);
		addButton.setActionCommand("AddBoard");
		addButton.addActionListener(this);
		next = new JButton (new ImageIcon ("Images/right_arrow.png"));
		next.setActionCommand("next");
		next.addActionListener(this);
		prev = new JButton (new ImageIcon ("Images/left_arrow.png"));
		prev.setActionCommand("prev");
		prev.addActionListener(this);
		JPanel newPanel = new JPanel ();
		newPanel.add(prev);
		newPanel.add(next);
		bottomPane.add(newPanel, BorderLayout.CENTER);
		bottomPane.add (addButton, BorderLayout.WEST);
		frame.add(bottomPane, BorderLayout.SOUTH);	
		frame.add(framePane);
		addBoardsToFrame();
		updateButtons();
		frame.setVisible(true);
	}
	
	public void addBoardsToFrame (){
		framePane.removeAll();
		if (boards != 0){
			for (int z = 0+(currentpage*6); z < (currentpage*6)+(currentpage*6-boardButtons.size()); z++){
				framePane.add(boardButtons.elementAt(z));
			}	
		}
		pages = (int)Math.floor(boards/6);
		updateButtons ();
		frame.validate();
		frame.repaint();
		System.out.println ("Should Display");
	}
	
	
	private void updateButtons() {
		// TODO Auto-generated method stub
		pages = (int)Math.floor(boards/6);
		if (pages > 0){
			next.setEnabled(true);
		}
		if (currentpage == pages){
			next.setEnabled (false);
		}
		if (currentpage == 0){
			prev.setEnabled(false);
		}
		else {
			prev.setEnabled(true);
		}
		System.out.println ("Current Page: " + currentpage + "\t Pages: " + pages);
		frame.validate();
		frame.repaint();
	}

	public void replaceButton (BoardButton boardB){
		frame.remove(framePane);
		frame.remove(bottomPane);
		frame.add (boardButtons.elementAt(boardButtons.indexOf(boardB)).b);
		frame.validate();
		frame.repaint();
	}
	public void addBoard(){
		System.out.println ("Adding board");
		boardButtons.add(new BoardButton(this));
		boards += 1;
		frame.validate();
		addBoardsToFrame();
	}
	
	
	public static void main (String [] args){
		Frame f = new Frame ();
	}
	public void backToButtons (BoardButton.Board board){
		frame.remove(board);
		frame.add(bottomPane,BorderLayout.SOUTH);
		frame.add (framePane);
		frame.repaint();
	}

	@Override
	public void actionPerformed(ActionEvent e) {
		// TODO Auto-generated method stub
		if (e.getActionCommand().equals("AddBoard")){
			addBoard();
		}
		if (e.getActionCommand().equals("next")){
			currentpage++;
		}
		if (e.getActionCommand().equals("prev")){
			currentpage --;
		}
		
		updateButtons ();
	}
	
}

I would like it that when you press next page it displays new buttons, because these will have pictures on them eventually.

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

public class BoardButton extends JButton implements ActionListener{

	Image clip;
	JButton del = new JButton("x");
	Board b = new Board();
	Frame f;
	BoardButton (Frame frame){
		del.addActionListener(this);
		del.setActionCommand("Del");
		addActionListener(this);
		f = frame;
		repaint();
	}
	
	public void paintComponent (Graphics g){
		g.setColor(Color.lightGray);
		g.fillRect(0, 0, 50, 50);
	}
	
	
	public void actionPerformed(ActionEvent e) {
		// TODO Auto-generated method stub
		if (e.getActionCommand().equals("Del")){
			
		}else {
		System.out.println ("Button Pressed");
		f.replaceButton(this);
		}
	}
	
	
	
	public class Board extends JPanel implements ActionListener{
		
		String hello = "Hello from Board inside BoardButton";
		JTextArea summaryArea = new JTextArea (5,50);
		String summary;
		JButton back = new JButton ("Back");
		
		Board (){
			back.addActionListener(this);
			setLayout (new BorderLayout ());
			add(new JScrollPane (summaryArea), BorderLayout.SOUTH);
			add(back, BorderLayout.EAST);
		}

		public void actionPerformed(ActionEvent e) {
			// TODO Auto-generated method stub
			f.backToButtons (this);
		}
	}

	
	
	
	
	
	
}

You have used a class name that is the same as a java SE class that can cause problems.
Frame is part of the AWT classes.

That is not the issue. Using Frame has not caused me any problems in the past.

My issue is that I cannot figure out how to only display 6 elements of the vector per page, and change them according to which page the user is on.

Can you explain what this program does when executed? When I start it there are three images at the bottom, one enabled on the left, two disabled to the right. Nothing else shows on the window.

What next?

If you click the + button it adds a new storyboard. this should appear on the screen. once you add 6 it should not display any more on that page, and a new page will be available. However if you put in more then 6 windows the next page becomes available, but it displays the all the storyboards on the same page. I would like it so that it only displays 6 per page, and I am having trouble with this. Also as you go through the pages the story boards shouldn't be the same. for example boards

1,2,3
4,5,6

are on page 1, then boards

7,8,9,
10,11,12

are on page 2,
so If the user types something into board 1, and then clicks on board 7 the text will not show up.

Which image is the + button? I have three images shown on the bottom.

Nothing happens when I press the left most image/button until I have pressed it 6 times then the right most image/button is enabled. Nothing shows on the rest of the window.

It must be my code that I am trying to add with.

This will show you what was happening

replace this

if (boards != 0){
for (int z = 0+(currentpage*6); z < (currentpage*6)+(currentpage*6-boardButtons.size()); z++){
framePane.add(boardButtons.elementAt(z));
}
}

with this

if (boards != 0){
for (int z = 0; z < boardButtons.size(); z++){
framePane.add(boardButtons.elementAt(z));
}
}

That should work.

Are you saying that the original code you posted does NOT show anything when it executes?

no. I was showing an attempt at restricting each page to 6 boards, which didn't work. the general idea should have been there at what I'm trying to do. I replaced it with code that displays all of the boards on one frame, so you can try to figure out something that works. I tried many things so far and none of them worked. If you have any suggestions it would be appreciated.

Is your problem to limit the number of items displayed on one window
and to move to a new window if there are more items to be displayed?
The CardLayout class would allow you to have multiple windows/components that are displayable one at a time. The displayed items on each component could be limited to how many you want.

how would I arrange the boards to go on different "cards" in the layout after 6 of them have been placed on the card before?

Edited 4 Years Ago by sirlink99: n/a

This question has already been answered. Start a new discussion instead.