From d934d4ce77cbb9a5fe2b9741968baadb6b87651e Mon Sep 17 00:00:00 2001 From: Michael Werle Date: Fri, 1 Nov 2024 20:50:42 +0900 Subject: [PATCH 1/5] feat: add buy/sell prices to the Commodity Market. Feature request #5903 raised by lolo101. The advertised price in the Commodity Market represents the "mid-market rate", not the actual buy or sell prices. This information is not very useful to a trader, who has to click on a commodity and then buy or sell 1 unit to see the actual price. This change replaces the "mid-market" rate display with the actual buy and sell prices. --- data/lang/ui-core/en.json | 8 ++++++++ data/pigui/libs/commodity-market.lua | 11 ++++++++--- 2 files changed, 16 insertions(+), 3 deletions(-) diff --git a/data/lang/ui-core/en.json b/data/lang/ui-core/en.json index d2b79fd837..9969c2ffa7 100644 --- a/data/lang/ui-core/en.json +++ b/data/lang/ui-core/en.json @@ -83,6 +83,10 @@ "description": "Commodities and equipment prices", "message": "Buy" }, + "BUY_PRICE": { + "description": "Title for buy-price column in commodity market", + "message": "Buy Price" + }, "BUY_SHIP": { "description": "", "message": "Buy Ship" @@ -2151,6 +2155,10 @@ "description": "Button text to sell selected ship equipment", "message": "Sell Equipped" }, + "SELL_PRICE": { + "description": "Title for sell-price column in commodity market", + "message": "Sell Price" + }, "SENSORS": { "description": "Crew skill", "message": "Sensors" diff --git a/data/pigui/libs/commodity-market.lua b/data/pigui/libs/commodity-market.lua index 1287b86e27..1f5a1e0ca6 100644 --- a/data/pigui/libs/commodity-market.lua +++ b/data/pigui/libs/commodity-market.lua @@ -56,7 +56,7 @@ function CommodityMarketWidget.New(id, title, config) config.style = config.style or {} config.style.size = config.style.size or Vector2(0,0) config.itemTypes = config.itemTypes or { Commodities } - config.columnCount = config.columnCount or 6 + config.columnCount = config.columnCount or 7 config.initTable = config.initTable or function(self) ui.setColumnWidth(0, commodityIconSize.x + ui.getItemSpacing().x) @@ -68,7 +68,9 @@ function CommodityMarketWidget.New(id, title, config) ui.nextColumn() ui.text(l.NAME_OBJECT) ui.nextColumn() - ui.text(l.PRICE) + ui.text(l.BUY_PRICE) + ui.nextColumn() + ui.text(l.SELL_PRICE) ui.nextColumn() ui.text(l.IN_STOCK) ui.nextColumn() @@ -103,7 +105,10 @@ function CommodityMarketWidget.New(id, title, config) ui.nextColumn() ui.dummy(vZero) - ui.text(Format.Money(price)) + ui.text(Format.Money(config.getBuyPrice(self, item))) + ui.nextColumn() + ui.dummy(vZero) + ui.text(Format.Money(config.getSellPrice(self, item))) ui.nextColumn() ui.dummy(vZero) ui.text(config.getStock(self, item)) From 0e38a93d7a84a313556c18c57cb7dfea167193f2 Mon Sep 17 00:00:00 2001 From: Michael Werle Date: Fri, 1 Nov 2024 21:16:50 +0900 Subject: [PATCH 2/5] feat: tweak sizes in Commodity Market screen The additional colum in the Commodity Market screen caused the final column to be clipped, at least on a traditional 4:3 display. The left-side of the screen was increased to take up 60% of the display, with various other elements adjusted as required in order to still display nicely. --- data/pigui/libs/commodity-market.lua | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/data/pigui/libs/commodity-market.lua b/data/pigui/libs/commodity-market.lua index 1f5a1e0ca6..321bccb09c 100644 --- a/data/pigui/libs/commodity-market.lua +++ b/data/pigui/libs/commodity-market.lua @@ -27,10 +27,10 @@ local baseWidgetSizes = { fontSizeLarge = 22.5, -- pionillium.large.size, fontSizeXLarge = 27, -- pionillium.xlarge.size, iconSize = Vector2(0, 22.5 * 1.5), - smallButton = Vector2(92, 48), - bigButton = Vector2(128, 48), + smallButton = Vector2(80, 44), + bigButton = Vector2(100, 44), confirmButtonSize = Vector2(384, 48), - windowGutter = 18 + windowGutter = 16 } local commodityIconSize = Vector2(38.0, 32.0) -- png icons, native resolution @@ -60,7 +60,7 @@ function CommodityMarketWidget.New(id, title, config) config.initTable = config.initTable or function(self) ui.setColumnWidth(0, commodityIconSize.x + ui.getItemSpacing().x) - ui.setColumnWidth(1, self.style.size.x / 2.2 - 50 * self.style.widgetSizes.rescaleVector.x) + ui.setColumnWidth(1, self.style.size.x / 2.3 - 50 * self.style.widgetSizes.rescaleVector.x) end config.renderHeaderRow = config.renderHeaderRow or function(_) @@ -458,7 +458,7 @@ function CommodityMarketWidget:SetSize(size) size = Vector2(math.max(size.x, 100), math.max(size.y, 100)) if self.style.widgetSize ~= size then self.style.widgetSize = size - self.style.size = Vector2(size.x / 2, size.y) + self.style.size = Vector2(size.x * 0.6, size.y) self.style.widgetSizes = ui.rescaleUI( baseWidgetSizes, From 193fe761b8ddd9836696bfe266a73b2e76e9ac28 Mon Sep 17 00:00:00 2001 From: Michael Werle Date: Fri, 1 Nov 2024 22:04:04 +0900 Subject: [PATCH 3/5] feat: right-align numbers in commodity market table Left-aligned numbers are very difficult to read. Unfortunately there is no native support for text alignment in PiGui so each cell is manually adjusted to right-align the number text. --- data/pigui/libs/commodity-market.lua | 42 +++++++++++++++++++++------- 1 file changed, 32 insertions(+), 10 deletions(-) diff --git a/data/pigui/libs/commodity-market.lua b/data/pigui/libs/commodity-market.lua index 321bccb09c..966b63e407 100644 --- a/data/pigui/libs/commodity-market.lua +++ b/data/pigui/libs/commodity-market.lua @@ -103,22 +103,44 @@ function CommodityMarketWidget.New(id, title, config) ui.icon(cls[1], Vector2(ui.getTextLineHeight()), cls[2]) end - ui.nextColumn() + local txt = '' + local posX = 0 + + ui.nextColumn() -- Buy Price ui.dummy(vZero) - ui.text(Format.Money(config.getBuyPrice(self, item))) - ui.nextColumn() + txt = Format.Money(config.getBuyPrice(self, item)) + posX = ui.getColumnWidth() - ui.calcTextSize(txt).x - ui.getItemSpacing().x + ui.addCursorPos(Vector2(posX, 0)) + ui.text(txt) + ui.nextColumn() -- Sell Price ui.dummy(vZero) - ui.text(Format.Money(config.getSellPrice(self, item))) - ui.nextColumn() + txt = Format.Money(config.getSellPrice(self, item)) + posX = ui.getColumnWidth() - ui.calcTextSize(txt).x - ui.getItemSpacing().x + ui.addCursorPos(Vector2(posX, 0)) + ui.text(txt) + ui.nextColumn() -- In Stock ui.dummy(vZero) - ui.text(config.getStock(self, item)) - ui.nextColumn() + txt = config.getStock(self, item) + posX = ui.getColumnWidth() - ui.calcTextSize(txt).x - ui.getItemSpacing().x + ui.addCursorPos(Vector2(posX, 0)) + ui.text(txt) + ui.nextColumn() -- Demand ui.dummy(vZero) - ui.text(config.getDemand(self, item)) - ui.nextColumn() + txt = config.getDemand(self, item) + posX = ui.getColumnWidth() - ui.calcTextSize(txt).x - ui.getItemSpacing().x + ui.addCursorPos(Vector2(posX, 0)) + ui.text(txt) + ui.nextColumn() -- Cargo ui.dummy(vZero) local n = self.cargoMgr:CountCommodity(item) - ui.text(n > 0 and n or '') + if n > 0 then + txt = n + posX = ui.getColumnWidth() - ui.calcTextSize(txt).x - ui.getItemSpacing().x + ui.addCursorPos(Vector2(posX, 0)) + ui.text(txt) + else + ui.text('') + end end) ui.nextColumn() end From 54565c4c42137635515c1f97afc95b20b51e5cc7 Mon Sep 17 00:00:00 2001 From: Michael Werle Date: Sat, 2 Nov 2024 11:42:50 +0900 Subject: [PATCH 4/5] feat: middle-align the column headings in the Commodity Market A natural improvemnt of the previous commit was to move the alignment calculation code into a helper function, which can also middle-align text. This new feature was then used to middle-align the table column headings. This function should probably be added to a utility library where it can be used by other table-based UIs. --- data/pigui/libs/commodity-market.lua | 82 ++++++++++++---------------- 1 file changed, 36 insertions(+), 46 deletions(-) diff --git a/data/pigui/libs/commodity-market.lua b/data/pigui/libs/commodity-market.lua index 966b63e407..9de260723b 100644 --- a/data/pigui/libs/commodity-market.lua +++ b/data/pigui/libs/commodity-market.lua @@ -63,23 +63,39 @@ function CommodityMarketWidget.New(id, title, config) ui.setColumnWidth(1, self.style.size.x / 2.3 - 50 * self.style.widgetSizes.rescaleVector.x) end - config.renderHeaderRow = config.renderHeaderRow or function(_) - ui.text('') - ui.nextColumn() - ui.text(l.NAME_OBJECT) - ui.nextColumn() - ui.text(l.BUY_PRICE) - ui.nextColumn() - ui.text(l.SELL_PRICE) - ui.nextColumn() - ui.text(l.IN_STOCK) - ui.nextColumn() - ui.text(l.DEMAND) - ui.nextColumn() - ui.text(l.CARGO) + -- Adds a text column to the UI table with the given alignment + -- - txt - the text to display + -- - align - the horizontal alignment the text should have: + -- - "LEFT" (default if not specified) + -- - "MIDDLE", useful for table heading row + -- - "RIGHT", best for numbers + config.columnText = config.columnText or function(txt, align) + local posX = 0 + txt = txt or '' + align = align or "LEFT" + + if align == "RIGHT" then + posX = ui.getColumnWidth() - ui.calcTextSize(txt).x - ui.getItemSpacing().x + elseif align == "MIDDLE" then + posX = (ui.getColumnWidth() - ui.calcTextSize(txt).x - ui.getItemSpacing().x) / 2 + else -- default alignment is "LEFT" + -- no need to adjust the position + end + ui.addCursorPos(Vector2(posX, 0)) + ui.text(txt) ui.nextColumn() end + config.renderHeaderRow = config.renderHeaderRow or function(_) + config.columnText('') + config.columnText(l.NAME_OBJECT, "MIDDLE") + config.columnText(l.BUY_PRICE, "MIDDLE") + config.columnText(l.SELL_PRICE, "MIDDLE") + config.columnText(l.IN_STOCK, "MIDDLE") + config.columnText(l.DEMAND, "MIDDLE") + config.columnText(l.CARGO, "MIDDLE") + end + config.renderItem = config.renderItem or function(self, item) if(self.icons[item.icon_name] == nil) then self.icons[item.icon_name] = PiImage.New("icons/goods/".. item.icon_name ..".png") @@ -103,46 +119,20 @@ function CommodityMarketWidget.New(id, title, config) ui.icon(cls[1], Vector2(ui.getTextLineHeight()), cls[2]) end - local txt = '' - local posX = 0 + ui.nextColumn() - ui.nextColumn() -- Buy Price ui.dummy(vZero) - txt = Format.Money(config.getBuyPrice(self, item)) - posX = ui.getColumnWidth() - ui.calcTextSize(txt).x - ui.getItemSpacing().x - ui.addCursorPos(Vector2(posX, 0)) - ui.text(txt) - ui.nextColumn() -- Sell Price + config.columnText(Format.Money(config.getBuyPrice(self, item)), "RIGHT") ui.dummy(vZero) - txt = Format.Money(config.getSellPrice(self, item)) - posX = ui.getColumnWidth() - ui.calcTextSize(txt).x - ui.getItemSpacing().x - ui.addCursorPos(Vector2(posX, 0)) - ui.text(txt) - ui.nextColumn() -- In Stock + config.columnText(Format.Money(config.getSellPrice(self, item)), "RIGHT") ui.dummy(vZero) - txt = config.getStock(self, item) - posX = ui.getColumnWidth() - ui.calcTextSize(txt).x - ui.getItemSpacing().x - ui.addCursorPos(Vector2(posX, 0)) - ui.text(txt) - ui.nextColumn() -- Demand + config.columnText(config.getStock(self, item), "RIGHT") ui.dummy(vZero) - txt = config.getDemand(self, item) - posX = ui.getColumnWidth() - ui.calcTextSize(txt).x - ui.getItemSpacing().x - ui.addCursorPos(Vector2(posX, 0)) - ui.text(txt) - ui.nextColumn() -- Cargo + config.columnText(config.getDemand(self, item), "RIGHT") ui.dummy(vZero) local n = self.cargoMgr:CountCommodity(item) - if n > 0 then - txt = n - posX = ui.getColumnWidth() - ui.calcTextSize(txt).x - ui.getItemSpacing().x - ui.addCursorPos(Vector2(posX, 0)) - ui.text(txt) - else - ui.text('') - end + config.columnText(n > 0 and n or '', "RIGHT") end) - ui.nextColumn() end config.canDisplayItem = config.canDisplayItem or function (self, commodity) From 2179a936355a336d8e1caa37e7e140415ea47be0 Mon Sep 17 00:00:00 2001 From: Michael Werle Date: Sat, 2 Nov 2024 11:41:40 +0900 Subject: [PATCH 5/5] feat: tweak column headings of Commodity Market screen Clean up and declutter the column headings to have shorter or clearer names to improve the readability of this screenn. This also necessitated making the commodity name column slightly smaller in order to accommodate the slightly larger column title for the final column to prevent it from being clipped. --- data/lang/ui-core/en.json | 16 ++++++++++++---- data/pigui/libs/commodity-market.lua | 6 +++--- 2 files changed, 15 insertions(+), 7 deletions(-) diff --git a/data/lang/ui-core/en.json b/data/lang/ui-core/en.json index 9969c2ffa7..54ead23c24 100644 --- a/data/lang/ui-core/en.json +++ b/data/lang/ui-core/en.json @@ -85,7 +85,7 @@ }, "BUY_PRICE": { "description": "Title for buy-price column in commodity market", - "message": "Buy Price" + "message": "Buy" }, "BUY_SHIP": { "description": "", @@ -235,6 +235,10 @@ "description": "", "message": "Commander" }, + "COMMODITY": { + "description": "Title for commodity name column in commodity market", + "message": "Commodity" + }, "COMMODITY_MARKET": { "description": "", "message": "Commodity Market" @@ -1299,9 +1303,13 @@ "description": "", "message": "In cargo hold" }, + "IN_HOLD": { + "description": "Column title of the Commodity Market screen", + "message": "In hold" + }, "IN_STOCK": { - "description": "", - "message": "In stock" + "description": "Column title of Commodity and Ship Equipment markets showing current station stock level.", + "message": "Stock" }, "IN_SYSTEM": { "description": "Used in flight log, show which star system we are/were in", @@ -2157,7 +2165,7 @@ }, "SELL_PRICE": { "description": "Title for sell-price column in commodity market", - "message": "Sell Price" + "message": "Sell" }, "SENSORS": { "description": "Crew skill", diff --git a/data/pigui/libs/commodity-market.lua b/data/pigui/libs/commodity-market.lua index 9de260723b..84499a391a 100644 --- a/data/pigui/libs/commodity-market.lua +++ b/data/pigui/libs/commodity-market.lua @@ -60,7 +60,7 @@ function CommodityMarketWidget.New(id, title, config) config.initTable = config.initTable or function(self) ui.setColumnWidth(0, commodityIconSize.x + ui.getItemSpacing().x) - ui.setColumnWidth(1, self.style.size.x / 2.3 - 50 * self.style.widgetSizes.rescaleVector.x) + ui.setColumnWidth(1, self.style.size.x / 2.4 - 50 * self.style.widgetSizes.rescaleVector.x) end -- Adds a text column to the UI table with the given alignment @@ -88,12 +88,12 @@ function CommodityMarketWidget.New(id, title, config) config.renderHeaderRow = config.renderHeaderRow or function(_) config.columnText('') - config.columnText(l.NAME_OBJECT, "MIDDLE") + config.columnText(l.COMMODITY, "MIDDLE") config.columnText(l.BUY_PRICE, "MIDDLE") config.columnText(l.SELL_PRICE, "MIDDLE") config.columnText(l.IN_STOCK, "MIDDLE") config.columnText(l.DEMAND, "MIDDLE") - config.columnText(l.CARGO, "MIDDLE") + config.columnText(l.IN_HOLD, "MIDDLE") end config.renderItem = config.renderItem or function(self, item)