mobile - LiveCode/RunRev で表示サイズに合わせてスタックサイズを調整する方法

Question

私は新しい livecode アプリの開発者であり、ディスプレイ サイズに応じてマルチ解像度で適合する必要があるモバイル アプリを開発しています。しかし、画像の背景を使用すると、表示が画像サイズを超えて伸びると空白が表示されます

RunRev には、Android の相対レイアウトのようにビュー サイズを調整する機能があります。

Answer 1

ここで考慮すべき問題がいくつかあります。

1. オリエンテーション
2. 縦横比
3. 画素密度

プランA

これら 3 つのケースすべてを 1 つの画像で処理するには、正方形の画像をお勧めします。サポートしたいサイズの中密度デバイスに必要なサイズの 2 倍にしてから、LiveCode にインポートします。resizeQuality を「good」に設定し (「best」に設定すると少し遅くなる可能性があります)、その lockLoc を true に設定します。幅と高さを 2 で割ると、半分のサイズで表示される画像になります。これにより、高解像度ディスプレイで妥当な品質が維持されます。向きと縦横比によっては上部と側面が切り取られるため、重要なものは画像の中央に配置するようにしてください。

次のステップは、画像が比例してサイズ変更されるようにする resizeStack スクリプトです (このスクリプトは、画像が正方形であることを前提としています)。

on resizeStack
 lock screen
 if the height of this card > the width of this card then
    set the width of image "background" to the height of this card
    set the height of image "background" to the height of this card
 else
    set the width of image "background" to the width of this card
    set the height of image "background" to the width of this card
 end if
 set the loc of image "background" to the loc of this card
end resizeStack

次の手段

繰り返しパターンを使用して、スタックの backPattern を設定します。ただし、メモリ使用量ははるかに少なくなりますが、使用できる背景の種類に関して柔軟性が大幅に低下します。

Answer 2

フィールドまたはボタンのサイズを変更するときは、resizeStack ハンドラーで textSize も変更することを忘れないでください。

スケーリング:

put "1.25" into pScaleFactor
set the textSize of field "your field" to round(the textSize of field "your field" * pScaleFactor)
set the textHeight of field "your field" to round(the textHeight of field "your field" * pScaleFactor)

また

ちょうど：

if the height of this card > 640 then
set the textSize of field "your field" to "24"
set the textHeight of field "your field" to "26"
end if