GuiObject

非推奨を表示

*このコンテンツは、ベータ版のAI(人工知能)を使用して翻訳されており、エラーが含まれている可能性があります。このページを英語で表示するには、 こちら をクリックしてください。

作成できません
閲覧できません

GuiObject は、2D ユーザーインターフェイスオブジェクトの抽象クラス (BasePart のように)です。それは、SizePosition などのグラフィカルユーザーインターフェイス (GUI) オブジェクトの表示に関連するすべてのプロパティを定義します。また、AbsolutePositionAbsoluteSize、およびAbsoluteRotationのような便利な読み取り専用プロパティもあります。

GUI オブジェクトのレイアウトを特別な方法で操作するには、リスト/フレックス または グリッド のようなレイアウト構造を使用し、外観修正子 を通じてコアプロパティを超えてスタイル化できます。

と を使用して任意の GUI オブジェクトでマウスボタンイベントを検出できるものの、 と だけがクリック/押すなどの便利な専用イベントを持っています。

概要

プロパティ

GuiBase2d から継承した プロパティ

方法

イベント

GuiBase2d から継承した イベント

プロパティ

Active

並列読み取り

このプロパティは、 が 3D 空間に入力を沈めるかどうかを決定します、例えば、 クラスのような基本モデル。

For GuiButton オブジェクト ( ImageButton および TextButton )、このプロパティは、Activated が発生するかどうかを決定します (AutoButtonColor は、それらのためにもまだ機能します)。イベント InputBegan , InputChanged , そして InputEnded は、このプロパティの値に関わらず、通常通り動作します。

コードサンプル

This code sample demonstrates the usage of the Active property as a debounce for the Activated event.

TextButton Active Debounce

-- Place this LocalScript within a TextButton (or ImageButton)
local textButton = script.Parent
textButton.Text = "Click me"
textButton.Active = true
local function onActivated()
-- This acts like a debounce
textButton.Active = false
-- Count backwards from 5
for i = 5, 1, -1 do
textButton.Text = "Time: " .. i
task.wait(1)
end
textButton.Text = "Click me"
textButton.Active = true
end
textButton.Activated:Connect(onActivated)

AnchorPoint

並列読み取り

このプロパティは、絶対サイズに対しての GuiObject の起源ポイントを決定します。起源ポイントは、要素が配置される場所 (通過 GuiObject.Position ) と、レンダリングされた GuiObject.Size が拡張される場所を決定します。

図解と詳細については、ここを参照してください。

コードサンプル

This code sample moves a UI element to different sides of the parent element. It starts at the top-left and ends at the bottom-right. Paste into a LocalScript in a Frame, within a ScreenGui.

AnchorPoint Demo

local guiObject = script.Parent
while true do
-- Top-left
guiObject.AnchorPoint = Vector2.new(0, 0)
guiObject.Position = UDim2.new(0, 0, 0, 0)
task.wait(1)
-- Top
guiObject.AnchorPoint = Vector2.new(0.5, 0)
guiObject.Position = UDim2.new(0.5, 0, 0, 0)
task.wait(1)
-- Top-right
guiObject.AnchorPoint = Vector2.new(1, 0)
guiObject.Position = UDim2.new(1, 0, 0, 0)
task.wait(1)
-- Left
guiObject.AnchorPoint = Vector2.new(0, 0.5)
guiObject.Position = UDim2.new(0, 0, 0.5, 0)
task.wait(1)
-- Dead center
guiObject.AnchorPoint = Vector2.new(0.5, 0.5)
guiObject.Position = UDim2.new(0.5, 0, 0.5, 0)
task.wait(1)
-- Right
guiObject.AnchorPoint = Vector2.new(1, 0.5)
guiObject.Position = UDim2.new(1, 0, 0.5, 0)
task.wait(1)
-- Bottom-left
guiObject.AnchorPoint = Vector2.new(0, 1)
guiObject.Position = UDim2.new(0, 0, 1, 0)
task.wait(1)
-- Bottom
guiObject.AnchorPoint = Vector2.new(0.5, 1)
guiObject.Position = UDim2.new(0.5, 0, 1, 0)
task.wait(1)
-- Bottom-right
guiObject.AnchorPoint = Vector2.new(1, 1)
guiObject.Position = UDim2.new(1, 0, 1, 0)
task.wait(1)
end

AutomaticSize

並列読み取り

このプロパティは、子孫のサイズに基づいて親 UI オブジェクトの自動サイズを設定するのに使用されます。このプロパティを使用して、編集または実行時に UI オブジェクトにテキストやその他のコンテンツを動的に追加し、サイズがそのコンテンツに合わせて調整されます。

When が 以外の値に設定されると、このUIオブジェクトは子コンテンツに応じてサイズを変更する可能性があります。

このプロパティを使用する方法と、その動作について詳しくは、ここを参照してください。

コードサンプル

The following script creates an automatically-sized parent frame with aUIListLayout, then it inserts several automatically-sized TextLabel objects. Note how the parent UIListLayout automatically resizes to fit its child content and the labels automatically resize to fit their text content. This script can be parented to a ScreenGui.

LocalScript in a ScreenGui

-- Array of text labels/fonts/sizes to output
local labelArray = {
{ text = "Lorem", font = Enum.Font.Creepster, size = 50 },
{ text = "ipsum", font = Enum.Font.IndieFlower, size = 35 },
{ text = "dolor", font = Enum.Font.Antique, size = 55 },
{ text = "sit", font = Enum.Font.SpecialElite, size = 65 },
{ text = "amet", font = Enum.Font.FredokaOne, size = 40 },
}
-- Create an automatically-sized parent frame
local parentFrame = Instance.new("Frame")
parentFrame.AutomaticSize = Enum.AutomaticSize.XY
parentFrame.BackgroundColor3 = Color3.fromRGB(90, 90, 90)
parentFrame.Size = UDim2.fromOffset(25, 100)
parentFrame.Position = UDim2.fromScale(0.1, 0.1)
parentFrame.Parent = script.Parent
-- Add a list layout
local listLayout = Instance.new("UIListLayout")
listLayout.Padding = UDim.new(0, 5)
listLayout.Parent = parentFrame
-- Set rounded corners and padding for visual aesthetics
local roundedCornerParent = Instance.new("UICorner")
roundedCornerParent.Parent = parentFrame
local uiPaddingParent = Instance.new("UIPadding")
uiPaddingParent.PaddingTop = UDim.new(0, 5)
uiPaddingParent.PaddingLeft = UDim.new(0, 5)
uiPaddingParent.PaddingRight = UDim.new(0, 5)
uiPaddingParent.PaddingBottom = UDim.new(0, 5)
uiPaddingParent.Parent = parentFrame
for i = 1, #labelArray do
-- Create an automatically-sized text label from array
local childLabel = Instance.new("TextLabel")
childLabel.AutomaticSize = Enum.AutomaticSize.XY
childLabel.Size = UDim2.fromOffset(75, 15)
childLabel.Text = labelArray[i]["text"]
childLabel.Font = labelArray[i]["font"]
childLabel.TextSize = labelArray[i]["size"]
childLabel.TextColor3 = Color3.new(1, 1, 1)
childLabel.Parent = parentFrame
-- Visual aesthetics
local roundedCorner = Instance.new("UICorner")
roundedCorner.Parent = childLabel
local uiPadding = Instance.new("UIPadding")
uiPadding.PaddingTop = UDim.new(0, 5)
uiPadding.PaddingLeft = UDim.new(0, 5)
uiPadding.PaddingRight = UDim.new(0, 5)
uiPadding.PaddingBottom = UDim.new(0, 5)
uiPadding.Parent = childLabel
task.wait(2)
end

BackgroundColor3

並列読み取り

このプロパティは、GuiObject 背景の色 (満たす色) を決定します。要素にテキストが含まれている場合、例えば TextBoxTextButton 、または TextLabel が含まれている場合、背景の色がテキストの色と対比することを確認してください。

背景のビジュアルプロパティを決定する別のプロパティは、GuiObject.BackgroundTransparencyです;これを 1 に設定すると、背景やボーダーはレンダリングされません。

参照してください BorderColor3

コードサンプル

This code sample causes a parent Frame to loop through all colors of the rainbow using Color3.fromHSV.

Rainbow Frame

-- Put this code in a LocalScript in a Frame
local frame = script.Parent
while true do
for hue = 0, 255, 4 do
-- HSV = hue, saturation, value
-- If we loop from 0 to 1 repeatedly, we get a rainbow!
frame.BorderColor3 = Color3.fromHSV(hue / 256, 1, 1)
frame.BackgroundColor3 = Color3.fromHSV(hue / 256, 0.5, 0.8)
task.wait()
end
end

BackgroundTransparency

並列読み取り

