From 6e434e97094c798b2b9acb75da98bcc3494a2be7 Mon Sep 17 00:00:00 2001 From: Jeffrey Han Date: Sat, 10 Jan 2015 22:49:23 -0500 Subject: [PATCH] Improved appearance of tabs. - Replaced 'selection-tab.png' with a new image (by @kouyang). - Simulate osu! color scheme (tab color/font color changes instead of alpha changes for selected tab). - Added Utils.drawTab() method to avoid code duplication for Option menu tabs. Signed-off-by: Jeffrey Han --- res/selection-tab.png | Bin 633 -> 817 bytes src/itdelatrisu/opsu/SongSort.java | 36 ++++++++++------------ src/itdelatrisu/opsu/Utils.java | 24 +++++++++++++++ src/itdelatrisu/opsu/states/Options.java | 13 +++----- src/itdelatrisu/opsu/states/SongMenu.java | 7 ++++- 5 files changed, 52 insertions(+), 28 deletions(-) diff --git a/res/selection-tab.png b/res/selection-tab.png index 4d0ddb0a1eb65206e7d1505c69f2a7fc15c99a52..a19af4f1a01af25ad78bf8c7ae633c9eb7722154 100644 GIT binary patch literal 817 zcmeAS@N?(olHy`uVBq!ia0vp^_kdW7gAGXDNqM>hNa>WgMwB=gr6!hS=I1GdWag$a z1Sgg#7#b*eCFUs@85o)>7#UibnpgoDx(22O2FrQ{Ujp^9mw5WRvfpRqW-^y>HFA3n z6yhxKh%9Dc;1&X5#!GkW{s0A8(j9#r85lP9bN@+XWnf_H@N{tuskrs_rfr5)qRjD+ z*1}s^bxSp_G`I?^6zC{1QjpM)dZBP_WA>4g3!R@k9Xxq+Wpnm*J=TRSWs{mLRx~FE zdO2=ro~*C9yjCwl>zc~7?e(+j>_4PkgFxPi)$suKRaySZ&+Me)?SQsyZ-vERNKPsQET~E{SLb-9-6-S@pIPq8bX~lSte3qqI&|>CL1y}9=MUVxp&>| zH8W4HTfFz(XWc9Nl4Ng9dcKFVIDSd(-Cuc!WUhaV{`L3atml{BmX)7+x@mKOhRv$0 zS?m0ke~y!_Tl?zum(uj+?^oV`pD!mT*LV5l7D297H?4x(_ZFNsdmW$W9Y4P`=jW`y zb@zjG#A0ved@I}x*gvc^X|^el7Hp1k6Pt@wQ^Y(zyA7r zwr0oEOR5*GN;RvKHJJbMUd!Q!FE21gTs(NtaedIr8E4y9#br&NefQjx&(Gu5e-E{r zFJEahZ>jtb#y^?)`R{WKBzAZ$y(E0~?}}B)_dcH4&*S&#Vxos XoJm)cFEGUb(~ zkS3%^lQtxQ^>1KNv+nB79M7G(BP%3?khxB=-wzz_%(B&iAAjfEWh3(&r?c}5daP+J zYc;fn41hoBiZNe%BJWSrWbgUGw=epceq>UAn!Ym=^}n3V&e!$W)>_xH^b`1JXwDs>2%+2w-to+w3*Elf61@Zd&!xzRm6PV`=j-l;zFuivYxRl%-Ujbz zW^PB1*R%{MM}ITvy?b%^eM=wPzPdhqNzHxX$8_VFjiO!FOQ1XttzGDdeEN9RY4zRt zvWXX)JZ)Pw#fxlUkQr?td4~Gp)7@o=q8dK+wUbHLmqY zYgDVAO}x~QJRqPEtubH2x4{!~2ZZ#%`$Bhs>!Me1m*rA zW_|SqkK6&FgI9zvd(VO=teU{RV$}pH3m&-xst6v*16VZyCLRFpcmS&=09H+a-~sr{ zstJIJ2U!q206~IB>;NVnK=1&B3Lbp`D!Ah@@qj8O9>D`DxZ}|XfK?M1h~Uu&fIA*A uAgd;g04i8DNglw&0|sN_0k}^$0t^6QBeu|Fm&JSl0000 tabWidth) { // prevent tabs from being spaced out + tabOffset = tabWidth; + buttonX = (width * 0.99f) - (tabWidth * SIZE); + } this.tab = new MenuButton(tab, - (buttonX + (tab.getWidth() / 2f)) + (id * tabOffset), + (buttonX + (tabWidth / 2f)) + (id * tabOffset), (height * 0.15f) - (tab.getHeight() / 2f) - 2f ); } @@ -201,4 +191,12 @@ public enum SongSort { * @return true if within bounds */ public boolean contains(float x, float y) { return tab.contains(x, y); } + + /** + * Draws the sort tab. + * @param selected whether the tab is selected (white) or not (red) + */ + public void draw(boolean selected) { + Utils.drawTab(tab.getX(), tab.getY(), name, selected); + } } \ No newline at end of file diff --git a/src/itdelatrisu/opsu/Utils.java b/src/itdelatrisu/opsu/Utils.java index ba7dc2f2..3cfdcbc1 100644 --- a/src/itdelatrisu/opsu/Utils.java +++ b/src/itdelatrisu/opsu/Utils.java @@ -211,6 +211,30 @@ public class Utils { */ public static MenuButton getBackButton() { return backButton; } + /** + * Draws a tab image and text centered at a location. + * @param x the center x coordinate + * @param y the center y coordinate + * @param text the text to draw inside the tab + * @param selected whether the tab is selected (white) or not (red) + */ + public static void drawTab(float x, float y, String text, boolean selected) { + Image tabImage = GameImage.MENU_TAB.getImage(); + float tabTextX = x - (Utils.FONT_MEDIUM.getWidth(text) / 2); + float tabTextY = y - (tabImage.getHeight() / 2f) + + Math.max((tabImage.getHeight() - Utils.FONT_MEDIUM.getLineHeight()) / 1.5f, 0); + Color filter, textColor; + if (selected) { + filter = Color.white; + textColor = Color.black; + } else { + filter = Color.red; + textColor = Color.white; + } + Utils.drawCentered(tabImage, x, y, filter); + Utils.FONT_MEDIUM.drawString(tabTextX, tabTextY, text, textColor); + } + /** * Draws an image based on its center with a color filter. * @param img the image to draw diff --git a/src/itdelatrisu/opsu/states/Options.java b/src/itdelatrisu/opsu/states/Options.java index 7535add8..870858b9 100644 --- a/src/itdelatrisu/opsu/states/Options.java +++ b/src/itdelatrisu/opsu/states/Options.java @@ -487,17 +487,14 @@ public class Options extends BasicGameState { } // option tabs - g.setColor(Color.white); - Image tab = optionTabs[0].getImage(); - float tabTextY = optionTabs[0].getY() - (tab.getHeight() / 2f); for (int i = optionTabs.length - 1; i >= 0; i--) { - tab.setAlpha((i == currentTab) ? 1.0f : 0.7f); - optionTabs[i].draw(); - float tabTextX = optionTabs[i].getX() - (Utils.FONT_MEDIUM.getWidth(TAB_NAMES[i]) / 2); - Utils.FONT_MEDIUM.drawString(tabTextX, tabTextY, TAB_NAMES[i], Color.white); + if (i != currentTab) + Utils.drawTab(optionTabs[i].getX(), optionTabs[i].getY(), TAB_NAMES[i], false); } + Utils.drawTab(optionTabs[currentTab].getX(), optionTabs[currentTab].getY(), TAB_NAMES[currentTab], true); + g.setColor(Color.white); g.setLineWidth(2f); - float lineY = optionTabs[0].getY() + (tab.getHeight() / 2f); + float lineY = optionTabs[0].getY() + (GameImage.MENU_TAB.getImage().getHeight() / 2f); g.drawLine(0, lineY, width, lineY); g.resetLineWidth(); diff --git a/src/itdelatrisu/opsu/states/SongMenu.java b/src/itdelatrisu/opsu/states/SongMenu.java index 36619922..c7f7fa79 100644 --- a/src/itdelatrisu/opsu/states/SongMenu.java +++ b/src/itdelatrisu/opsu/states/SongMenu.java @@ -254,7 +254,12 @@ public class SongMenu extends BasicGameState { optionsButton.draw(); // sorting tabs - SongSort.drawAll(); + SongSort currentSort = SongSort.getSort(); + for (SongSort sort : SongSort.VALUES_REVERSED) { + if (sort != currentSort) + sort.draw(false); + } + currentSort.draw(true); // search Image searchIcon = GameImage.MENU_SEARCH.getImage();