Making a prettier GUI
by mtgrares
Moderators: timmermac, Blacksmith, KrazyTheFox, Agetian, friarsol, CCGHQ Admins
Re: Making a prettier GUI
by slapshot5 » 07 Jan 2011, 17:19
I like the green felt background. I thought about adding something like this myself several months back. And I like the current dividers in the game area, though they could probably be a bit narrower.
-slapshot5
-slapshot5
- slapshot5
- Programmer
- Posts: 1391
- Joined: 03 Jan 2010, 17:47
- Location: Mac OS X
- Has thanked: 25 times
- Been thanked: 68 times
Re: Making a prettier GUI
by Chris H. » 09 Jan 2011, 21:05
I was able to merge Choppic's newest Gui_DeckEditor.java file into our SVN. I changed the deck editor images path to "res/images/deckeditor/". I also merged Choppic's newest set of deck editor icons.
-
Chris H. - Forge Moderator
- Posts: 6320
- Joined: 04 Nov 2008, 12:11
- Location: Mac OS X Yosemite
- Has thanked: 644 times
- Been thanked: 643 times
Re: Making a prettier GUI
by Chris H. » 10 Jan 2011, 02:20
I made some edits to Gui_DeckEditor. Everything should be visible in the deck editor. The card detail panel and the picture panel can now be seen in it's entirety even when the monitor res is set to 1024 x 768.
I had to remove the filter by name filter to make everything fit. There is a filter pull down menu which includes a filter by name option so we do not lose this feature. I also had to reduce the point size for the text with the card totals.
When the Deck Editor widow is at a small size I have noticed that the card detail panel can increase and decrease in height as I highlight different cards in the table. I may not be able to figure out how to prvent this from happening. Overall, the deck editor is looking very good.
Thank you for your help Choppic.
`
I had to remove the filter by name filter to make everything fit. There is a filter pull down menu which includes a filter by name option so we do not lose this feature. I also had to reduce the point size for the text with the card totals.
When the Deck Editor widow is at a small size I have noticed that the card detail panel can increase and decrease in height as I highlight different cards in the table. I may not be able to figure out how to prvent this from happening. Overall, the deck editor is looking very good.
Thank you for your help Choppic.

`
-
Chris H. - Forge Moderator
- Posts: 6320
- Joined: 04 Nov 2008, 12:11
- Location: Mac OS X Yosemite
- Has thanked: 644 times
- Been thanked: 643 times
Re: Making a prettier GUI
by choppic » 10 Jan 2011, 05:14
Chris, this is the two icons missing from the previous zip fileChris H. wrote:The Icon_fix.zip archive is missing the two white filters