このプロパティは、GuiObject 背景とボーダーの透明度を決定します。しかし、GUI が TextBoxTextButton 、または TextLabel である場合、テキストの透明度は決まりません; テキストの透明度はそれぞれ TextBox.TextTransparencyTextButton.TextTransparency、および TextLabel.TextTransparency で決まります。

このプロパティが 1 に設定されている場合、背景や境界がレンダリングされず、GUI 背景が完全に透明になります。

BorderColor3

並列読み取り

GuiObject 長方形のボーダーの色を決定します (またストロークの色として知られています)。これはオブジェクトの GuiObject.BackgroundColor3 から分離されています。オブジェクトの境界を見ることができない場合は、GuiObject.BorderSizePixel プロパティが 0 に設定されている場合です。

注: UIStroke コンポーネントは、より高度なボーダー効果を許可します。

コードサンプル

This code sample causes the border of a parent GuiObject to highlight when the user hovers their mouse over the element.

Button Highlight

-- Put me inside some GuiObject, preferrably an ImageButton/TextButton
local button = script.Parent
local function onEnter()
button.BorderSizePixel = 2
button.BorderColor3 = Color3.new(1, 1, 0) -- Yellow
end
local function onLeave()
button.BorderSizePixel = 1
button.BorderColor3 = Color3.new(0, 0, 0) -- Black
end
-- Connect events
button.MouseEnter:Connect(onEnter)
button.MouseLeave:Connect(onLeave)
-- Our default state is "not hovered"
onLeave()

BorderMode

並列読み取り

このプロパティは、同じ名前の枚数を使用して、GuiObject ボーダーがどのようにその寸法に対して配置されるかを決定します、Enum.BorderMode

注: UIStroke はこのプロパティをオーバーライドでき、より高度なボーダー効果を許可できます。

BorderSizePixel

並列読み取り

このプロパティは、GuiObject ボーダーのレンダリング幅をピクセルで決定します。これを 0 に設定すると、ボーダーが完全に無効になります。

注: UIStroke はこのプロパティをオーバーライドでき、より高度なボーダー効果を許可できます。

コードサンプル

This code sample causes the border of a parent GuiObject to highlight when the user hovers their mouse over the element.

Button Highlight

-- Put me inside some GuiObject, preferrably an ImageButton/TextButton
local button = script.Parent
local function onEnter()
button.BorderSizePixel = 2
button.BorderColor3 = Color3.new(1, 1, 0) -- Yellow
end
local function onLeave()
button.BorderSizePixel = 1
button.BorderColor3 = Color3.new(0, 0, 0) -- Black
end
-- Connect events
button.MouseEnter:Connect(onEnter)
button.MouseLeave:Connect(onLeave)
-- Our default state is "not hovered"
onLeave()

ClipsDescendants

並列読み取り

このプロパティは、GuiObject が長方形の境界外にレンダリングされる可能性のある子GUI要素の任意の部分をクリップするかどうかを決定します。

このプロパティでは Rotation はサポートされていません。このまたは祖先のGUIに 非ゼロ がある場合、このプロパティは無視され、子孫のGUI要素はこのプロパティの値に関係なくレンダリングされます。

読み取り専用
複製されていません
並列読み取り

プレイヤーの指が GuiObject にタップされて保持されると、GuiStateGuiObjectPress に設定されます。同様に、プレイヤーの指が GuiObject から解放されると、GuiStateGuiObjectIdle に設定され、InteractableGuiObject でオフになると、Class.GuiStateGuiObjectNonInteractableに設定されます。

Interactable

並列読み取り

GuiButton が相互作用できるかどうか、または GuiStateGuiObject が変更されているかどうかを決定します。

オン a GuiButton :

オン a GuiObject :

LayoutOrder

並列読み取り

このプロパティは、 (例: または )を使用して、 に を設定したときのソート順序を制御します。オブジェクトにシスターUIレイアウト構造がない場合、機能はありません。

GuiObjects は、低い値が優先される上昇順に並べ替えられます。同じ値を持つオブジェクトは、追加された順序に戻ります。

将来、2つの既存の要素間に要素を追加する必要があるかどうか不明な場合は、100 (0100200、など) の倍数を使用するのが良い習慣です。これにより、他の要素の間に注文された要素に使用できるレイアウトオーダー値の大きなギャップが保たれます。

また、オブジェクトの レンダリング順序 をソート順序ではなく決定する ZIndex も参照してください。

NextSelectionDown

並列読み取り

このプロパティは、ユーザーがゲームパッドセレクターを下に移動させたときに選択される を設定します。このプロパティが空である場合、ゲームパッドを下に移動しても選択された GUI は変更されません。

ゲームパッドセレクターを下に移動すると、GUIが GuiService.SelectedObject でない限り、このオブジェクトに Selectable が設定されます。このプロパティは、Selectable ではない場合でも GUI 要素に設定できるため、GUI の選択可能なプロパティの値が期待した動作と一致するようにしてください。

See also NextSelectionUp , NextSelectionLeft , そして NextSelectionRight

コードサンプル

This example demonstrates how to enable Gamepad navigation through a grid of GuiObject|GUI elements without manually having to connect the GuiObject.NextSelectionUp, GuiObject.NextSelectionDown, and GuiObject|NextSelectionRight, and GuiObject.NextSelectionLeft properties for every element in the grid.

Note that this code sample assumes your UIGridLayout is sorted by name, where elements are named in successive numerical order.

The code relies on this to set the NextSelection properties for all GuiObjects in the same level as the UIGridLayout. In our example, the UIGridLayoutObject and GUI elements within the grid are all children of a Frame named "Container". The code gets the children of "Container" and loops through each child. Children that are not GuiObjects are ignored. For each GUI element, the code attempts to assigned the NextSelection properties using the following logic:

  1. Starting with 1, the name of all GUI elements match their position in the grid
  2. Left: The item to the left will always be numbered 1 less than the current element
  3. Right: The item to the left will always be numbered 1 more than the current element
  4. Up: The item above (up) will always be number of GUIs in a row 1 less than the current element
  5. Down: The item below (down) will always be the number of GUIs in a row more than the current element This logic also allows for the GUI elements at the begging and end of rows (excluding the first and last element) to wrap around to the next and previous rows. If an element doesn't exist to the left, right, up, or down, the NextSelection will remain nil and moving the Gamepad selector in the direction will not change the selected GUI.

This example also contains code to test the grid using the arrow keys (Up, Down, Left, Right) of your keyboard instead of a gamepad, just in case you don't have a gamepad to test with. This portion of code initially selects the element named "1" by assigning it to the GuiService.SelectedObject property.

Creating a Gamepad Selection Grid

-- Setup the Gamepad selection grid using the code below
local container = script.Parent:FindFirstChild("Container")
local grid = container:GetChildren()
local rowSize = container:FindFirstChild("UIGridLayout").FillDirectionMaxCells
for _, gui in pairs(grid) do
if gui:IsA("GuiObject") then
local pos = gui.Name
-- Left edge
gui.NextSelectionLeft = container:FindFirstChild(pos - 1)
-- Right edge
gui.NextSelectionRight = container:FindFirstChild(pos + 1)
-- Above
gui.NextSelectionUp = container:FindFirstChild(pos - rowSize)
-- Below
gui.NextSelectionDown = container:FindFirstChild(pos + rowSize)
end
end
-- Test the Gamepad selection grid using the code below
local GuiService = game:GetService("GuiService")
local UserInputService = game:GetService("UserInputService")
GuiService.SelectedObject = container:FindFirstChild("1")
function updateSelection(input)
if input.UserInputType == Enum.UserInputType.Keyboard then
local key = input.KeyCode
local selectedObject = GuiService.SelectedObject
if not selectedObject then
return
end
if key == Enum.KeyCode.Up then
if not selectedObject.NextSelectionUp then
GuiService.SelectedObject = selectedObject
end
elseif key == Enum.KeyCode.Down then
if not selectedObject.NextSelectionDown then
GuiService.SelectedObject = selectedObject
end
elseif key == Enum.KeyCode.Left then
if not selectedObject.NextSelectionLeft then
GuiService.SelectedObject = selectedObject
end
elseif key == Enum.KeyCode.Right then
if not selectedObject.NextSelectionRight then
GuiService.SelectedObject = selectedObject
end
end
end
end
UserInputService.InputBegan:Connect(updateSelection)

NextSelectionLeft

並列読み取り

このプロパティは、ユーザーがゲームパッドセレクターを左に移動させたときに選択される を設定します。このプロパティが空である場合、ゲームパッドを左に移動しても選択された GUI は変更されません。

ゲームパッドセレクターを左に移動すると、GUIが GuiService.SelectedObject でない限り、このオブジェクトに Selectable が設定されます。このプロパティは、Selectable ではない場合でも GUI 要素に設定できるため、GUI の選択可能なプロパティの値が期待した動作と一致するようにしてください。

See also NextSelectionUp , NextSelectionDown , そして NextSelectionRight

