Added render scaling

README.md

@@ -158,7 +158,7 @@ The terminal process failed to launch (exit code: 1).
 ```
 **A:** This means the environment variables have not been set OR the SDK has not been installed correctly.
 
-**Q: Why is my map rendered very big or small when I didn't set the `gridRenderScale`? ?**
+**Q: Why is my map rendered very big or small when I didn't set the `renderScale`? ?**
 **A:** Make sure you didn't name the tilesets the same but with different size. They are cached in the `.pdx` file.
 Example:
 If you have a tileset `bw_table-16-16.png`, then DONT add a `bw_table-8-8.png`.

Source/config.lua

@@ -9,6 +9,7 @@ config = {
     playerType = "grid",
     font = "Pulp",
     showFPS = true,
+    renderScale = 1,
     interface = {
         images = {
             pages = "images/interface/16-16/pages-16-16.png",

Source/core/cotton/Dialog.lua

@@ -4,7 +4,8 @@ class("Dialog", {
     positionX = 0,
     positionY = 0,
     dialogWidth = 0,
-    dialogHeight = 0
+    dialogHeight = 0,
+    tileSize = 20 / config.renderScale
 }).extends(gfx.sprite)
 
 function Dialog:init(positionX, positionY, dialogWidth, dialogHeight, zIndex)
@@ -20,8 +21,8 @@ function Dialog:init(positionX, positionY, dialogWidth, dialogHeight, zIndex)
 
     local nineslice = gfx.nineSlice.new(
         config.interface.images.dialog,
-        10 / config.gridRenderScale,
-        10 / config.gridRenderScale,
+        self.tileSize / 2,
+        self.tileSize / 2,
         1, 1
     )
     self.dialogImage = gfx.image.new(self.dialogWidth, self.dialogHeight)

Source/core/cotton/Menu/MenuCursor.lua

@@ -4,7 +4,7 @@ class("MenuCursor", {
     positionX = 0,
     positionY = 0,
     selected = 1,
-    tileSize = 16
+    tileSize = 16 / config.renderScale
 }).extends(gfx.sprite)
 
 function MenuCursor:init(positionX, positionY, zIndex)

Source/core/cotton/Menu/MenuHandler.lua

@@ -6,7 +6,8 @@ import "core/cotton/Menu/MenuOptions"
 
 class("MenuHandler", {
     options = {},
-    currentChunk = 1
+    currentChunk = 1,
+    margin = 16 / config.renderScale
 }).extends()
 
 dialogDepth = 0
@@ -20,12 +21,12 @@ function MenuHandler:init(options, callback)
 
     self.callback = callback or nil
 
-    self.dialogWidth = options.w or 300
-    self.dialogHeight = options.h or 98
+    self.dialogWidth = options.w or (300 / config.renderScale)
+    self.dialogHeight = options.h or (96 / config.renderScale) -- 96 = 6 tilerows (4 text + 2 margin rows)
+
+    self.positionX = options.x or (50 / config.renderScale)
+    self.positionY = options.y or (50 / config.renderScale)
 
-    self.positionX = options.x or 50
-    self.positionY = options.y or 50
-    self.margin = 16
     self.zIndex = options.zIndex or 0
 
     self.dialog = Dialog(

Source/core/cotton/Menu/MenuOptions.lua

@@ -7,7 +7,7 @@ class(
         positionY = 0,
         dialogWidth = 0,
         dialogHeight = 0,
-        tileSize = 16
+        tileSize = 16 / config.renderScale
     }
 ).extends(gfx.sprite)
 

Source/core/cotton/Menu/PagesIcon.lua

@@ -7,7 +7,7 @@ class(
     {
         positionX = 0,
         positionY = 0,
-        tileSize = 16
+        tileSize = 16 / config.renderScale
     }
 ).extends(gfx.sprite)
 

Source/core/cotton/PromptIcon.lua

@@ -5,7 +5,7 @@ import "CoreLibs/animation"
 class("PromptIcon", {
     positionX = 0,
     positionY = 0,
-    tileSize = 16
+    tileSize = 16 / config.renderScale
 }).extends(gfx.sprite)
 
 function PromptIcon:init(positionX, positionY, zIndex)

Source/core/cotton/messageHandler.lua

@@ -10,7 +10,8 @@ class("MessageHandler", {
     chunkList = {},
     currentLength = 0,
     chunkOffset = 0,
-    currentChunk = 0
+    currentChunk = 0,
+    margin = 16 / config.renderScale
 }).extends()
 
 function MessageHandler:new(message, options)
@@ -20,12 +21,11 @@ function MessageHandler:new(message, options)
 
     game.freeze()
 
-    self.dialogWidth = options.w or 300
-    self.dialogHeight = options.h or 98
+    self.dialogWidth = options.w or (300 / config.renderScale)
+    self.dialogHeight = options.h or (96 / config.renderScale) -- 96 = 6 tilerows (4 text + 2 margin rows)
 
-    self.positionX = options.x or 50
-    self.positionY = options.y or 50
-    self.margin = 16
+    self.positionX = options.x or (50 / config.renderScale)
+    self.positionY = options.y or (50 / config.renderScale)
 
     self.dialog = Dialog(
         self.positionX,
@@ -165,16 +165,18 @@ end
 
 function MessageHandler:tryClose()
     if #self.options > 0 then
-        local fontSize = 16
+        local fontSize = 16 / config.renderScale
         local maxNumberOfItems = #self.options
         if maxNumberOfItems > 5 then
             maxNumberOfItems = 5
         end
         local minWidthForOption = self:getMaxWidthForOptions(self.options, fontSize)
+        local menuDialogWidth = minWidthForOption + self.margin * 2
+
         cotton.menuHandler = MenuHandler({
-            x = self.positionX + self.dialogWidth - (minWidthForOption + self.margin * 2),
+            x = self.positionX + self.dialogWidth - (menuDialogWidth + self.margin),
             y = (self.positionY + self.dialogHeight) - (self.margin * 2),
-            w = minWidthForOption + self.margin,
+            w = menuDialogWidth,
             h = (maxNumberOfItems * fontSize) + (self.margin * 2),
             options = self.options,
             zIndex = 1
@@ -214,8 +216,8 @@ function MessageHandler:skipTransition()
 end
 
 function MessageHandler:disableDialog()
-    self.arrowDown:remove()
     self.isActive = false
+    self.arrowDown:remove()
     self.dialog:remove()
     self.text:remove()
     game.unfreeze()

Source/main.lua

@@ -18,6 +18,7 @@ playdate.display.setRefreshRate(30)
 
 asset.loadImageFolder("images/")
 
+playdate.display.setScale(config.renderScale)
 LDtk.load("levels/world.ldtk", config.useFastLoader)
 
 if playdate.isSimulator then