About our mana source, am I right to say that if we want to move the Mana Pool to the player panel we will need a label to show W, U, R, B, G, C, Snow-W, Snow-U, Snow-R, Snow-B, Snow-G, and Snow-C?
- Attachments
-
filter_white.zip
- White filter icons
- (7.33 KiB) Downloaded 315 times
-
choppic - Posts: 48
- Joined: 17 Dec 2010, 07:56
- Location: East Java, Indonesia
- Has thanked: 0 time
- Been thanked: 0 time
Re: Making a prettier GUI
by Chris H. » 10 Jan 2011, 19:01
Moving the mana pool from the battlefield to the player panel could be a good thing, although it may be tricky. Moving the mana pool would hopefully give us more room for permanents. And some people are not using a large screen monitor.
I believe that the current player panel uses a five region BorderLayout. At one point during Dennis' Fantasy quest mode development I spent a few weeks looking at this code. I made a couple of minor adjustments. I moved the opponent picture from the center region to the east region above the life total. To be honest, I was in over my head.
I think that using a row by column grid type of layout might make better use of the space. I guess that we might be able to have a column of six buttons with each button being set to one of the six mana colors. And place a text string inside the buttons displaying the amount of mana for that particular mana color?
Activating a mana source would increase the number displayed in the appropriately colored button. Clicking on the button would reduce the number displayed while paying that portion of the mana cost.
My knowledge of java and the layout managers is fairly minimal. I do not know if what I envision is possible or not. I guess that at this time we are at a point where we try to do a mock up or two. And any input from other people would be appreciated.
I will attach a template below. I set my monitor to 1024 x 768 and took a screen shot of the player panel. I deleted the contents from the panel. Anyone interested can use this as a template for their ideas. I assume that this would be the smallest size set for the player panel and that the items placed within would resize as the size of the battlefield window increases.
`
I believe that the current player panel uses a five region BorderLayout. At one point during Dennis' Fantasy quest mode development I spent a few weeks looking at this code. I made a couple of minor adjustments. I moved the opponent picture from the center region to the east region above the life total. To be honest, I was in over my head.

I think that using a row by column grid type of layout might make better use of the space. I guess that we might be able to have a column of six buttons with each button being set to one of the six mana colors. And place a text string inside the buttons displaying the amount of mana for that particular mana color?
Activating a mana source would increase the number displayed in the appropriately colored button. Clicking on the button would reduce the number displayed while paying that portion of the mana cost.
My knowledge of java and the layout managers is fairly minimal. I do not know if what I envision is possible or not. I guess that at this time we are at a point where we try to do a mock up or two. And any input from other people would be appreciated.

I will attach a template below. I set my monitor to 1024 x 768 and took a screen shot of the player panel. I deleted the contents from the panel. Anyone interested can use this as a template for their ideas. I assume that this would be the smallest size set for the player panel and that the items placed within would resize as the size of the battlefield window increases.
`
- Attachments
-
- Player panel template at 1024 x 768.jpg (11.14 KiB) Viewed 4062 times
-
Chris H. - Forge Moderator
- Posts: 6320
- Joined: 04 Nov 2008, 12:11
- Location: Mac OS X Yosemite
- Has thanked: 644 times
- Been thanked: 643 times
Re: Making a prettier GUI
by Chris H. » 11 Jan 2011, 01:50
We are getting close to the next beta release. I made another adjustment to the deck editor. Do people like this one best?
I think that this version makes better use of the limited space when displayed at 1024 x 768.
`
I think that this version makes better use of the limited space when displayed at 1024 x 768.
`
-
Chris H. - Forge Moderator
- Posts: 6320
- Joined: 04 Nov 2008, 12:11
- Location: Mac OS X Yosemite
- Has thanked: 644 times
- Been thanked: 643 times
Re: Making a prettier GUI
by slapshot5 » 11 Jan 2011, 03:55
I like the buttons better at the top. It's more intuitive to have the filter buttons at the top since they affect only the top list.Chris H. wrote:We are getting close to the next beta release. I made another adjustment to the deck editor. Do people like this one best?
I think that this version makes better use of the limited space when displayed at 1024 x 768.
`
-slapshot5
- slapshot5
- Programmer
- Posts: 1391
- Joined: 03 Jan 2010, 17:47
- Location: Mac OS X
- Has thanked: 25 times
- Been thanked: 68 times
Re: Making a prettier GUI
by Hellfish » 11 Jan 2011, 04:16
I agree with slapshot, but am also a bit sad that the filter textbox doesn't seem to fit. :/
So now you're
Screaming for the blood of the cookie monster
Evil puppet demon of obesity
Time to change the tune of his fearful ballad
C is for "Lettuce," that's good enough for me
Screaming for the blood of the cookie monster
Evil puppet demon of obesity
Time to change the tune of his fearful ballad
C is for "Lettuce," that's good enough for me
-
Hellfish - Programmer
- Posts: 1297
- Joined: 07 Jun 2009, 10:41
- Location: South of the Pumphouse
- Has thanked: 110 times
- Been thanked: 169 times
Re: Making a prettier GUI
by choppic » 11 Jan 2011, 05:06
Should we reduce the size of the filter icons?
We're using 32x32 pixels right now. Is it possible to keep the textbox if we use 24x24 pixels?
We're using 32x32 pixels right now. Is it possible to keep the textbox if we use 24x24 pixels?
-
choppic - Posts: 48
- Joined: 17 Dec 2010, 07:56
- Location: East Java, Indonesia
- Has thanked: 0 time
- Been thanked: 0 time
Re: Making a prettier GUI
by Chris H. » 11 Jan 2011, 13:57
`slapshot5 wrote:I like the buttons better at the top. It's more intuitive to have the filter buttons at the top since they affect only the top list.
Having the filters at the top does seem to be more intuitive. It also helps to separate the filters from the add/remove a card buttons.
I figured out how to raise the top of the card detail panel. This helps to minimize the resizing of the card detail panel as we select different cards.
-
Chris H. - Forge Moderator
- Posts: 6320
- Joined: 04 Nov 2008, 12:11
- Location: Mac OS X Yosemite
- Has thanked: 644 times
- Been thanked: 643 times
Re: Making a prettier GUI
by Chris H. » 11 Jan 2011, 14:03
`Hellfish wrote:I agree with slapshot, but am also a bit sad that the filter textbox doesn't seem to fit. :/
Yeah, it can be difficult to get everything to fit on a 1024 x 768 monitor.
My iMac does 1920 x 1200 and that gives me room for several different textbox filters at the top.

-
Chris H. - Forge Moderator
- Posts: 6320
- Joined: 04 Nov 2008, 12:11
- Location: Mac OS X Yosemite
- Has thanked: 644 times
- Been thanked: 643 times
Re: Making a prettier GUI
by Chris H. » 11 Jan 2011, 14:17
`choppic wrote:Should we reduce the size of the filter icons?
We're using 32x32 pixels right now. Is it possible to keep the textbox if we use 24x24 pixels?
Can you give me a set of 24 x 24 icons before the end of the week?
I spent some time doing a few simple sketches of the player panel. At the smallest size, it is slightly less than 200 x 200 pixels. This will not allow us to use 32 x 32 pixel icons in the player panel.
While it would be nice to keep all of the icons at 32 x 32 pixels I do not think that we will succeed.