コードサンプル

This example demonstrates how to enable Gamepad navigation through a grid of GuiObject|GUI elements without manually having to connect the GuiObject.NextSelectionUp, GuiObject.NextSelectionDown, and GuiObject|NextSelectionRight, and GuiObject.NextSelectionLeft properties for every element in the grid.

Note that this code sample assumes your UIGridLayout is sorted by name, where elements are named in successive numerical order.

The code relies on this to set the NextSelection properties for all GuiObjects in the same level as the UIGridLayout. In our example, the UIGridLayoutObject and GUI elements within the grid are all children of a Frame named "Container". The code gets the children of "Container" and loops through each child. Children that are not GuiObjects are ignored. For each GUI element, the code attempts to assigned the NextSelection properties using the following logic:

  1. Starting with 1, the name of all GUI elements match their position in the grid
  2. Left: The item to the left will always be numbered 1 less than the current element
  3. Right: The item to the left will always be numbered 1 more than the current element
  4. Up: The item above (up) will always be number of GUIs in a row 1 less than the current element
  5. Down: The item below (down) will always be the number of GUIs in a row more than the current element This logic also allows for the GUI elements at the begging and end of rows (excluding the first and last element) to wrap around to the next and previous rows. If an element doesn't exist to the left, right, up, or down, the NextSelection will remain nil and moving the Gamepad selector in the direction will not change the selected GUI.

This example also contains code to test the grid using the arrow keys (Up, Down, Left, Right) of your keyboard instead of a gamepad, just in case you don't have a gamepad to test with. This portion of code initially selects the element named "1" by assigning it to the GuiService.SelectedObject property.

Creating a Gamepad Selection Grid

-- Setup the Gamepad selection grid using the code below
local container = script.Parent:FindFirstChild("Container")
local grid = container:GetChildren()
local rowSize = container:FindFirstChild("UIGridLayout").FillDirectionMaxCells
for _, gui in pairs(grid) do
if gui:IsA("GuiObject") then
local pos = gui.Name
-- Left edge
gui.NextSelectionLeft = container:FindFirstChild(pos - 1)
-- Right edge
gui.NextSelectionRight = container:FindFirstChild(pos + 1)
-- Above
gui.NextSelectionUp = container:FindFirstChild(pos - rowSize)
-- Below
gui.NextSelectionDown = container:FindFirstChild(pos + rowSize)
end
end
-- Test the Gamepad selection grid using the code below
local GuiService = game:GetService("GuiService")
local UserInputService = game:GetService("UserInputService")
GuiService.SelectedObject = container:FindFirstChild("1")
function updateSelection(input)
if input.UserInputType == Enum.UserInputType.Keyboard then
local key = input.KeyCode
local selectedObject = GuiService.SelectedObject
if not selectedObject then
return
end
if key == Enum.KeyCode.Up then
if not selectedObject.NextSelectionUp then
GuiService.SelectedObject = selectedObject
end
elseif key == Enum.KeyCode.Down then
if not selectedObject.NextSelectionDown then
GuiService.SelectedObject = selectedObject
end
elseif key == Enum.KeyCode.Left then
if not selectedObject.NextSelectionLeft then
GuiService.SelectedObject = selectedObject
end
elseif key == Enum.KeyCode.Right then
if not selectedObject.NextSelectionRight then
GuiService.SelectedObject = selectedObject
end
end
end
end
UserInputService.InputBegan:Connect(updateSelection)

NextSelectionRight

並列読み取り

このプロパティは、ユーザーがゲームパッドセレクターを右に移動させたときに選択される を設定します。このプロパティが空である場合、ゲームパッドを右に移動しても選択された GUI は変更されません。

ゲームパッドセレクターを右に移動すると、GUIが GuiService.SelectedObject でない限り、このオブジェクトに Selectable を設定します。このプロパティは、Selectable ではない場合でも GUI 要素に設定できるため、GUI の選択可能なプロパティの値が期待した動作と一致するようにしてください。

See also NextSelectionUp , NextSelectionDown , そして NextSelectionLeft

コードサンプル

This example demonstrates how to enable Gamepad navigation through a grid of GuiObject|GUI elements without manually having to connect the GuiObject.NextSelectionUp, GuiObject.NextSelectionDown, and GuiObject|NextSelectionRight, and GuiObject.NextSelectionLeft properties for every element in the grid.

Note that this code sample assumes your UIGridLayout is sorted by name, where elements are named in successive numerical order.

The code relies on this to set the NextSelection properties for all GuiObjects in the same level as the UIGridLayout. In our example, the UIGridLayoutObject and GUI elements within the grid are all children of a Frame named "Container". The code gets the children of "Container" and loops through each child. Children that are not GuiObjects are ignored. For each GUI element, the code attempts to assigned the NextSelection properties using the following logic:

  1. Starting with 1, the name of all GUI elements match their position in the grid
  2. Left: The item to the left will always be numbered 1 less than the current element
  3. Right: The item to the left will always be numbered 1 more than the current element
  4. Up: The item above (up) will always be number of GUIs in a row 1 less than the current element
  5. Down: The item below (down) will always be the number of GUIs in a row more than the current element This logic also allows for the GUI elements at the begging and end of rows (excluding the first and last element) to wrap around to the next and previous rows. If an element doesn't exist to the left, right, up, or down, the NextSelection will remain nil and moving the Gamepad selector in the direction will not change the selected GUI.

This example also contains code to test the grid using the arrow keys (Up, Down, Left, Right) of your keyboard instead of a gamepad, just in case you don't have a gamepad to test with. This portion of code initially selects the element named "1" by assigning it to the GuiService.SelectedObject property.

Creating a Gamepad Selection Grid

-- Setup the Gamepad selection grid using the code below
local container = script.Parent:FindFirstChild("Container")
local grid = container:GetChildren()
local rowSize = container:FindFirstChild("UIGridLayout").FillDirectionMaxCells
for _, gui in pairs(grid) do
if gui:IsA("GuiObject") then
local pos = gui.Name
-- Left edge
gui.NextSelectionLeft = container:FindFirstChild(pos - 1)
-- Right edge
gui.NextSelectionRight = container:FindFirstChild(pos + 1)
-- Above
gui.NextSelectionUp = container:FindFirstChild(pos - rowSize)
-- Below
gui.NextSelectionDown = container:FindFirstChild(pos + rowSize)
end
end
-- Test the Gamepad selection grid using the code below
local GuiService = game:GetService("GuiService")
local UserInputService = game:GetService("UserInputService")
GuiService.SelectedObject = container:FindFirstChild("1")
function updateSelection(input)
if input.UserInputType == Enum.UserInputType.Keyboard then
local key = input.KeyCode
local selectedObject = GuiService.SelectedObject
if not selectedObject then
return
end
if key == Enum.KeyCode.Up then
if not selectedObject.NextSelectionUp then
GuiService.SelectedObject = selectedObject
end
elseif key == Enum.KeyCode.Down then
if not selectedObject.NextSelectionDown then
GuiService.SelectedObject = selectedObject
end
elseif key == Enum.KeyCode.Left then
if not selectedObject.NextSelectionLeft then
GuiService.SelectedObject = selectedObject
end
elseif key == Enum.KeyCode.Right then
if not selectedObject.NextSelectionRight then
GuiService.SelectedObject = selectedObject
end
end
end
end
UserInputService.InputBegan:Connect(updateSelection)

NextSelectionUp

並列読み取り

このプロパティは、ユーザーがゲームパッドセレクターを上に移動するときに選択される を設定します。このプロパティが空である場合、ゲームパッドを上に移動しても選択された GUI は変更されません。

ゲームパッドセレクターを上に移動すると、GUI が GuiService.SelectedObject でない限り、このオブジェクトに Selectable を設定します。このプロパティは、Selectable ではない場合でも GUI 要素に設定できるため、GUI の選択可能なプロパティの値が期待した動作と一致するようにしてください。

参照してください NextSelectionDown , NextSelectionLeft , NextSelectionRight .

コードサンプル

This example demonstrates how to enable Gamepad navigation through a grid of GuiObject|GUI elements without manually having to connect the GuiObject.NextSelectionUp, GuiObject.NextSelectionDown, and GuiObject|NextSelectionRight, and GuiObject.NextSelectionLeft properties for every element in the grid.

Note that this code sample assumes your UIGridLayout is sorted by name, where elements are named in successive numerical order.

