Flintoのスクロールグループの挙動について

SketchライクなGUIでさくさくモックが作れちゃうFlinto、大変便利に使っているのですが、たまにスクロールグループで「ｲｲｲｰ」となることがあり、なんども沼にハマらないようにするために、スクロールグループの挙動についてまとめておきます。

縦に長い画像を「スクロールグループ」として設定しました。

プレビューはこんな感じ。イメージ通りの挙動ですね。

次に、同じ画像のy座標をずらし、途中からコンテンツが開始するようにしました…が、プレビューを見てみると

さきほど設定したスクロール領域がズレ、中途半端なところでバウンスするようになってしまいました。 Flintoでインスペクタを見てみましょう。

「スクロールコンテンツ」の「グループオプション」のy座標は 0

contents と名付けた画像ファイルの方の座標が -762 となっています。

ここで、スクロールグループについておさらいしてみましょう。

インスペクタでは以下のような設定項目があります。 スクロール位置を調整するには、スクロールグループ内の各画像の位置ではなく、「スクロールグループ」>「グループオプション」の「初期位置」を変更する必要があります。

このルールに則って、さきほどのファイルを修正してみましょう。

スクロールグループ内の画像 contents の位置は 0 に戻し

スクロールグループの「グループオプション」の「初期位置」y座標に 762 と設定しました。 プレビューがこちら

ｲｴｰｲ🎊イメージ通りの挙動になりました。

スクロール位置の調整は「スクロールグループ」>「グループオプション」>「初期位置」を調整するようにしましょう。