I tried to move the textbox to the cell with the add/remove a card buttons. It was not pretty, I must have made a mistake.
And I had a thought. It might be more useful to have the textbox be used to filter types rather than names. This way people could activate only the green color and creature buttons and then type in "Elf" ... just a thought.

-
Chris H. - Forge Moderator
- Posts: 6320
- Joined: 04 Nov 2008, 12:11
- Location: Mac OS X Yosemite
- Has thanked: 644 times
- Been thanked: 643 times
Re: Making a prettier GUI
by slapshot5 » 11 Jan 2011, 14:59
Or have it search Name and Type. That's what I do in Gatherer.Chris H. wrote:choppic wrote:And I had a thought. It might be more useful to have the textbox be used to filter types rather than names. This way people could activate only the green color and creature buttons and then type in "Elf" ... just a thought.
-slapshot5
- slapshot5
- Programmer
- Posts: 1391
- Joined: 03 Jan 2010, 17:47
- Location: Mac OS X
- Has thanked: 25 times
- Been thanked: 68 times
Re: Making a prettier GUI
by Chris H. » 11 Jan 2011, 17:55
Here is my most recent update. There is a pic attached below and it was taken with the monitor at 1024 x 768.
We now have the filter by name textbox underneath the filter icons. There should be enough room to add in a filter by type textbox and a filter by card text textbox.
We still have room after the add/remove a card buttons for additional buttons if someone comes up with a good idea. At one point I had the filter by name textbox here but I did not like the layout as much.
I also made some adjustments to the cell settings for the panels/buttons on the right hand side. I scrolled through the card table card after card and I no longer see the card detail panel resizing.
`
We now have the filter by name textbox underneath the filter icons. There should be enough room to add in a filter by type textbox and a filter by card text textbox.
We still have room after the add/remove a card buttons for additional buttons if someone comes up with a good idea. At one point I had the filter by name textbox here but I did not like the layout as much.
I also made some adjustments to the cell settings for the panels/buttons on the right hand side. I scrolled through the card table card after card and I no longer see the card detail panel resizing.
`
-
Chris H. - Forge Moderator
- Posts: 6320
- Joined: 04 Nov 2008, 12:11
- Location: Mac OS X Yosemite
- Has thanked: 644 times
- Been thanked: 643 times
Re: Making a prettier GUI
by Hellfish » 11 Jan 2011, 18:02
Looks great to me. I'm mostly just protective of the filter text box. I got addicted to it in the little time it was there last time ^^. Makes filtering for a lot of specific cards a lot smoother as I'm sure you're aware 

So now you're
Screaming for the blood of the cookie monster
Evil puppet demon of obesity
Time to change the tune of his fearful ballad
C is for "Lettuce," that's good enough for me
Screaming for the blood of the cookie monster
Evil puppet demon of obesity
Time to change the tune of his fearful ballad
C is for "Lettuce," that's good enough for me
-
Hellfish - Programmer
- Posts: 1297
- Joined: 07 Jun 2009, 10:41
- Location: South of the Pumphouse
- Has thanked: 110 times
- Been thanked: 169 times
Who is online
Users browsing this forum: No registered users and 27 guests