The code relies on this to set the NextSelection properties for all GuiObjects in the same level as the UIGridLayout. In our example, the UIGridLayoutObject and GUI elements within the grid are all children of a Frame named "Container". The code gets the children of "Container" and loops through each child. Children that are not GuiObjects are ignored. For each GUI element, the code attempts to assigned the NextSelection properties using the following logic:

  1. Starting with 1, the name of all GUI elements match their position in the grid
  2. Left: The item to the left will always be numbered 1 less than the current element
  3. Right: The item to the left will always be numbered 1 more than the current element
  4. Up: The item above (up) will always be number of GUIs in a row 1 less than the current element
  5. Down: The item below (down) will always be the number of GUIs in a row more than the current element This logic also allows for the GUI elements at the begging and end of rows (excluding the first and last element) to wrap around to the next and previous rows. If an element doesn't exist to the left, right, up, or down, the NextSelection will remain nil and moving the Gamepad selector in the direction will not change the selected GUI.

This example also contains code to test the grid using the arrow keys (Up, Down, Left, Right) of your keyboard instead of a gamepad, just in case you don't have a gamepad to test with. This portion of code initially selects the element named "1" by assigning it to the GuiService.SelectedObject property.

Creating a Gamepad Selection Grid

-- Setup the Gamepad selection grid using the code below
local container = script.Parent:FindFirstChild("Container")
local grid = container:GetChildren()
local rowSize = container:FindFirstChild("UIGridLayout").FillDirectionMaxCells
for _, gui in pairs(grid) do
if gui:IsA("GuiObject") then
local pos = gui.Name
-- Left edge
gui.NextSelectionLeft = container:FindFirstChild(pos - 1)
-- Right edge
gui.NextSelectionRight = container:FindFirstChild(pos + 1)
-- Above
gui.NextSelectionUp = container:FindFirstChild(pos - rowSize)
-- Below
gui.NextSelectionDown = container:FindFirstChild(pos + rowSize)
end
end
-- Test the Gamepad selection grid using the code below
local GuiService = game:GetService("GuiService")
local UserInputService = game:GetService("UserInputService")
GuiService.SelectedObject = container:FindFirstChild("1")
function updateSelection(input)
if input.UserInputType == Enum.UserInputType.Keyboard then
local key = input.KeyCode
local selectedObject = GuiService.SelectedObject
if not selectedObject then
return
end
if key == Enum.KeyCode.Up then
if not selectedObject.NextSelectionUp then
GuiService.SelectedObject = selectedObject
end
elseif key == Enum.KeyCode.Down then
if not selectedObject.NextSelectionDown then
GuiService.SelectedObject = selectedObject
end
elseif key == Enum.KeyCode.Left then
if not selectedObject.NextSelectionLeft then
GuiService.SelectedObject = selectedObject
end
elseif key == Enum.KeyCode.Right then
if not selectedObject.NextSelectionRight then
GuiService.SelectedObject = selectedObject
end
end
end
end
UserInputService.InputBegan:Connect(updateSelection)

Position

並列読み取り

このプロパティは、GuiObject ピクセルとスカラー位置を決定し、UDim2 を使用します。位置はオブジェクトのGuiObject.AnchorPoint のまわりに中央化されます。

スカラー位置は、親の GUI 要素のサイズに対して相対的である場合があります。

UDim2 値のピクセル部分は、親の GUI のサイズに関係なく同じです。値は、ピクセルでオブジェクトの位置を表します。オブジェクトの実際のピクセル位置は、GuiBase2d.AbsolutePosition プロパティから読み込むことができます。

Rotation

並列読み取り

このプロパティは、GuiObject が回転する度数の数を決定します。回転はオブジェクトの 中心 に対するもので、 は ではなく、つまり回転ポイントを変更することはできません。さらに、このプロパティは ClipsDescendants と互換性がありません。

Selectable

並列読み取り

このプロパティは、ゲームパッドを使用してGUIをナビゲートする際に GuiObject が選択できるかどうかを決定します。

このプロパティが true である場合、GUI が選択されます。GUI を選択すると、GuiService.SelectedObject プロパティもそのオブジェクトに設定されます。

これが false であると、GUI は選択できません。しかし、GUI が選択されたときにこれを false に設定すると、選択を解除したり GuiService.SelectedObject プロパティの値を変更したりすることはありません。

Add GuiObject.SelectionGainedGuiObject.SelectionLost を追加すると、要素には発射しません。GUIオブジェクトを選択解除するには、GuiService.SelectedObject プロパティを変更する必要があります。

このプロパティは、GUI がこのようなプロパティ (GuiObject.NextSelectionUpGuiObject.NextSelectionDownNextSelectionRight、または NextSelectionLeft ) を介して複数の GUI に接続されている場合、便利です。ゲームパッドが GUI を選択できないようにするために、すべてのプロパティを変更するのではなく、選択可能なプロパティを一時的に無効にして、選択を防ぐことができます。次に、ゲームパッドセレクタが GUI を選択できるようにしたいときは、選択可能なプロパティを再び有効にするだけです。

コードサンプル

The example below offers a simple demonstration on how to use the GuiObject.Selectable property to limit when a GUI element can be selected by the Gamepad navigator.

When a TextBox has gains focus, it can be selected. However, when a TextBox loses focus it can no longer be selected.

Although this is a simple demonstration, the property can also be used to prevent the navigator from selecting UI elements that exist for cosmetic rather than functional purposes. For instance, while the buttons on a menu screen should be selectable, the title image should not be.

Limiting TextBox Selection

local GuiService = game:GetService("GuiService")
local textBox = script.Parent
local function gainFocus()
textBox.Selectable = true
GuiService.SelectedObject = textBox
end
local function loseFocus(_enterPressed, _inputObject)
GuiService.SelectedObject = nil
textBox.Selectable = false
end
-- The FocusLost and FocusGained event will fire because the textBox
-- is of type TextBox
textBox.Focused:Connect(gainFocus)
textBox.FocusLost:Connect(loseFocus)

SelectionImageObject

並列読み取り

このプロパティは、ゲームパッドに使用されるデフォルトの選択装飾を上書きします。

選択された SelectionImageObject オーバーレイは、選択された GuiObject に画像の Size をオーバーライドします。最高の結果を得るには、スケール SelectionImageObject 値を介してカスタム UDim2 をサイズする必要があり、選択した要素でオブジェクトが適切にスケールすることを保証するのに役立ちます。

SelectionImageObject を変更すると、GuiObject 要素のみに影響します。すべてのユーザーのGUI要素に影響を与えるには、PlayerGui.SelectionImageObject プロパティを設定します。

ユーザーが選択した GUI 要素を決定または設定するには、GuiService.SelectedObject プロパティを使用できます。プレイヤーはゲームパッドを使用して、異なる GUI 要素を選択し、NextSelectionUpNextSelectionDownNextSelectionLeft、およびNextSelectionRightイベントを呼び出します。

SelectionOrder

並列読み取り

ゲームパッドの選択を開始するか、祖先に GuiService:Select() を呼び出すとき、選択順序が低い GuiObjects が、選択順序が高い GuiObjects よりも早く選択されます。このプロパティは方向ナビゲーションに影響しません。デフォルト値は 0 です。

Size

並列読み取り

このプロパティは、 を使用して、スケーラーとピクセルサイズを決定します。

スケーラーサイズは、親の GUI 要素のサイズに対して相対的である場合があります。

UDim2 値のピクセル部分は、親の GUI のサイズに関係なく同じです。値は、ピクセルでオブジェクトのサイズを表します。オブジェクトの実際のピクセルサイズは、GuiBase2d.AbsoluteSize プロパティから読み込むことができます。

GuiObject に親がある場合、各軸のサイズも親の SizeConstraint に影響を受けます。

コードサンプル

This code sample allows you to create a simple color-changing health bar using two nested Frames. Paste this into a LocalScript on the inner frame.

Health Bar

local Players = game:GetService("Players")
local player = Players.LocalPlayer
-- Paste script into a LocalScript that is
-- parented to a Frame within a Frame
local frame = script.Parent
local container = frame.Parent
container.BackgroundColor3 = Color3.new(0, 0, 0) -- black
-- This function is called when the humanoid's health changes
local function onHealthChanged()
local human = player.Character.Humanoid
local percent = human.Health / human.MaxHealth
-- Change the size of the inner bar
frame.Size = UDim2.new(percent, 0, 1, 0)
-- Change the color of the health bar
if percent < 0.1 then
frame.BackgroundColor3 = Color3.new(1, 0, 0) -- black
elseif percent < 0.4 then
frame.BackgroundColor3 = Color3.new(1, 1, 0) -- yellow
else
frame.BackgroundColor3 = Color3.new(0, 1, 0) -- green
end
end
-- This function runs is called the player spawns in
local function onCharacterAdded(character)
local human = character:WaitForChild("Humanoid")
-- Pattern: update once now, then any time the health changes
human.HealthChanged:Connect(onHealthChanged)
onHealthChanged()
end
-- Connect our spawn listener; call it if already spawned
player.CharacterAdded:Connect(onCharacterAdded)
if player.Character then
onCharacterAdded(player.Character)
end

SizeConstraint

並列読み取り

このプロパティは、Size 親のサイズに対して、GuiObject が基づく軸を設定します。

