Added title overlay when scrolling through lists.

CMakeLists.txt

@@ -291,6 +291,7 @@ set(ES_SOURCES
     ${CMAKE_CURRENT_SOURCE_DIR}/data/converted/frame_png.cpp
     ${CMAKE_CURRENT_SOURCE_DIR}/data/converted/textbox_png.cpp
     ${CMAKE_CURRENT_SOURCE_DIR}/data/converted/textbox_glow_png.cpp
+    ${CMAKE_CURRENT_SOURCE_DIR}/data/converted/scroll_gradient_png.cpp
     ${CMAKE_CURRENT_SOURCE_DIR}/data/converted/star_filled_png.cpp
     ${CMAKE_CURRENT_SOURCE_DIR}/data/converted/star_unfilled_png.cpp
     ${CMAKE_CURRENT_SOURCE_DIR}/data/converted/help_a_png.cpp

data/ResourceUtil.cpp

@@ -2,12 +2,13 @@
 
 #include "Resources.h"
 
-const size_t res2hNrOfFiles = 14;
+const size_t res2hNrOfFiles = 15;
 const Res2hEntry res2hFiles[res2hNrOfFiles] = {
     {":/button.png", button_png_size, button_png_data},
     {":/ES_logo_16.png", ES_logo_16_png_size, ES_logo_16_png_data},
     {":/ES_logo_32.png", ES_logo_32_png_size, ES_logo_32_png_data},
     {":/frame.png", frame_png_size, frame_png_data},
+    {":/scroll_gradient.png", scroll_gradient_png_size, scroll_gradient_png_data},
     {":/star_filled.png", star_filled_png_size, star_filled_png_data},
     {":/star_unfilled.png", star_unfilled_png_size, star_unfilled_png_data},
     {":/textbox.png", textbox_png_size, textbox_png_data},
@@ -25,16 +26,17 @@ res2hMapType::value_type mapTemp[] = {
     std::make_pair(":/ES_logo_16.png", res2hFiles[1]),
     std::make_pair(":/ES_logo_32.png", res2hFiles[2]),
     std::make_pair(":/frame.png", res2hFiles[3]),
-    std::make_pair(":/star_filled.png", res2hFiles[4]),
+    std::make_pair(":/scroll_gradient.png", res2hFiles[4]),
-    std::make_pair(":/star_unfilled.png", res2hFiles[5]),
+    std::make_pair(":/star_filled.png", res2hFiles[5]),
-    std::make_pair(":/textbox.png", res2hFiles[6]),
+    std::make_pair(":/star_unfilled.png", res2hFiles[6]),
-    std::make_pair(":/textbox_glow.png", res2hFiles[7]),
+    std::make_pair(":/textbox.png", res2hFiles[7]),
-    std::make_pair(":/help/a.png", res2hFiles[8]),
+    std::make_pair(":/textbox_glow.png", res2hFiles[8]),
-    std::make_pair(":/help/b.png", res2hFiles[9]),
+    std::make_pair(":/help/a.png", res2hFiles[9]),
-    std::make_pair(":/help/dpad.png", res2hFiles[10]),
+    std::make_pair(":/help/b.png", res2hFiles[10]),
-    std::make_pair(":/help/left_right.png", res2hFiles[11]),
+    std::make_pair(":/help/dpad.png", res2hFiles[11]),
-    std::make_pair(":/help/menu.png", res2hFiles[12]),
+    std::make_pair(":/help/left_right.png", res2hFiles[12]),
-    std::make_pair(":/help/up_down.png", res2hFiles[13])
+    std::make_pair(":/help/menu.png", res2hFiles[13]),
+    std::make_pair(":/help/up_down.png", res2hFiles[14])
 };
 
 res2hMapType res2hMap(mapTemp, mapTemp + sizeof mapTemp / sizeof mapTemp[0]);

data/Resources.h

@@ -17,6 +17,9 @@ extern const unsigned char ES_logo_32_png_data[];
 extern const size_t frame_png_size;
 extern const unsigned char frame_png_data[];
 
+extern const size_t scroll_gradient_png_size;
+extern const unsigned char scroll_gradient_png_data[];
+
 extern const size_t star_filled_png_size;
 extern const unsigned char star_filled_png_data[];
 

src/components/IList.h

@@ -2,6 +2,10 @@
 
 #include <string>
 #include <vector>
+#include <memory>
+#include "../GuiComponent.h"
+#include "ImageComponent.h"
+#include "../resources/Font.h"
 
 enum CursorState
 {
@@ -18,12 +22,12 @@ struct ScrollTier
 const int SCROLL_SPEED_COUNT = 3;
 const ScrollTier SCROLL_SPEED[SCROLL_SPEED_COUNT] = {
 	{500, 500},
-	{2600, 150},
+	{5000, 114},
-	{0, 100}
+	{0, 8}
 };
 
 template <typename EntryData, typename UserData>
-class IList
+class IList : public GuiComponent
 {
 public:
 	struct Entry
@@ -42,16 +46,28 @@ protected:
 	int mScrollTierAccumulator;
 	int mScrollCursorAccumulator;
 
+	unsigned char mTitleOverlayOpacity;
+	unsigned int mTitleOverlayColor;
+	ImageComponent mGradient;
+	std::shared_ptr<Font> mTitleOverlayFont;
+
 	std::vector<Entry> mEntries;
 	
 public:
-	IList()
+	IList(Window* window) : GuiComponent(window), mGradient(window)
 	{
 		mCursor = 0;
 		mScrollTier = 0;
 		mScrollVelocity = 0;
 		mScrollTierAccumulator = 0;
 		mScrollCursorAccumulator = 0;
+
+		mTitleOverlayOpacity = 0x00;
+		mTitleOverlayColor = 0xFFFFFF00;
+		mGradient.setImage(":/scroll_gradient.png");
+		mGradient.setColorShift(0x000040FF);
+		mGradient.setOpacity(0);
+		mTitleOverlayFont = Font::get(FONT_SIZE_LARGE);
 	}
 
 	bool isScrolling() const
@@ -154,12 +170,24 @@ protected:
 
 	void listUpdate(int deltaTime)
 	{
+		// update the title overlay opacity
+		const int dir = (mScrollTier >= SCROLL_SPEED_COUNT - 1) ? 1 : -1; // fade in if scroll tier is >= 1, otherwise fade out
+		int op = mTitleOverlayOpacity + deltaTime*dir; // we just do a 1-to-1 time -> opacity, no scaling
+		if(op >= 255)
+			mTitleOverlayOpacity = 255;
+		else if(op <= 0)
+			mTitleOverlayOpacity = 0;
+		else
+			mTitleOverlayOpacity = (unsigned char)op;
+
 		if(mScrollVelocity == 0 || size() < 2)
 			return;
 
 		mScrollCursorAccumulator += deltaTime;
 		mScrollTierAccumulator += deltaTime;
 
+		// we delay scrolling until after scroll tier has updated so isScrolling() returns accurately during onCursorChanged callbacks
+		// we don't just do scroll tier first because it would not catch the scrollDelay == tier length case
 		int scrollCount = 0;
 		while(mScrollCursorAccumulator >= SCROLL_SPEED[mScrollTier].scrollDelay)
 		{
@@ -174,10 +202,33 @@ protected:
 			mScrollTier++;
 		}
 
+		// actually perform the scrolling
 		for(int i = 0; i < scrollCount; i++)
 			scroll(mScrollVelocity);
 	}
 
+	void listRenderTitleOverlay(const Eigen::Affine3f& trans)
+	{
+		if(size() == 0 || !mTitleOverlayFont || mTitleOverlayOpacity == 0)
+			return;
+
+		// we don't bother caching this because it's only two letters and will change pretty much every frame if we're scrolling
+		const std::string text = getSelectedName().size() >= 2 ? getSelectedName().substr(0, 2) : "??";
+
+		Eigen::Vector2f off = mTitleOverlayFont->sizeText(text);
+		off[0] = (mSize.x() - off.x()) * 0.7f;
+		off[1] = (mSize.y() - off.y()) * 0.5f;
+		
+		mGradient.setOpacity(mTitleOverlayOpacity);
+		mGradient.render(trans);
+		mTitleOverlayFont->drawText(text, off, (mTitleOverlayColor & 0xFFFFFF00) | mTitleOverlayOpacity); // relies on mGradient's render to Renderer::setMatrix(trans)
+	}
+
+	virtual void onSizeChanged() override
+	{
+		mGradient.setResize(mSize);
+	}
+
 	void scroll(int amt)
 	{
 		if(mScrollVelocity == 0 || size() < 2)

src/components/ImageGridComponent.h

@@ -11,7 +11,7 @@ struct ImageGridData
 };
 
 template<typename T>
-class ImageGridComponent : public GuiComponent, public IList<ImageGridData, T>
+class ImageGridComponent : public IList<ImageGridData, T>
 {
 public:
 	ImageGridComponent(Window* window);
@@ -79,7 +79,7 @@ private:
 };
 
 template<typename T>
-ImageGridComponent<T>::ImageGridComponent(Window* window) : GuiComponent(window)
+ImageGridComponent<T>::ImageGridComponent(Window* window) : IList(window)
 {
 	mEntriesDirty = true;
 }

src/components/TextListComponent.h

@@ -3,7 +3,6 @@
 #include "IList.h"
 #include "../Renderer.h"
 #include "../resources/Font.h"
-#include "../GuiComponent.h"
 #include "../InputManager.h"
 #include <vector>
 #include <string>
@@ -21,7 +20,7 @@ struct TextListData
 
 //A graphical list. Supports multiple colors for rows and scrolling.
 template <typename T>
-class TextListComponent : public GuiComponent, public IList<TextListData, T>
+class TextListComponent : public IList<TextListData, T>
 {
 public:
 	TextListComponent(Window* window);
@@ -84,7 +83,7 @@ private:
 
 template <typename T>
 TextListComponent<T>::TextListComponent(Window* window) : 
-	GuiComponent(window)
+	IList(window)
 {
 	mMarqueeOffset = 0;
 	mMarqueeTime = -MARQUEE_DELAY;
@@ -119,7 +118,7 @@ void TextListComponent<T>::render(const Eigen::Affine3f& parentTrans)
 	int startEntry = 0;
 
 	//number of entries that can fit on the screen simultaniously
-	int screenCount = (int)mSize.y() / entrySize;
+	int screenCount = (int)(mSize.y() / entrySize + 0.5f);
 	
 	if(size() >= screenCount)
 	{
@@ -197,6 +196,8 @@ void TextListComponent<T>::render(const Eigen::Affine3f& parentTrans)
 
 	Renderer::popClipRect();
 
+	listRenderTitleOverlay(trans);
+
 	GuiComponent::renderChildren(trans);
 }
 

src/views/gamelist/DetailedGameListView.cpp

@@ -19,7 +19,7 @@ DetailedGameListView::DetailedGameListView(Window* window, FileData* root) :
 	const float padding = 0.01f;
 
 	mList.setPosition(mSize.x() * (0.50f + padding), mList.getPosition().y());
-	mList.setSize(mSize.x() * (0.50f - 2*padding), mList.getSize().y());
+	mList.setSize(mSize.x() * (0.50f - padding), mList.getSize().y());
 	mList.setAlignment(TextListComponent<FileData*>::ALIGN_LEFT);
 	mList.setCursorChangedCallback([&](const CursorState& state) { updateInfoPanel(); });