You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@flex.apache.org by agm65 <ag...@gmx.de> on 2019/03/19 16:15:38 UTC

RE: Auto changing the gaps,font size based on application DPI in Flexmobile

Hi all,

what is the difference between runtimeDPI and application DPI?
I have some problems with very large displays like the google pixel2.

It runs with 480 dpi. Everything looks to small with my 480 dpi settings. If
i use the values for 640dpi it looks good.

Any idea? And where to find the multidpi gaps? 

thx alot!



--
Sent from: http://apache-flex-users.2333346.n4.nabble.com/

Re: Running AIR apps in iOS Simulator - How To

Posted by agm65 <ag...@gmx.de>.
it works very very well. no large css! yippi! awsome!

thanks alot!



--
Sent from: http://apache-flex-users.2333346.n4.nabble.com/

Running AIR apps in iOS Simulator - How To

Posted by Erik Thomas <er...@icloud.com>.
Have you ever tried to set up and use the XCode iOS Simulator to test your app, and to see if the DPI mapping makes your app look good on all of them? If you haven't yet tackled it, this might be of some help to you (if you develop on MacOS). You can create other scripts that call this one in a loop with all devices if you want to launch them all to see how your app lays out on each one.

The reason I created this script is because I use IntelliJ IDEA and it doesn't support selecting a target simulator device when using iOS Simulator, and the only workaround is to set an environment variable with the device name you want in a shell and launching the IntelliJ app from the shell, i.e., $ open -a "IntelliJ....app" which is very inconvenient. Here is my feature request for this to be added to IntelliJ IDEA <https://youtrack.jetbrains.com/issue/IDEA-209027>.

Requirements:

MacOS
Flex SDK 4.16.1
AIR SDK 32 (in this example we point to the iOS SDK 12.1 version of the simulator) 

To use an older SDK, change the XCODE_SIM_SDK assignment from .../iPhoneSimulator12.1.sdk to .../iPhoneSimulator.sdk.

When you run the script you'll see...

$ ./sim.sh "iPad Pro (12.9-inch) (3rd generation)"
Packaging for iOS Simulator: iPad Pro (12.9-inch) (3rd generation)...
Uninstalling app from iOS Simulator if exists...
Installing on iOS Simulator...
Launching app on iOS Simulator...

Usage: ./sim.sh "iPad Pro (12.9-inch) (3rd generation)"

To get a list of simulator devices that you can pass to sim.sh, do this:

$xcrun simctl list devices
== Devices ==
-- iOS 12.1 --
    iPhone 5s (ADB3343E-C7FE-4AE5-9765-D093C9936B90) (Shutdown) 
    iPhone 6 (5E6C728C-64BF-4AD7-9A37-A34D416D8ABE) (Shutdown) 
    iPhone 6 Plus (9A3816FB-0319-476D-A916-F82F0446B1E6) (Shutdown) 
    iPhone 6s (5D4E1908-A7A4-465E-B5C3-618D5E22A334) (Shutdown) 
    iPhone 6s Plus (B913BBF2-4A1F-4E22-A10F-017062F204A4) (Shutdown) 
    iPhone 7 (C49F37AE-6A8C-4098-AE10-C6BD05454D6C) (Shutdown) 
    iPhone 7 Plus (795BCC5F-8AE7-4B34-B937-8904D44003F1) (Shutdown) 
    iPhone 8 (2D14F1ED-62B1-47B6-8823-C50AB861E0A5) (Shutdown) 
    iPhone 8 Plus (D570AFFD-D8DD-4C66-8D25-878759CBB234) (Shutdown) 
    iPhone SE (95A0E23F-B7D3-4A71-B3A8-B57808678D4B) (Shutdown) 
    iPhone X (822CEC4C-CF15-429A-8BFB-0BC69F5A0CE3) (Shutdown) 
    iPhone XS (7A3EDBA6-5A90-4626-9140-DB1C7C650B63) (Shutdown) 
    iPhone XS Max (8368B225-9E7D-454A-A726-452120A018C5) (Shutdown) 
    iPhone XR (285CBE47-656C-427A-9A42-21EE78C90135) (Shutdown) 
    iPad Air (B0D2085D-0B75-495E-9F9E-D0AFC52785F6) (Shutdown) 
    iPad Air 2 (F36F5E8F-39B6-49D9-A062-D69337973BAE) (Booted) 
    iPad (5th generation) (D2044591-EB6B-4ABC-90D4-3D1C58E46001) (Shutdown) 
    iPad Pro (9.7-inch) (ED4405C9-5F7E-4583-9717-BFA08709FC49) (Shutdown) 
    iPad Pro (12.9-inch) (3A10023B-7730-4F4E-AF7C-B0094B95DDF8) (Shutdown) 
    iPad Pro (12.9-inch) (2nd generation) (79493241-8938-42C6-AEF5-BDF4D087FA3F) (Shutdown) 
    iPad Pro (10.5-inch) (A79319D2-BDF3-459B-B737-8B7194691860) (Shutdown) 
    iPad (6th generation) (78D1258E-571C-4E96-9376-FF983EC0212E) (Shutdown) 
    iPad Pro (11-inch) (0D4EBB0C-059E-4320-BEDB-14E5A0591641) (Shutdown) 
    iPad Pro (12.9-inch) (3rd generation) (8AE329BE-DE28-4FEE-A0ED-983E435E980B) (Shutdown) 