このプロパティは、親オブジェクトの幅 または 高さでスケールする GUI オブジェクトを作成するのに便利で、効果的にオブジェクトのアスペクト比を保持します。

Transparency

非表示
複製されていません
並列読み取り

BackgroundTransparencyTextTransparency の混合プロパティ。

Visible

並列読み取り

このプロパティは、GuiObject とその子孫がレンダリングされるかどうかです。

GuiObject の個々のコンポーネントのレンダリングは、透明性プロパティのように個別に制御できます GuiObject.BackgroundTransparencyTextLabel.TextTransparencyImageLabel.ImageTransparency

このプロパティが false になると、GuiObject は、UIListLayoutUIGridLayout 、および UITableLayout などのレイアウト構造によって無視されます。言い換えれば、要素が通常レイアウトで占有するスペースは、他の要素に代わって使用されます。

コードサンプル

This code sample adds open/close functionality to a Window UI. Paste as a LocalScript that is a sibling of a Frame named Window, a TextButton/ImageButton named Window, and a TextButton/ImageButton within the Window called Close.

UI Window

local gui = script.Parent
local window = gui:WaitForChild("Window")
local toggleButton = gui:WaitForChild("ToggleWindow")
local closeButton = window:WaitForChild("Close")
local function toggleWindowVisbility()
-- Flip a boolean using the `not` keyword
window.Visible = not window.Visible
end
toggleButton.Activated:Connect(toggleWindowVisbility)
closeButton.Activated:Connect(toggleWindowVisbility)

ZIndex

並列読み取り

このプロパティは、GuiObject が他のものに対してどの順序でレンダリングされるかを決定します。

デフォルトでは、GuiObjects 低い ZIndex 値を持つものが、より高い値を持つものの下でレンダリングされる上昇順の優先順位でレンダリングされます。レンダリング順序を変更するには、ScreenGuiSurfaceGui、またはBillboardGuiの値を変更して、そのZIndexBehaviorの値を変更します。

将来、2つの既存の要素間に要素を追加する必要があるかどうか不明な場合は、100 (0100200、など) の倍数を使用するのが良い習慣です。これにより、他の要素の間にレイヤー化された要素に使用できるレンダリング順序値の大きなギャップが保たれます。

また、レイアウト構造のようなものを使用すると、LayoutOrderソート順序 を制御することに注意してください。例えば、GuiObject または UIListLayout などのレイアウト構造を使用すると、UIGridLayout のような順序でソートされます。

方法

TweenPosition

指定された UDim2Enum.EasingDirection および Enum.EasingStyle を使用して、指定された時間内にGUIを新しい位置にスムーズに移動します。

この機能は、tween が再プレイするかどうかを返します。別の潜在層が GuiObject でアクションし、オーバーライドパラメータが false である場合、再生しません。

See also GuiObject:TweenSize()GuiObject:TweenSizeAndPosition()

パラメータ

endPosition: UDim2

GUI が移動する場所。

既定値: ""
easingDirection: Enum.EasingDirection

GUIを終了位置に簡素化する方向。

既定値: "Out"
easingStyle: Enum.EasingStyle

GUIをendPositionに簡単に移動するスタイル。

既定値: "Quad"
time: number

何秒かかり、減衰するまで完了するのか、ティーンの時間。

既定値: 1
override: boolean

ティーンが進行中のティーンをオーバーライドするかどうか。

既定値: false
callback: function

tweenが完了したときに実行するコールバック関数。

既定値: "nil"

戻り値

ティーンが再プレイするかどうか。

コードサンプル

This code sample demonstrates a more involved usage of TweenPosition by detecting when the tween completes/cancels by defining a callback function. It also prints whether the tween will play.

Tween a GUI's Position

local START_POSITION = UDim2.new(0, 0, 0, 0)
local GOAL_POSITION = UDim2.new(1, 0, 1, 0)
local guiObject = script.Parent
local function callback(state)
if state == Enum.TweenStatus.Completed then
print("The tween completed uninterrupted")
elseif state == Enum.TweenStatus.Canceled then
print("Another tween cancelled this one")
end
end
-- Initialize the GuiObject position, then start the tween:
guiObject.Position = START_POSITION
local willPlay = guiObject:TweenPosition(
GOAL_POSITION, -- Final position the tween should reach
Enum.EasingDirection.In, -- Direction of the easing
Enum.EasingStyle.Sine, -- Kind of easing to apply
2, -- Duration of the tween in seconds
true, -- Whether in-progress tweens are interrupted
callback -- Function to be callled when on completion/cancelation
)
if willPlay then
print("The tween will play")
else
print("The tween will not play")
end

TweenSize

指定された GuiObject を使用して、指定された UDim2Enum.EasingDirection で、指定された時間に新しい Enum.EasingStyle にサイズを変更します。

この機能は、tween が再生するかどうかを返します。通常、これは常に true を返すが、別のティーンがアクティブで、オーバーライドが false に設定されている場合は、false を返す。

See also GuiObject:TweenSize()GuiObject:TweenSizeAndPosition()

パラメータ

endSize: UDim2

GUI が再設定する必要があるサイズ。

既定値: ""
easingDirection: Enum.EasingDirection

GUIをendSizeに簡素化する方向。

既定値: "Out"
easingStyle: Enum.EasingStyle

GUIを endSize に簡素化するスタイル。

既定値: "Quad"
time: number

何秒かかり、減衰するまで完了するのか、ティーンの時間。

既定値: 1
override: boolean

ティーンが進行中のティーンをオーバーライドするかどうか。

既定値: false
callback: function

tweenが完了したときに実行するコールバック関数。

既定値: "nil"

戻り値

ティーンが再プレイするかどうか。

コードサンプル

This code sample demonstrates the usage of the GuiObject:TweenSize() function. It initiates an animation on the parent's GuiObject.Size property to UDim2.new(0.5, 0, 0.5, 0), which is half the GuiObject's parent size on both axes.

Additionally, it demonstrates how the callback parameter can be used to detect when the tween stops (whether it was cancelled by another tween or completed).

Tween a GuiObject's Size

local guiObject = script.Parent
local function callback(didComplete)
if didComplete then
print("The tween completed successfully")
else
print("The tween was cancelled")
end
end
local willTween = guiObject:TweenSize(
UDim2.new(0.5, 0, 0.5, 0), -- endSize (required)
Enum.EasingDirection.In, -- easingDirection (default Out)
Enum.EasingStyle.Sine, -- easingStyle (default Quad)
2, -- time (default: 1)
true, -- should this tween override ones in-progress? (default: false)
callback -- a function to call when the tween completes (default: nil)
)
if willTween then
print("The GuiObject will tween")
else
print("The GuiObject will not tween")
end

TweenSizeAndPosition

指定された UDim2Enum.EasingDirection および Enum.EasingStyle を使用して、GUIを指定された時間内に新しいサイズと位置にスムーズに再設定します。

この機能は、tween が再生するかどうかを返します。通常、これは常に true を返すが、別のティーンがアクティブで、オーバーライドが false に設定されている場合は、false を返す。

See also GuiObject:TweenSize()GuiObject:TweenSizeAndPosition()

パラメータ

endSize: UDim2

GUI が再設定する必要があるサイズ。

既定値: ""
endPosition: UDim2

GUI が移動する場所。

既定値: ""
easingDirection: Enum.EasingDirection

GUIをendSizeendPositionに簡素化する方向。

既定値: "Out"
easingStyle: Enum.EasingStyle

GUIをendSizeendPositionに簡単にするスタイル。

既定値: "Quad"
time: number

何秒かかり、減衰するまで完了するのか、ティーンの時間。

既定値: 1
override: boolean

ティーンが進行中のティーンをオーバーライドするかどうか。

既定値: false
callback: function

tweenが完了したときに実行するコールバック関数。

既定値: "nil"

戻り値

ティーンが再プレイするかどうか。

コードサンプル

The below example would tween a Frame to the top left of the parent's size and resize it down to 0.

Tween a GUI's Size and Position

local frame = script.Parent.Frame
frame:TweenSizeAndPosition(UDim2.new(0, 0, 0, 0), UDim2.new(0, 0, 0, 0))

イベント

InputBegan

このイベントは、ユーザーが人間-コンピューターインターフェイスデバイス (マウスボタンダウン、タッチ開始、キーボードボタンダウンなど) を介して対話を開始すると発動します。

The UserInputService には、特定の UI 要素に制限されない同様の名前のイベントがあります:UserInputService.InputBegan

このイベントは、ゲーム状態に関わらず常に発動します。

See also GuiObject.InputEndedGuiObject.InputChanged

パラメータ

InputObject 、ユーザーの入力をクエリーするための有用なデータを含む、type of inputstate of input 、および screen coordinates of the input などのユーザーの入力。


コードサンプル

