Everyone,
Daily build #2860 will provide our work-around for those Windows 10 Mobile scaling bugs you’ve seen on devices having an onscreen navigation bar. Just note that this is a “blind fix” since I can’t reproduce this issue on my devices. I can only sort-of reproduce it in the Windows Phone emulators. Please let me know how it works out for you all. Also note that it won’t solve the problems you are seeing with the Lumia 535 unfortunately.
Please test the new build with the following “main.lua” code. The following project does not need a “config.lua” file. The content area will be displayed white, and if you do add a “config.lua” file, then the letterbox areas will appear red.
-- Hide the status bar. display.setStatusBar(display.HiddenStatusBar) -- Display a black bacground rectangle in Corona's content region and red in the letterbox region. local backgroundRectangle = display.newRect(0, 0, 0, 0) --backgroundRectangle:setFillColor(0, 0, 0) backgroundRectangle:setFillColor(1, 1, 1) display.setDefault("background", 1, 0, 0) --display.setDefault("background", 1, 1, 1) -- Define the rest of our variables. local textObject = nil local textGuideLineTop = nil local textGuideLineBottom = nil local textGuideLineLeft = nil local textGuideLineRight = nil -- Creates a red horizontal line at the given position within the content region. -- It will not draw the line in the letterbox region. local function createHorizontalGuidingLineAt(positionY) local line = display.newLine(0, positionY, display.contentWidth, positionY) line:setStrokeColor(1, 0, 0) line.strokeWidth = display.contentScaleY -- Set line width to 1 pixel. return line end -- Creates a red vertical line at the given position within the content region. -- It will not draw the line in the letterbox region. local function createVerticalGuidingLineAt(positionX) local line = display.newLine(positionX, 0, positionX, display.contentHeight) line:setStrokeColor(1, 0, 0) line.strokeWidth = display.contentScaleX -- Set line width to 1 pixel. return line end -- Creates and/or updates all display objects to fit the window. local function updatePositions() -- Update the text object. local pixelWidth = display.pixelWidth local pixelHeight = display.pixelHeight if ((system.orientation == "landscapeRight") or (system.orientation == "landscapeLeft")) then local length = pixelWidth pixelWidth = pixelHeight pixelHeight = length end local message = "Window Size: " .. tostring(pixelWidth) .. "x" .. tostring(pixelHeight) .. " pixels" print(message) print("Content Size: " .. tostring(display.contentWidth) .. "x" .. tostring(display.contentHeight)) print("Orientation: " .. tostring(system.orientation) .. ", Content Scale: " .. tostring(display.contentScaleX)) if textObject then textObject.text = message textObject.size = 0 textObject.x = display.contentCenterX textObject.y = display.contentCenterY else local textSettings = { x = display.contentCenterX, y = display.contentCenterY, text = message, align = "center", } textObject = display.newText(textSettings) -- textObject = display.newEmbossedText(textSettings) textObject:setFillColor(0, 0, 0) end -- To prevent text blurriness, make sure it is displayed on a whole pixel. local xInPixels = textObject.x \* display.contentScaleX local yInPixels = textObject.y \* display.contentScaleY local xOffset = (math.floor(xInPixels) - xInPixels) / display.contentScaleX local yOffset = (math.floor(yInPixels) - yInPixels) / display.contentScaleY textObject:translate(xOffset, yOffset) -- Update the black background rectangle to fit the content region. backgroundRectangle.x = display.contentCenterX backgroundRectangle.y = display.contentCenterY backgroundRectangle.width = display.contentWidth backgroundRectangle.height = display.contentHeight -- Re-position the text object's guiding lines. local bounds = textObject.contentBounds if (textGuideLineTop) then textGuideLineTop:removeSelf() end if (textGuideLineBottom) then textGuideLineBottom:removeSelf() end if (textGuideLineLeft) then textGuideLineLeft:removeSelf() end if (textGuideLineRight) then textGuideLineRight:removeSelf() end textGuideLineTop = createHorizontalGuidingLineAt(bounds.yMin) textGuideLineBottom = createHorizontalGuidingLineAt(bounds.yMax) textGuideLineLeft = createVerticalGuidingLineAt(bounds.xMin) textGuideLineRight = createVerticalGuidingLineAt(bounds.xMax) end updatePositions() -- Called when the window has been resized. Re-layouts the app display objects to fit. local function onResized(event) updatePositions() end Runtime:addEventListener("resize", onResized) -- Called when a key has been pressed/released. local function onKey(event) -- If this is a Windows app, then toggle fullscreen mode via the F11 key. if (system.getInfo("platformName") == "Win") and (event.keyName == "f11") and (event.phase == "down") then local windowMode = native.getProperty("windowMode") if (windowMode == "fullscreen") then native.setProperty("windowMode", "normal") elseif (windowMode ~= nil) then native.setProperty("windowMode", "fullscreen") end end end Runtime:addEventListener("key", onKey) system.activate( "multitouch" ) local touchCircles = {} local function onTouch(event) if (event.phase == "began") then local circle = display.newCircle(event.x, event.y, display.contentWidth \* 0.2) circle:setFillColor(0, 0, 1, 0.75) touchCircles[event.id] = circle elseif (event.phase == "moved") then local circle = touchCircles[event.id] if circle then circle.x = event.x circle.y = event.y end elseif (event.phase == "ended") or (event.phase == "canceled") then local circle = touchCircles[event.id] if circle then touchCircles[event.id] = nil circle:removeSelf() end end end Runtime:addEventListener("touch", onTouch)
The above project will display a circle when you touch the screen. Can you please drag your finger from top to bottom on the screen to verify that the circle is always centered around your finger please? This tests that our touch coordinates are being correctly converted to pixels.
Also note that I *suspect* that your Lumia 550 and 640 XL might display a red or black rectangle onscreen. I say this because the height being reported by Microsoft’s APIs are a little short for those devices. I’m guessing that Microsoft made it that way on purpose and that the bottom navigation bar no longer overlays on top of Silverlight apps like how it did on Windows Phone 8.1.