Copy the full name without the (UUID) or device status, and pass it to your bash script.

Copy the following bash code to a sim.sh file, change all the assigned env vars, and chmod +x the file to execute. Oh, be sure the quotes are straight, not curly after pasting. Finally, note that the package command requires signing cert values, but they are ignored by the simulator, so just leave the package command values for -keystore "keep_this_as_is" and -storepass "keep_this_as_is" so the ADT command won't fail param validation phase.

Assumes you already built the app so there is an output directory with your swf, etc.

Begin File:

# !/bin/bash

# Edit the following assignments to your own, keeping in mind to use full paths, or source your .bash_profile to use ~/

CURRENT_FLEX_SDK="/Users/ethomas/linqto/FlexSDKs/SDK4.16.1-32-43"
IPA_PATH="/Users/ethomas/linqto/FlexDev/keiretsu/out/production/keiretsu/keiretsuforum.ipa"
APP_DESCR_PATH="/Users/ethomas/linqto/FlexDev/keiretsu/out/production/keiretsu/keiretsu-app.xml"
APP_BUNDLE_ID=com.linqto.keiretsuforum.debug
XCODE_SIM_SDK="/Applications/Xcode.app/Contents/Developer/Platforms/iPhoneSimulator.platform/Developer/SDKs/iPhoneSimulator12.1.sdk"
ADT_EXTRA_PARAMS="-extdir /Users/ethomas/linqto/FlexDev/EventANE \
	-C /Users/ethomas/linqto/FlexDev/keiretsu/out/production/keiretsu Main.swf \
	-C /Users/ethomas/linqto/FlexDev/keiretsu/appicons . \
	-C /Users/ethomas/linqto/FlexDev/keiretsu/launchscreens . \
	-C /Users/ethomas/linqto/FlexDev/keiretsu Assets.car" 

function adt() {
    java -Dapplication.home=${CURRENT_FLEX_SDK} -Dfile.encoding=UTF-8 -Djava.awt.headless=true \
    	-Duser.language=en -Duser.region=en -Xmx1024m -jar ${CURRENT_FLEX_SDK}/lib/adt.jar "$@"
}

function installApp() {
	echo "Installing on iOS Simulator..."
	adt -installApp -platform ios \
		-platformsdk $XCODE_SIM_SDK \
		-device ios-simulator \
		-package $IPA_PATH &>/dev/null
}

if [ "$1" != "" ]; then
    export AIR_IOS_SIMULATOR_DEVICE="$1"
fi

echo "Packaging for iOS Simulator: ${AIR_IOS_SIMULATOR_DEVICE}..."
adt -package \
	-target ipa-debug-interpreter-simulator \
	-storetype PKCS12 \
	-keystore "keep_this_as_is" \
	-storepass "keep_this_as_is" $IPA_PATH $APP_DESCR_PATH \
	-platformsdk $XCODE_SIM_SDK \
	$ADT_EXTRA_PARAMS
if [ "$?" != "0" ]; then
	echo "Failed to package the app!"
 	exit 1
fi

echo "Uninstalling app from iOS Simulator if exists..."
adt -uninstallApp -platform ios \
	-platformsdk $XCODE_SIM_SDK \
	-device ios-simulator \
	-appid $APP_BUNDLE_ID

installApp
if [ "$?" != "0" ]; then
	# For some reason, this command often fails with bogus plist error, but do it again and it works
  	installApp