The following example demonstrates one of many usage examples of handling user input from InputBegan depending on its type.

In order for this to work as expected, it must be placed in a LocalScript and a child of gui.

Tracking the Beginning of Input on a GuiObject

-- In order to use the InputBegan event, you must specify the GuiObject
local gui = script.Parent
-- A sample function providing multiple usage cases for various types of user input
local function inputBegan(input)
if input.UserInputType == Enum.UserInputType.Keyboard then
print("A key is being pushed down! Key:", input.KeyCode)
elseif input.UserInputType == Enum.UserInputType.MouseButton1 then
print("The left mouse button has been pressed down at", input.Position)
elseif input.UserInputType == Enum.UserInputType.MouseButton2 then
print("The right mouse button has been pressed down at", input.Position)
elseif input.UserInputType == Enum.UserInputType.Touch then
print("A touchscreen input has started at", input.Position)
elseif input.UserInputType == Enum.UserInputType.Gamepad1 then
print("A button is being pressed on a gamepad! Button:", input.KeyCode)
end
end
gui.InputBegan:Connect(inputBegan)

InputChanged

このイベントは、ユーザーが人間-コンピューターインターフェイスデバイス (マウスボタンダウン、タッチ開始、キーボードボタンダウンなど) を介して相互作用する方法を変更したときに発動します。

The UserInputService には、特定の UI 要素に制限されない同様の名前のイベントがあります:UserInputService.InputChanged

このイベントは、ゲーム状態に関わらず常に発動します。

See also GuiObject.InputBeganGuiObject.InputEnded

パラメータ

InputObject 、ユーザーの入力をクエリーするための有用なデータを含む、type of inputstate of input 、および screen coordinates of the input などのユーザーの入力。


コードサンプル

The following example demonstrates one of many usage examples of handling user input from InputChanged depending on its type.

In order for this to work as expected, it must be placed in a LocalScript and a child of gui.

GuiObject InputChanged Demo

local UserInputService = game:GetService("UserInputService")
local gui = script.Parent
local function printMovement(input)
print("Position:", input.Position)
print("Movement Delta:", input.Delta)
end
local function inputChanged(input)
if input.UserInputType == Enum.UserInputType.MouseMovement then
print("The mouse has been moved!")
printMovement(input)
elseif input.UserInputType == Enum.UserInputType.MouseWheel then
print("The mouse wheel has been scrolled!")
print("Wheel Movement:", input.Position.Z)
elseif input.UserInputType == Enum.UserInputType.Gamepad1 then
if input.KeyCode == Enum.KeyCode.Thumbstick1 then
print("The left thumbstick has been moved!")
printMovement(input)
elseif input.KeyCode == Enum.KeyCode.Thumbstick2 then
print("The right thumbstick has been moved!")
printMovement(input)
elseif input.KeyCode == Enum.KeyCode.ButtonL2 then
print("The pressure being applied to the left trigger has changed!")
print("Pressure:", input.Position.Z)
elseif input.KeyCode == Enum.KeyCode.ButtonR2 then
print("The pressure being applied to the right trigger has changed!")
print("Pressure:", input.Position.Z)
end
elseif input.UserInputType == Enum.UserInputType.Touch then
print("The user's finger is moving on the screen!")
printMovement(input)
elseif input.UserInputType == Enum.UserInputType.Gyro then
local _rotInput, rotCFrame = UserInputService:GetDeviceRotation()
local rotX, rotY, rotZ = rotCFrame:toEulerAnglesXYZ()
local rot = Vector3.new(math.deg(rotX), math.deg(rotY), math.deg(rotZ))
print("The rotation of the user's mobile device has been changed!")
print("Position", rotCFrame.p)
print("Rotation:", rot)
elseif input.UserInputType == Enum.UserInputType.Accelerometer then
print("The acceleration of the user's mobile device has been changed!")
printMovement(input)
end
end
gui.InputChanged:Connect(inputChanged)

InputEnded

インプット終了イベントは、ユーザーが人間-コンピューターインターフェイスデバイス (マウスボタンを下、タッチ開始、キーボードボタンを下など) を介して交流を停止すると発動します。

The UserInputService には、特定の UI 要素に制限されない同様の名前のイベントがあります:UserInputService.InputEnded

このイベントは、ゲーム状態に関わらず常に発動します。

See also GuiObject.InputBeganGuiObject.InputChanged

パラメータ

InputObject 、ユーザーの入力をクエリーするための有用なデータを含む、Enum.UserInputTypeEnum.UserInputState 、および InputObject.Position などのユーザーの入力。


コードサンプル

The following example demonstrates one of many usage examples of handling user input from InputEnded depending on its type.

In order for this to work as expected, it must be placed in a LocalScript and a child of gui.

Tracking the End of Input on a GuiObject

-- In order to use the InputChanged event, you must specify a GuiObject
local gui = script.Parent
-- A sample function providing multiple usage cases for various types of user input
local function inputEnded(input)
if input.UserInputType == Enum.UserInputType.Keyboard then
print("A key has been released! Key:", input.KeyCode)
elseif input.UserInputType == Enum.UserInputType.MouseButton1 then
print("The left mouse button has been released at", input.Position)
elseif input.UserInputType == Enum.UserInputType.MouseButton2 then
print("The right mouse button has been released at", input.Position)
elseif input.UserInputType == Enum.UserInputType.Touch then
print("A touchscreen input has been released at", input.Position)
elseif input.UserInputType == Enum.UserInputType.Gamepad1 then
print("A button has been released on a gamepad! Button:", input.KeyCode)
end
end
gui.InputEnded:Connect(inputEnded)

MouseEnter

マウス入力イベントは、ユーザーがマウスを GuiObject 要素に移動させると発動します。

このイベントによって伝達された x および y 引数を使用して、ユーザーのマウスがGUIに入るときにユーザーの場所を決定するための確実な方法として信頼しないでください。これらの座標は、マウスが同じ端を介してGUIに入るときでも変わる可能性があります - 特に、マウスが素早く要素に入るときです。これは、座標がマウスがGUIに入る瞬間ではなく、イベントが発動したときのマウスの位置を示しているためです。

このイベントは、GUI 要素が別の要素の下でレンダリングされているときでも発動します。

ユーザーのマウスがGUI 要素から離れたときを追跡したい場合は、GuiObject.MouseLeave イベントを使用できます。

参照してください: See Also

パラメータ

マウスの X 画面座標は、画面の左上隅に対して、ピクセルです。

マウスの Y 画面座標は、画面の左上隅に対して、ピクセルです。


コードサンプル

The following example prints the mouse location, in pixels, when it enters GUI element.

Printing where a Mouse Enters a GuiObject

local guiObject = script.Parent
guiObject.MouseEnter:Connect(function(x, y)
print("The user's mouse cursor has entered the GuiObject at position", x, ",", y)
end)

MouseLeave

マウス離れイベントは、ユーザーがマウスを GuiObject 要素から移動させると発動します。

このイベントによって伝達された x および y 引数は、GUIを終了するときにユーザーのマウスがどこにあるかを決定するための確実な方法として信頼しないでください。これらの座標は、マウスが同じ端を介してGUIを離れたときでも変わる可能性があります - 特に、マウスが要素を迅速に離れるときです。これは、座標がマウスが GUI を離れる正確な瞬間ではなく、イベントが発動したときのマウスの位置を示しているためです。

このイベントは、GUI 要素が別の要素の下でレンダリングされているときでも発動します。

参照してください: See Also

パラメータ

マウスの X 画面座標は、画面の左上隅に対して、ピクセルです。

マウスの Y 画面座標は、画面の左上隅に対して、ピクセルです。


MouseMoved

ユーザーが GuiObject 要素の内部でマウスを移動するたびに発火します。ユーザーのマウスがGUI 要素の上にあるかどうかに関係なく発動する Mouse.Move と似ています。

注: このイベントは、マウスの位置が更新されると発動しますので、移動中に複数回発動します。

xy の引数は、ピクセルでユーザーのマウスの更新された画面座標を示します。これらは、グローバル変数で追跡されている場合、マウスの前の位置にGUI、画面、およびデルタを決定するのに役立つ可能性があります。

以下のコードは、ユーザーのマウスの Vector2 オフセットを GUI 要素に対してどのように決定するかを示しています:


local Players = game:GetService("Players")
local CustomScrollingFrame = script.Parent
local SubFrame = CustomScrollingFrame:FindFirstChild("SubFrame")
local mouse = Players.LocalPlayer:GetMouse()
local function getPosition(X, Y)
local gui_X = CustomScrollingFrame.AbsolutePosition.X
local gui_Y = CustomScrollingFrame.AbsolutePosition.Y
local pos = Vector2.new(math.abs(X - gui_X), math.abs(Y - gui_Y - 36))
print(pos)
end
CustomScrollingFrame.MouseMoved:Connect(getPosition)

