Bug with Proportional Scaling in RapaGUI 2.0 on Android

[PEB]

Please test the following code on the Android Hollywood player:

Code: Select all

@REQUIRE "RapaGUI"
@REQUIRE "polybios"
@DISPLAY {Color=#WHITE, Width=600, Height=1920, Layers=True, ScaleMode=#SCALEMODE_LAYER, SmoothScale=True, FitScale=True, KeepProportions=True, Hidden=True}

CreateBrush(1, 600, 1920, #BLUE)
SetLineWidth(50)
SelectBrush(1)
	Box(0, 0, 600, 1920, #RED)
	Box(#CENTER, #CENTER, 400, 400, #RED)
EndSelect
DisplayBrush(1, 0, 0)

AppGUI$=[[<application id="app">
	<window id="Main" closegadget="true">
		<vgroup frame="true">
			<hollywood FixWidth="false" FixHeight="false" display="1"/>
		</vgroup>
	</window>
</application>]]
moai.CreateApp(AppGUI$)

Repeat
	WaitEvent
Forever

The proportional scaling is good; but what is not good is the large area of black on the right side of the display. Nothing should be black, since the display is set as #WHITE, and is filled with a brush that is #BLUE. (Also, the scaled display should appear in the center, not over to the left.)

[airsoftsoftwair]

Yes, there's something wrong there. Will be fixed.

[airsoftsoftwair]

Ok, so this probably won't be fixed. It is a general RapaGUI issue with "KeepProportions", i.e. it doesn't work on desktop systems either. As it looks, supporting "KeepProportions" in RapaGUI would mean going to some greater pains and this is probably not worth the effort.

[PEB]

That's too bad. (The main project that I'm working on right now needs proportional scaling to look right.)

I figured out a work-around that basically makes the display look the way that it should in both portrait and landscape orientation (but it involves some forced orientation changes at the start).

Here's the example from above with some work-around code added:

Code: Select all

@REQUIRE "RapaGUI"
@REQUIRE "polybios"
@DISPLAY {Title="Catechism", Color=#WHITE, Layers=True, Width=600, Height=1920, ScaleMode=#SCALEMODE_LAYER, SmoothScale=True, Hidden=True, SingleMenu=True}

DesiredWidth=600
DesiredHeight=1920

CreateBrush(1, 600, 1920, #BLUE)
SetLineWidth(50)
SelectBrush(1)
	Box(0, 0, 600, 1920, #RED)
	Box(#CENTER, #CENTER, 400, 400, #RED)
EndSelect
DisplayBrush(1, 0, 0)

AppGUI$=[[<application id="app">
	<window id="Main" notify="orientation">
		<vgroup frame="true">
			<hollywood FixWidth="false" FixHeight="false" display="1"/>
		</vgroup>
	</window>
</application>]]
moai.CreateApp(AppGUI$)

moai.set("Main", "Orientation", "Landscape")
moai.Set("Main", "open", True)
Wait(50)
LandscapeScreenHeight=GetAttribute(#DISPLAY, 1, #ATTRSCALEHEIGHT)
moai.set("Main", "Orientation", "Portrait")
Wait(50)
PortraitScreenHeight=GetAttribute(#DISPLAY, 1, #ATTRSCALEHEIGHT)
SetDisplayAttributes({ScaleWidth=100*(PortraitScreenHeight/DesiredHeight) .. "%", ScaleHeight=100*(PortraitScreenHeight/DesiredHeight) .. "%"})
moai.set("Main", "Orientation", "Device")

Function p_RapaGUIEvents(msg)
	Switch msg.attribute
	Case "Orientation":
		If moai.get("Main", "Orientation")="Portrait"
			SetDisplayAttributes({ScaleWidth=100*(PortraitScreenHeight/1844) .. "%", ScaleHeight=100*(PortraitScreenHeight/DesiredHeight) .. "%"})
		ElseIf moai.get("Main", "Orientation")="Landscape"
			SetDisplayAttributes({ScaleWidth=100*(LandscapeScreenHeight/DesiredHeight) .. "%", ScaleHeight=100*(LandscapeScreenHeight/DesiredHeight) .. "%"})
		EndIf
	EndSwitch
EndFunction
InstallEventHandler({RapaGUI=p_RapaGUIEvents})

Repeat
	WaitEvent
Forever

(If the display is not going to be rotated, then the work-around code can be simplified.)

Are there any other work-around solutions that you can suggest?

[airsoftsoftwair]

That's too bad. (The main project that I'm working on right now needs proportional scaling to look right.)

I've added a note about this on my to do list but don't count on it to happen because it's really complicated and needs lots of modifications in Hollywood, the Hollywood SDK, RapaGUI, and MUI Royale.

Are there any other work-around solutions that you can suggest?

Not if you need layers. If you don't need layers, you could just draw everything to a brush and then do the proportional scaling yourself. That's really simple and straightforward but of course it won't work with layers...

[PEB]

Here's a much better work-around for the example above:

Code: Select all

@REQUIRE "RapaGUI"
@REQUIRE "polybios"
@DISPLAY {Title="Test", Color=#WHITE, Layers=True, Width=600, Height=1920, ScaleMode=#SCALEMODE_LAYER, SmoothScale=True, Hidden=True, SingleMenu=True}

DesiredWidth=600
DesiredHeight=1920

CreateBrush(1, 600, 1920, #BLUE)
SetLineWidth(50)
SelectBrush(1)
	Box(0, 0, 600, 1920, #RED)
	Box(#CENTER, #CENTER, 400, 400, #RED)
EndSelect
DisplayBrush(1, 0, 0)

AppGUI$=[[<application id="app">
	<window id="Main" notify="orientation">
		<vgroup frame="true">
			<hollywood id="HWDisplay" FixWidth="false" FixHeight="false" display="1"/>
		</vgroup>
	</window>
</application>]]
moai.CreateApp(AppGUI$)

Function p_RapaGUIEvents(msg)
	Switch msg.attribute
	Case "Orientation":
		If moai.get("Main", "Orientation")="Portrait"
			Local ScreenHeight=moai.get("Main", "Height")*2-DisplayScreenDiff
			SetDisplayAttributes({ScaleWidth=100*(ScreenHeight/DesiredHeight) .. "%", ScaleHeight=100*(ScreenHeight/DesiredHeight) .. "%"})
		ElseIf moai.get("Main", "Orientation")="Landscape"
			Local ScreenHeight=moai.get("Main", "Height")*2-DisplayScreenDiff
			SetDisplayAttributes({ScaleWidth=100*(ScreenHeight/DesiredHeight) .. "%", ScaleHeight=100*(ScreenHeight/DesiredHeight) .. "%"})
		EndIf
	EndSwitch
EndFunction
InstallEventHandler({RapaGUI=p_RapaGUIEvents})

Local TempVar=moai.get("Main", "Height")*2
Local ScreenHeight=GetAttribute(#DISPLAY, 1, #ATTRSCALEHEIGHT)
DisplayScreenDiff=TempVar-ScreenHeight
SetDisplayAttributes({ScaleWidth=100*(ScreenHeight/DesiredHeight) .. "%", ScaleHeight=100*(ScreenHeight/DesiredHeight) .. "%"})

Repeat
	WaitEvent
Forever

(This works nice and fast whether or not the screen is rotated.)

[PEB]

Okay, this is the correct way to do it:
(Thanks to Andreas for the fixed code.)

Code: Select all

; you need to set ScaleHollywood to FALSE; otherwise RapaGUI 2.0 will automatically activate
; SYSTEMSCALE for your display which makes Hollywood behave differently and we don't want that
; because you handle scaling yourself
@REQUIRE "RapaGUI", {ScaleHollywood = False}
@DISPLAY {Title="Test", Color=#WHITE, Layers=True, Width=600, Height=1920, ScaleMode=#SCALEMODE_LAYER, SmoothScale=True, Hidden=True, SingleMenu=True}

DesiredWidth=600
DesiredHeight=1920

CreateBrush(1, 600, 1920, #BLUE)
SetLineWidth(50)
SelectBrush(1)
	Box(0, 0, 600, 1920, #RED)
	Box(#CENTER, #CENTER, 400, 400, #RED)
EndSelect
DisplayBrush(1, 0, 0)

AppGUI$=[[<application id="app">
	<window id="Main" notify="orientation">
		<vgroup frame="true">
			<hollywood id="HWDisplay" FixWidth="false" FixHeight="false" display="1"/>
		</vgroup>
	</window>
</application>]]
moai.CreateApp(AppGUI$)

Function p_RapaGUIEvents(msg)
	Switch msg.attribute
	Case "Orientation":
		If moai.get("Main", "Orientation")="Portrait"
			Local ScreenWidth, ScreenHeight
			Repeat
				ScreenWidth = moai.get("Main", "Width")
				ScreenHeight = moai.get("Main", "Height")
				VWait
			Until ScreenHeight>ScreenWidth
			ScreenHeight = ScreenHeight*ScaleFactor-DisplayScreenDiff	
			SetDisplayAttributes({ScaleWidth=100*(ScreenHeight/DesiredHeight) .. "%", ScaleHeight=100*(ScreenHeight/DesiredHeight) .. "%"})
		ElseIf moai.get("Main", "Orientation")="Landscape"
			Local ScreenWidth, ScreenHeight
			Repeat
				ScreenWidth = moai.get("Main", "Width")
				ScreenHeight = moai.get("Main", "Height")
				VWait
			Until ScreenWidth>ScreenHeight
			ScreenHeight = ScreenHeight*ScaleFactor-DisplayScreenDiff	
			SetDisplayAttributes({ScaleWidth=100*(ScreenHeight/DesiredHeight) .. "%", ScaleHeight=100*(ScreenHeight/DesiredHeight) .. "%"})
		EndIf
	EndSwitch
EndFunction
InstallEventHandler({RapaGUI=p_RapaGUIEvents})

ScaleFactor=GetAttribute(#DISPLAY, 1, #ATTRHOSTSCALE)
Local TempVar=moai.get("Main", "Height")*ScaleFactor
Local ScreenHeight=GetAttribute(#DISPLAY, 1, #ATTRSCALEHEIGHT)
DisplayScreenDiff=TempVar-ScreenHeight
SetDisplayAttributes({ScaleWidth=100*(ScreenHeight/DesiredHeight) .. "%", ScaleHeight=100*(ScreenHeight/DesiredHeight) .. "%"})

Repeat
	WaitEvent
Forever

[airsoftsoftwair]

Besides the fixed code, it also needs a fixed version of the Hollywood Player. I'll soon push a new update through Google Play.