fi
if [ "$?" != "0" ]; then
	# Nope failed twice, something else is going on
	echo "Failed to install the app!"
  	exit 1
fi

echo "Launching app on iOS Simulator..."
adt -launchApp -platform ios \
	-platformsdk $XCODE_SIM_SDK \
	-device ios-simulator -appid $APP_BUNDLE_ID 
if [ "$?" != "0" ]; then
	echo "Failed to launch the app!"
  	exit 1
fi

Re: Auto changing the gaps,font size based on application DPI in Flexmobile

Posted by Erik Thomas <er...@icloud.com>.
You shouldn't need to change any css. A 12 - 14pt font face in 160dpi is about like the typical body text you'll see in most mobile apps. But if your app is running on a 480 dpi display that 14pt font (still the same property setting or css) will appear roughly the same size as the typical body text you'll see in most mobile apps.

You never need to change font sizes or use any css directives to change font sizes, ever. It's unnecessary because the designers of Flex/Flash were smart about making it easy for your app to look good on all devices without changing any settings but the runtime DPI.

Oh, and if you don't extend the default RuntimeDPIProvider with your own settings, it will still map higher DPIs to scaled fonts and layouts.

The only real need for your own RuntimDPIProvider is where the defaults aren't quite as good as you want.

I always develop AIR apps with applicationDPI="160" which makes my optimal font sizes feel more like fonts you might set in a Word document, so instead of a high application DPI where your font has to be like 30pt for regular text, you can work with more intuitive sizes, e.g., 12-14pt for body text, 16 for h3, 18 for h2 and 20 for h1, or something like that.

Anyway, don't over think this. All the hard work has been done for you.

On Mar 19, 2019, at 11:54 AM, agm65 <ag...@gmx.de> wrote:

Hi Erik, 

thanks alot for your answer.
For my better understanding: The runtimeDPI value is the value of my device
and it sets my applicationDPI value to one of those 6 values (120-640). And
this applicationDPI value is used in the css to switch my font sizes etc?

So with defining new ranges i can finetune my settings. 

got it?



--
Sent from: http://apache-flex-users.2333346.n4.nabble.com/



Re: Auto changing the gaps,font size based on application DPI in Flexmobile

Posted by agm65 <ag...@gmx.de>.
Hi Erik, 

thanks alot for your answer.
For my better understanding: The runtimeDPI value is the value of my device
and it sets my applicationDPI value to one of those 6 values (120-640). And
this applicationDPI value is used in the css to switch my font sizes etc?

So with defining new ranges i can finetune my settings. 

got it?



--
Sent from: http://apache-flex-users.2333346.n4.nabble.com/

Re: Auto changing the gaps,font size based on application DPI in Flexmobile

Posted by Erik Thomas <er...@icloud.com>.
You can override the default DPI mappings that scale your app to devices with different DPIs. In your Application MXML file, add this property:

runtimeDPIProvider="com.yournamehere.CustomRuntimeDPIProvider"

And implement a class that extends the default RuntimeDPIProvider. These are settings one of my apps actually uses (with a starting applicationDPI setting of 160. It makes the portrait only iphone layout look good on an iPad as well as some of the super hi res devices that are coming out.

public class CustomRuntimeDPIProvider extends RuntimeDPIProvider {

   override public function get runtimeDPI():Number {
      if (Capabilities.screenDPI > 550) {
         return DPIClassification.DPI_640;
      } else if (Capabilities.screenDPI > 400) {
         return DPIClassification.DPI_480;
      } else if (Capabilities.screenDPI > 250) {
         return DPIClassification.DPI_320;
      }
      return super.runtimeDPI;
   }
}

You can experiment to fine-tune the right scaling based on DPI and to find the right starting applicationDPI. But essentially, all your layouts and fonts will scale together based on the runtimeDPI settings. This allows you to develop for a single applicationDPI, and different devices with higher DPI will show larger fonts, etc.

On Mar 19, 2019, at 9:15 AM, agm65 <ag...@gmx.de> wrote:

Hi all,

what is the difference between runtimeDPI and application DPI?
I have some problems with very large displays like the google pixel2.

It runs with 480 dpi. Everything looks to small with my 480 dpi settings. If
i use the values for 640dpi it looks good.

Any idea? And where to find the multidpi gaps? 

thx alot!



--
Sent from: http://apache-flex-users.2333346.n4.nabble.com/