このイベントは、ユーザーのマウスがGUI 要素に入力または出力するときに正確に発動しない可能性があることに注意してください。したがって、x および y 引数は、GUI の端の座標と完全に一致しない可能性があります。

参照してください: See Also

パラメータ

マウスの X 画面座標は、画面の左上隅に対して、ピクセルです。

マウスの Y 画面座標は、画面の左上隅に対して、ピクセルです。


MouseWheelBackward

ホイールバックワードイベントは、ユーザーがマウスホイールを戻すときに、マウスが GuiObject 要素の上にあるときに発動します。ユーザーのマウスがGUI 要素の上にあるかどうかに関係なく発動する Mouse.WheelBackward と似ています。

このイベントは、単に車輪の後退の指標として発動します。これは、x および y マウス座標引数が、このイベントの結果として変更されないことを意味します。これらの座標は、GuiObject.MouseMoved イベントで追跡できるマウスの移動時にのみ変更されます。

参照してください: See Also

パラメータ

マウスの X 画面座標は、画面の左上隅に対して、ピクセルです。

マウスの Y 画面座標は、画面の左上隅に対して、ピクセルです。


MouseWheelForward

ホイールフォワードイベントは、マウスが GuiObject 要素の上にあるときにユーザーがマウスホイールを前方にスクロールすると発動します。ユーザーのマウスがGUI 要素の上にあるかどうかに関係なく発動する Mouse.WheelForward と似ています。

このイベントは、単に車輪の前進移動の指標として発動します。これは、 X および Y マウス座標引数が、このイベントの結果として変更されないことを意味します。これらの座標は、GuiObject.MouseMoved イベントで追跡できるマウスの移動時にのみ変更されます。

参照してください: See Also

パラメータ

マウスの X 画面座標は、画面の左上隅に対して、ピクセルです。

ユーザーのマウスの Y 座標。


SelectionGained

このイベントは、ゲームパッドセレクターが GuiObject に焦点を合わせ始めると発動します。

ゲームパッドからチェックして、GUI 要素に焦点を合わせるのをやめたい場合は、GuiObject.SelectionLost イベントを使用できます。

GUI が選択焦点を獲得すると、SelectedObject プロパティの値もその選択に変更されます。どの GUI が選択を得たかを判断するには、このプロパティの値をチェックします。


コードサンプル

The following example prints a message when the user selects the object with a gamepad.

In order for this to work as expected, it must be placed in a LocalScript and a child of gui.

Handling GUI Selection Gained

local guiObject = script.Parent
local function selectionGained()
print("The user has selected this button with a gamepad.")
end
guiObject.SelectionGained:Connect(selectionGained)

SelectionLost

このイベントは、ゲームパッドセレクターが GuiObject に焦点を合わせるのをやめると発動します。

ゲームパッドからチェックして、GUI 要素に焦点を合わせ始めたい場合は、GuiObject.SelectionGained イベントを使用できます。

GUI が選択焦点を失ったとき、SelectionObject プロパティの値は nil または選択焦点を獲得する GUI 要素に変更されます。どの GUI が選択されたか、または選択されなかったかを決定するには、このプロパティの値をチェックします。


コードサンプル

The following example prints a message when the element has its focus lost on a gamepad.

In order for this to work as expected, it must be placed in a LocalScript and a child of gui.

Handling GUI Selection Lost

local guiObject = script.Parent
local function selectionLost()
print("The user no longer has this selected with their gamepad.")
end
guiObject.SelectionLost:Connect(selectionLost)

TouchLongPress

このイベントは、タッチ可能なデバイスを使用してプレイヤーがUI 要素に指を置いた後、短時間発生します。それは、ジェスチャーに関与する指の相対的な画面位置を説明する Vector2 テーブルで発射します。さらに、複数回発射します:Enum.UserInputState.Begin ブリーフな遅延の後、Enum.UserInputState.Change プレイヤーがジェスチャー中に指を動かすと、そして最後に Enum.UserInputState.End 。遅延はプラットフォームに依存します; Studio では 1 秒より長くなります。

このイベントは 1本の指のみが必要なので、このイベントはスタジオでエミュレータとマウスを使用してシミュレートできます。

パラメータ

touchPositions: Array

ジェスチャーに関与する指の相対的な位置を説明する Vector2 の配列が、 関連する

ジェスチャーの状態を説明する A Enum.UserInputState

  • ジェスチャーの開始時に一度、炎を開始する(短い遅延の後)
  • プレイヤーが指を押しながら動かすと、炎が変わる
  • 手を解放するときに、ジェスチャーが終わるときに炎を一度終わらせます。

コードサンプル

This code sample allows the player to manipulate the screen position of some UI element, like a Frame, by holding down on the UI element for a brief moment. Then, the player moves their finger and releases. During the gesture the Frame is colored blue with a white outline.

Move UI Element with TouchLongPress

local frame = script.Parent
frame.Active = true
local dragging = false
local basePosition
local startTouchPosition
local borderColor3
local backgroundColor3
local function onTouchLongPress(touchPositions, state)
if state == Enum.UserInputState.Begin and not dragging then
-- Start a drag
dragging = true
basePosition = frame.Position
startTouchPosition = touchPositions[1]
-- Color the frame to indicate the drag is happening
borderColor3 = frame.BorderColor3
backgroundColor3 = frame.BackgroundColor3
frame.BorderColor3 = Color3.new(1, 1, 1) -- White
frame.BackgroundColor3 = Color3.new(0, 0, 1) -- Blue
elseif state == Enum.UserInputState.Change then
local touchPosition = touchPositions[1]
local deltaPosition =
UDim2.new(0, touchPosition.X - startTouchPosition.X, 0, touchPosition.Y - startTouchPosition.Y)
frame.Position = basePosition + deltaPosition
elseif state == Enum.UserInputState.End and dragging then
-- Stop the drag
dragging = false
frame.BorderColor3 = borderColor3
frame.BackgroundColor3 = backgroundColor3
end
end
frame.TouchLongPress:Connect(onTouchLongPress)

TouchPan

このイベントは、タッチ可能なデバイスを使用して、プレイヤーがUI 要素に指を動かしたときに発動します。GuiObject.TouchSwipe が発射する直前に発射し、GuiObject.TouchTap では発射しません。このイベントは、プレイヤーが画面上の UI 要素の位置を操作できるようにするのに便利です。

このイベントは、ジェスチャーに関与する指の相対的な画面位置を説明する Vector2 テーブルで発動します。さらに、複数回発射します:Enum.UserInputState.Begin ブリーフな遅延の後、Enum.UserInputState.Change プレイヤーがジェスチャー中に指を動かすと、最後に Enum.UserInputState.End です。

このイベントは、エミュレータとマウスを使用して Studio でシミュレートすることはできません;発射するには、実際のタッチを有効にするデバイスが必要です。

パラメータ

touchPositions: Array

Luau 配列の Vector2 オブジェクト、それぞれが、ジェスチャーに関与するすべての指の位置を示します。

totalTranslation: Vector2

パンジェスチャーが開始点からどれほど進んだかを示します。

velocity: Vector2

各ディメンションでジェスチャーがどれほど迅速に実行されているかを示します。

ジェスチャーの Enum.UserInputState を示します。


コードサンプル

This code sample is meant to be placed in a LocalScript within an inner Frame that is inside an outer Frame, or other GuiObject. It allows the player to manipulate the position of the inner frame by moving their finger on the outer frame.

Panning UI Element

local innerFrame = script.Parent
local outerFrame = innerFrame.Parent
outerFrame.BackgroundTransparency = 0.75
outerFrame.Active = true
outerFrame.Size = UDim2.new(1, 0, 1, 0)
outerFrame.Position = UDim2.new(0, 0, 0, 0)
outerFrame.AnchorPoint = Vector2.new(0, 0)
outerFrame.ClipsDescendants = true
local dragging = false
local basePosition
local function onTouchPan(_touchPositions, totalTranslation, _velocity, state)
if state == Enum.UserInputState.Begin and not dragging then
dragging = true
basePosition = innerFrame.Position
outerFrame.BackgroundTransparency = 0.25
elseif state == Enum.UserInputState.Change then
innerFrame.Position = basePosition + UDim2.new(0, totalTranslation.X, 0, totalTranslation.Y)
elseif state == Enum.UserInputState.End and dragging then
dragging = false
outerFrame.BackgroundTransparency = 0.75
end
end
outerFrame.TouchPan:Connect(onTouchPan)

TouchPinch

このイベントは、タッチ可能なデバイスを使用して UI 要素にピンチまたは引っ張りジェスチャーを行うときに、2本の指を使用すると発動します。A ピンチ は、2つ以上の指が近づいて移動すると発生し、A 引っ張る は、それらが分離すると発生します。このイベントは、GuiObject.TouchPan と一緒に発動します。このイベントは、プレイヤーが画面上の UI 要素のスケール (サイズ) を操作できるようにするのに便利で、ほとんどがズーム機能として使用されます。

