【Roblox Studio】UIAspectRatioConstraintを使ってみよう【UIAspectRatioConstraint】

GUI

1. UIAspectRatioConstraintとは?

UIAspectRatioConstraint は、Roblox StudioのUI要素(Frame、ImageLabel など)に適用できる制約で、特定のアスペクト比(縦横比)を維持する ための機能です。
画面サイズが変わってもUIの形が崩れないように調整できます。

2. UIAspectRatioConstraintの主な用途

  • 正方形や特定の比率のUIを維持する – 例えば、1:1 のボタンや 16:9 の画像など
  • 異なるデバイス間でのUIの統一 – PC、スマホ、タブレットなど、どの画面サイズでもUIの形を維持
  • レイアウト崩れの防止 – 画面サイズが変わったときに意図しないUIの伸縮を防ぐ

3. UIAspectRatioConstraintの基本プロパティ

プロパティ名説明
AspectRatioUIのアスペクト比(例: 1.5 → 幅:高さ = 3:2)
DominantAxisどの軸を基準に比率を維持するか(Width または Height

4. UIAspectRatioConstraintの設定方法

  1. StarterGuiScreenGui を追加
  2. ScreenGui 内に FrameImageLabel を追加
  3. Frame または ImageLabel の中に UIAspectRatioConstraint を追加
  4. AspectRatio の値を設定(例: 1.5 → 幅1.5倍の長方形)
  5. DominantAxisWidth に設定すると、幅を基準に高さが決まる(Height なら逆)

5. UIAspectRatioConstraintの紹介動画

UIAspectRatioConstraintの設置から主なプロパティの変更を以下動画で紹介しています。

6. まとめ

UIAspectRatioConstraint を使うことで、UIの形がデバイスごとに崩れるのを防ぐことができます。
特に、ボタンや画像の形を統一したい場合に便利な機能です!

チュートリアル系電子書籍の紹介
Roblox Studioでゲーム制作を始めてみませんか?
日本語版 ※英語版あり 「10時間でできる Roblox Studio アクションゲーム制作入門」では、Roblox Studioでのゲーム制作の基本から応用までを短時間で効率的に学びます。この一冊で、初心者でも簡単にアクションゲームを制作できるようになり、ゲーム制作の面白さと達成感を存分に味わうことができます。Roblox Studioの世界への扉を開き、あなたのクリエイティブな旅を始めましょう。
チュートリアル系動画
電子書籍を動画にしました!※無料クーポンあり!

「10時間でできる Roblox Studio アクションゲーム制作入門」の動画版では、書籍の内容をさらにわかりやすく、実際の画面操作を見ながら学べる形式でお届けします。初心者でも安心して取り組めるように、Roblox Studioの基本操作からアクションゲームの完成までを丁寧に解説。テンポよく進むレクチャー動画で、あなたのペースに合わせて学習できます。この動画シリーズを通して、ゲーム制作の基礎をしっかり習得し、Roblox Studioの可能性を広げましょう!

割引クーポンコードはこちらです↓
※3月12日21時まで!
6E0150A3770784ADF77D

Luaに関する電子書籍の紹介
Roblox Studioで使用するLua言語の基本を学ぼう!
日本語版 ※英語版あり 「5時間でできる Roblox Studio を使ったLuaの基本」では、Roblox Studioで使用するプログラミング言語Luaの基本をRoblox Studio上で学びます。また、学んだ知識を活かして、Roblox StudioでLuaを使用する応用部分も一部盛り込まれています。この一冊でLuaの基本を学ぶことで、よりRoblox Studioでのゲーム制作を楽しめるようになります。
アニメーション制作系電子書籍の紹介
Roblox Studioでアニメーションを作ってみよう!
「5時間でできる Roblox Studio アニメーション制作入門」では、Roblox Studioでのアニメーション制作の基本から実際に作るところまでを短時間で効率的に学びます。この一冊で、アニメーション制作の第一歩を踏み出すことができます。Roblox Studioで自由自在にアニメーションを作成し、よりクリエイティブなゲームを作りましょう!
GUIRoblox Studio
シェアする
hideをフォローする
Roblox Studio 制作tips

コメント

タイトルとURLをコピーしました