このイベントは、ジェスチャーに関与する指の相対的な画面位置を説明する Vector2 テーブルで発動します。さらに、複数回発射します:Enum.UserInputState.Begin ブリーフな遅延の後、Enum.UserInputState.Change プレイヤーがジェスチャー中に指を動かすと、最後に Enum.UserInputState.End です。スケールは 倍数で使用する必要があることに注意してください

このイベントは少なくとも2本の指が必要であるため、エミュレータとマウスを使用して Studio でシミュレートすることはできません; 実際にタッチが有効になっているデバイスが必要です。

パラメータ

touchPositions: Array

Luau 配列の Vector2 オブジェクト、それぞれがピンチジェスチャーに関与するすべての指の位置を示します。

scale: number

ピンチジェスチャーの開始からの違いを示す浮動。

velocity: number

ピンチジェスチャーがどれほど早く起こっているかを示す浮動。

ジェスチャーの Enum.UserInputState を示します。


コードサンプル

This code sample is meant for a LocalScript within an inner Frame that is inside an outer Frame, or other GuiObject. It allows the player to scale the inner frame by performing a GuiObject.TouchPinch gesture on the outer frame.

Pinch/Pull Scaling

local innerFrame = script.Parent
local outerFrame = innerFrame.Parent
outerFrame.BackgroundTransparency = 0.75
outerFrame.Active = true
outerFrame.Size = UDim2.new(1, 0, 1, 0)
outerFrame.Position = UDim2.new(0, 0, 0, 0)
outerFrame.AnchorPoint = Vector2.new(0, 0)
outerFrame.ClipsDescendants = true
local dragging = false
local uiScale = Instance.new("UIScale")
uiScale.Parent = innerFrame
local baseScale
local function onTouchPinch(_touchPositions, scale, _velocity, state)
if state == Enum.UserInputState.Begin and not dragging then
dragging = true
baseScale = uiScale.Scale
outerFrame.BackgroundTransparency = 0.25
elseif state == Enum.UserInputState.Change then
uiScale.Scale = baseScale * scale -- Notice the multiplication here
elseif state == Enum.UserInputState.End and dragging then
dragging = false
outerFrame.BackgroundTransparency = 0.75
end
end
outerFrame.TouchPinch:Connect(onTouchPinch)

TouchRotate

このイベントは、タッチ可能なデバイスを使用して UI 要素にピンチまたは引っ張りジェスチャーを行うときに、2本の指を使用すると発動します。回転は、2本指の間の線の角度が変更されたときに発生します。このイベントは、GuiObject.TouchPan と一緒に発動します。このイベントは、プレイヤーが画面上の UI 要素の回転を操作できるようにするのに便利です。

このイベントは、ジェスチャーに関与する指の相対的な画面位置を説明する Vector2 テーブルで発動します。さらに、複数回発射します:Enum.UserInputState.Begin ブリーフな遅延の後、Enum.UserInputState.Change プレイヤーがジェスチャー中に指を動かすと、最後に Enum.UserInputState.End です。

このイベントは少なくとも2本の指が必要であるため、エミュレータとマウスを使用して Studio でシミュレートすることはできません; 実際にタッチが有効になっているデバイスが必要です。

パラメータ

touchPositions: Array

Luau 配列の Vector2 オブジェクト、それぞれが、ジェスチャーに関与するすべての指の位置を示します。

rotation: number

ジェスチャー開始時から回転がどれほど進んだかを示す浮動。

velocity: number

ジェスチャーがどれほど素早く実行されているかを示す浮動。

ジェスチャーの Enum.UserInputState を示します。


コードサンプル

This code sample is meant for a LocalScript within an inner Frame that is inside an outer Frame, or other GuiObject. It allows the player to rotate the inner frame by performing a GuiObject.TouchRotate gesture on the outer frame.

Touch Rotation

local innerFrame = script.Parent
local outerFrame = innerFrame.Parent
outerFrame.BackgroundTransparency = 0.75
outerFrame.Active = true
outerFrame.Size = UDim2.new(1, 0, 1, 0)
outerFrame.Position = UDim2.new(0, 0, 0, 0)
outerFrame.AnchorPoint = Vector2.new(0, 0)
outerFrame.ClipsDescendants = true
local dragging = false
local baseRotation = innerFrame.Rotation
local function onTouchRotate(_touchPositions, rotation, _velocity, state)
if state == Enum.UserInputState.Begin and not dragging then
dragging = true
baseRotation = innerFrame.Rotation
outerFrame.BackgroundTransparency = 0.25
elseif state == Enum.UserInputState.Change then
innerFrame.Rotation = baseRotation + rotation
elseif state == Enum.UserInputState.End and dragging then
dragging = false
outerFrame.BackgroundTransparency = 0.75
end
end
outerFrame.TouchRotate:Connect(onTouchRotate)

TouchSwipe

このイベントは、タッチ可能なデバイスを使用して UI 要素にスワイプジェスチャーを実行すると発動します。This event fires when the player performs a swipe gesture on the UI element using a touch-enabled device.ジェスチャーの方向 (上、下、左、または右) と、ジェスチャーに関与するタッチポイントの数を指定して発射します。スワイプジェスチャーは、モバイル UI でタブを変更するのによく使用されます。

このイベントは 1本の指を必要とするので、スタジオでエミュレータとマウスを使用してシミュレートできます。

パラメータ

swipeDirection: Enum.SwipeDirection

A Enum.SwipeDirection スワイプジェスチャーの方向を示す (上、下、左または右)。

numberOfTouches: number

ジェスチャーに関与するタッチポイントの数 (通常 1)。


コードサンプル

This code sample will cause a Frame (or other GuiObject) to bounce when a swipe gesture is performed on a touch-enabled device (or Studio's emulator). Horizontal swipes will change the hue of the GuiObject.BackgroundColor3, while vertical swipes will change the saturation.

Bouncing Color Picker

local frame = script.Parent
frame.Active = true
-- How far the frame should bounce on a successful swipe
local BOUNCE_DISTANCE = 50
-- Current state of the frame
local basePosition = frame.Position
local hue = 0
local saturation = 128
local function updateColor()
frame.BackgroundColor3 = Color3.fromHSV(hue / 256, saturation / 256, 1)
end
local function onTouchSwipe(swipeDir, _touchCount)
-- Change the BackgroundColor3 based on the swipe direction
local deltaPos
if swipeDir == Enum.SwipeDirection.Right then
deltaPos = UDim2.new(0, BOUNCE_DISTANCE, 0, 0)
hue = (hue + 16) % 255
elseif swipeDir == Enum.SwipeDirection.Left then
deltaPos = UDim2.new(0, -BOUNCE_DISTANCE, 0, 0)
hue = (hue - 16) % 255
elseif swipeDir == Enum.SwipeDirection.Up then
deltaPos = UDim2.new(0, 0, 0, -BOUNCE_DISTANCE)
saturation = (saturation + 16) % 255
elseif swipeDir == Enum.SwipeDirection.Down then
deltaPos = UDim2.new(0, 0, 0, BOUNCE_DISTANCE)
saturation = (saturation - 16) % 255
else
deltaPos = UDim2.new()
end
-- Update the color and bounce the frame a little
updateColor()
frame.Position = basePosition + deltaPos
frame:TweenPosition(basePosition, Enum.EasingDirection.Out, Enum.EasingStyle.Bounce, 0.7, true)
end
frame.TouchSwipe:Connect(onTouchSwipe)
updateColor()

TouchTap

このイベントは、タッチ可能なデバイスを使用して UI 要素にタップジェスチャを実行すると発動します。This event fires when the player performs a tap gesture on the UI element using a touch-enabled device.タップは、移動が関与しないクイック単一タッチです (長押しは GuiObject.TouchLongPress を発射し、タッチ中に移動すると GuiObject.TouchPan と / または GuiObject.TouchSwipe が発射されます)。それは、ジェスチャーに関与する指の相対的な位置を説明する Vector2 オブジェクトのテーブルで発射します。

このイベントは 1本の指を必要とするので、スタジオでエミュレータとマウスを使用してシミュレートできます。

パラメータ

touchPositions: Array

ジェスチャーに関与する指の相対的な位置を説明する Vector2 の配列が、 関連する


コードサンプル

This code sample will toggle the GuiObject.BackgroundTransparency of a UI element, like a Frame, when it is tapped on a touch-enabled device.

Tap Transparency Toggle

local frame = script.Parent
frame.Active = true
local function onTouchTap()
-- Toggle background transparency
if frame.BackgroundTransparency > 0 then
frame.BackgroundTransparency = 0
else
frame.BackgroundTransparency = 0.75
end
end
frame.TouchTap:Connect(onTouchTap)