GuiObject

非推奨を表示

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

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

GuiObject は、2Dユーザーインターフェイスオブジェクトのグラフィック表示に関するすべてのプ

特別な方法でGUIオブジェクトのレイアウトを操作するには、リスト/フレックス またはグリッドなどのレイアウト構造を使用したり、見た目モディファイター を通じてコアプロパティの外にスタイルを設定できます。

Class.GuiObject.InputBegan|InputBegan と InputEnded を使用して、マウスボタンイベントを検出することはできますが、ImageButton および 1> Class.TextButton

概要

プロパティ

  • 並列読み取り

    この UI 要素が入力を沈めるかどうかを決定します。

  • 並列読み取り

    Class.GuiObject のオリジンポイントを決定し、相対的なサイズに対して Class.GuiObject のオリジンポイントを決定します。

  • 子コンテンツに基づいてサイズ変更が発生するかどうかを決定します。

  • 並列読み取り

    Class.GuiObject の背景色を決定します。

  • 並列読み取り

    Class.GuiObject の背景と境界を透明化する。

  • 並列読み取り

    Class.GuiObject ボーダーの色を決定します。

  • 並列読み取り

    Class.GuiObject ボーダーの位置相対を決定します。

  • 並列読み取り

    Class.GuiObject ボーダーのピクセル幅を決定します。

  • 並列読み取り

    親 GUI 要素の外にある子 GUI 要素がレンダリングするべきかどうかを決定します。

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

    プレイヤーのマウスが GuiObject 上で積極的に押されているかどうかを決定します。

  • 並列読み取り

    Class.GuiButton がインタラクト可能かどうかを決定します。GuiStateGuiObject が変更されているかどうか。

  • 並列読み取り

    Class.UIGridStyleLayout と一緒に使用されると、UIGridStyleLayout のソートオーダーを制御します。

  • 並列読み取り

    ゲームパッドのセレクターが下に移動すると、GuiObject が選択されます。

  • 並列読み取り

    ゲームパッドのセレクターが左に移動したときに選択される GuiObject を設定します。

  • 並列読み取り

    ゲームパッドのセレクターが右に移動したときに選択される GuiObject を設定します。

  • 並列読み取り

    ゲームパッドセレクターが上に移動すると、GuiObject が選択されます。

  • 並列読み取り

    Class.GuiObject のピクセルとスカラーポジションを決定します。

  • 並列読み取り

    Class.GuiObject が回転する度数を決定します。

  • 並列読み取り

    ゲームパッドで GUI を選択できるかどうかを決定します。

  • ゲームパッドのデフォルトの装飾をオーバーライドします。

  • 並列読み取り

    ゲームパッド UI の選択によって選択された GuiObjects のオーダー。

  • 並列読み取り

    Class.GuiObject のピクセルとスケーラーサイズを決定します。

  • 親のサイズに対応する SizeGuiObject 軸を設定します。

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

    Class.GuiObject.BackgroundTransparency|BackgroundTransparency と TextTransparency のミックスプロパティ。

  • 並列読み取り

    Class.GuiObject とその子孫がレンダリングされるかどうかを決定します。

  • 並列読み取り

    他の Class.GuiObject との相対位置で GuiObject がレンダリングされる順序を決定します。

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

方法

イベント

GuiBase2d から継承した イベント
  • SelectionChanged(amISelected : bool,previousSelection : GuiObject,newSelection : GuiObject):RBXScriptSignal

    ゲームパッドの選択が移動すると、退出します。または、接続された GuiBase2d または任意の子 GuiObjects 内で変更されます。

プロパティ

Active

並列読み取り

このプロパティは、この GuiObject が、基本モデルに ClickDetector クラスなど、3D 空間に入力を沈めるかどうかを決定します。つまり、プレイヤーがアクティブな UI 要素の上にマウスカーソルを置きながら、ディテクターにクリックしようとした場合

For GuiButton オブジェクト ( ImageButton

コードサンプル

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

並列読み取り

AnchorPoint プロパティは、GuiObject のオリジンポイントを決定します。GuiObject.Position に対する相対的なサイズに基づいて、エレメントの位置から起点を決定します。1>Class.GuiObject.Size1> のエクスポートは、4>Class.GuiObject.Position4> から、

詳しくは、ここ を参照してください。

コードサンプル

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 オブジェクトにダイナミックに追加できます。サイズは、そのコンテンツに対応するように調整されます。

AutomaticSize が Enum.AutomaticSize 以外の値に設定されているとき、この 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 、または 2>Class.TextLabel2> の背景の色とテキストの色が矛盾していることを確認してください。

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

また、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の背景と境界を透明にするかどうかを決定します。TextBoxTextButton、または2>Class.Gui</

このプロパティを 1 に設定すると、背景も境界もレンダリングされず、GUI の背景は完全に透明になります。

BorderColor3

並列読み取り

Class.GuiObject の四角いボーダーの色を決定します (ストロークカラーとしても知られ) このオブジェクトの GuiObject.BackgroundColor3 のプロパティは GuiObject.BorderSizePixel に設定されています。このオブジェクトのボーダーの色を見ることはできません。

Class.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 ボーダーを他のサイズにレイアウトする方法を決定します。

Class.UIStroke はこのプロパティを上書きして、より高度な境界エフェクトを許可します。

BorderSizePixel

並列読み取り

このプロパティは、GuiObject の境界レンダリングの幅をピクセル単位で設定します。これを 0 に設定すると、境界レンダリングを完全に無効にします。

Class.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エレメントの任意の部分をクリップするかどうかを決定します。

このプロパティはサポートされていません。GuiObject.Rotation は、このプロパティのサポートされていません。このプロパティには、非ゼロGuiObject.Rotation が含まれており、このプロパティの値にかかわらず、子孫ギューをレンダリングします。

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

Class.GuiObject の Class.Gui

Interactable

並列読み取り

Class.GuiButton がインタラクト可能かどうかを決定します。GuiStateGuiObject が変更されているかどうか。

On a GuiButton :

  • Class.GuiButton が GuiButton の設定を false に設定したとき、1>Class.GuiButton1> は再び押すことができませんおよび 4>Class.GuiButton4> は
  • Class.GuiButton が GuiButton の上に設定されると、true は 1>Class.GuiButton1> として再び正常に動作し、4>Class.GuiButton4> は 7>Class.GuiObject.GuiState|GuiState7> として再び正常に動作します。

On a GuiObject :

  • Class.GuiButton の上に設定された GuiButton は、false の上に設定された 1>Class.GuiObject.GuiState|GuiState1> を常に 4>Enumerate.GuiState.NonInteractable|NonInteractable4> に設定します。
  • Class.GuiButton の上に設定された GuiButton は、true が再び 1>Class.GuiObject.GuiState|GuiState1> に正常に動作するように設定されます。

LayoutOrder

並列読み取り

このプロパティは、GuiObject を使用している UIGridStyleLayoutUIListLayout などの 2>Class.UIGridStyleLayout2> のソートオーダーを制御

GuiObjects は、下の値が上の値より優先されるように、アルファベット順にソートされています。同じ値のオブジェクトは、追加された順に戻ります。

将来、2つの既存の要素間に追加する必要がある場合は、100 (0100、1> 2001>などの複数を使用することをお勧めします。これにより、レイアウトオーダー値の大きなギャップが確

また、ZIndex を参照して、オブジェクトの レンダリング オーダーを排序ではなく、表示 オーダーを決定します。

NextSelectionDown

並列読み取り

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

ゲームパッドのセレクターを下に移動すると、 GuiService.SelectedObject をこのオブジェクトに設定しません。たとえ GUI が Selectable でない場合でも、このプロパティを GUI エレメントに設定できます。注意して

また、NextSelectionUpNextSelectionLeft、および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

並列読み取り

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

ゲームパッドの選択器を左に移動すると、GuiService.SelectedObject は、GUIが Selectable でない場合、このオブジェクトに設定されません。このプロパティは、Selectable でない場合でも、期待され

また、NextSelectionUpNextSelectionDown、および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

並列読み取り

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

ゲームパッドの選択器を右に移動すると、GuiService.SelectedObject をこのオブジェクトに設定します。ただし、GUI が Selectable でない場合は、このプロパティを GUI エレメントに設定することができます。たと

また、NextSelectionUpNextSelectionDown、および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

並列読み取り

このプロパティは、ユーザーがゲームパッドの選択器を上に移動すると、 GuiObject を設定します。このプロパティが空の場合、ゲームパッドを上に移動すると、選択した GUI が変更されません。

ゲームパッドのセレクターを上に移動すると、GuiService.SelectedObject 、 Class.GuiObject.Selectable|Selectable ではありません。このプロパティは、 Class.GuiObject.Selectable|Selectable ではなく、1>

また、NextSelectionDownNextSelectionLeftNextSelectionRight を参照してください。

コードサンプル

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

並列読み取り

このプロパティは、<a href="https://developer.microsoft.com/en-us/microsoft-edge/microsoft-edge-common-皮膚-ホワイト/">Class.GuiObject\ ピクセルとスカラーポジションを使用して、<a href="https://developer.microsoft.com/en-us/microsoft-edge/microsoft-edge-common-スキン-ホワイト/">Class.GuiObject.AnchorPoint\ を中心に設定します。

ベクトル位置は、親 GUI 要素のサイズに対して相対です。

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

Rotation

並列読み取り

このプロパティは、GuiObject が回転する度に、Class.GuiObject.Center の中心に対する回転量を決定します。回転は、オブジェクトの中心ではなく、Class.GuiObject.AnchorPoint|AnchorPoint に対する量で

Selectable

並列読み取り

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

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

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

Class.GuiObject.SelectionGained と GuiObject.SelectionLost は、エレメントのために発動しません。GuiService.SelectedObject を選択すると、ギューオブジェクトを選択したオブジェクトのプロパティが変更されます。

このプロパティは、次の GUI を含む複数の 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 にオーバーレイされます。For best results, you should size the custom 1> SelectionImageObject1> via the scale 4> Datatype.UDim24> 값 to help ensure that

Class.Gui 要素の GuiObject を変更すると、その要素のみが影響を受けます。ユーザーの GUI 要素の全部に影響を与えるには、PlayerGui.SelectionImageObject プロパティを設定します。

ユーザーがどの GUI 要素を選択するかを判断または設定するには、GuiService.SelectedObject プロパティを使用できます。プレイヤーはゲームパッドを使用して異なる GUI

SelectionOrder

並列読み取り

選択オーダーが低い GuiObjects は、ゲームパッドの選択を開始するときに、高い選択オーダーの GuiObjects よりも早く選択されます。このプロパティは、ナビゲーション方向を変更することには影響しません。デフォルト値は 0 です。

Size

並列読み取り

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

サーベルサイズは、親 GUI 要素のサイズに相対しています。

Datatype.UDim2 のピクセル部分は、親 GUI のサイズにかかわらず同じです。ピクセルの値は、オブジェクトのピクセルサイズをピクセル単位で表示します。オブジェクトの実際のピクセルサイズは、GuiBase2d.AbsoluteSize プロパティから読み取ることができます。

Class.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 の アックスが親のサイズに対してベースになるようになります。

このプロパティは、親オブジェクトの幅 または 高さ の両方ではなく、オブジェクトの外観比率を効果的に保持するために使用されます。

Transparency

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

Class.GuiObject.BackgroundTransparency|BackgroundTransparency と TextTransparency のミックスプロパティ。

Visible

並列読み取り

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

Class.GuiObject の個々のコンポーネントのレンダリングは、透明プロパティ、例えば GuiObject.BackgroundTransparencyTextLabel.TextTransparency および 1>Class.ImageLabel.ImageTransparency1> を通じて個々に制御できます。

このプロパティが false であると、GuiObjectUIListLayout、および 1> Class.UITableLayout1> などのレイアウト構造によって、エレメントは無視されます。つまり、エレメントがレイアウトのス

コードサンプル

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 の値が最も低いものから優先順位の高い順序でレンダリングされます。ScreenGui、2>Class.SurfaceGui2>、または

将来、2つの既存の要素間に追加する必要がある場合は、100 (0100、1> 2001>などの複数を使用することをお勧めします。これにより、レンダリングオーダー値の大幅なギャップ

また、LayoutOrder を参照して、Class.GuiObject のソート順序を制御するレイアウト構造を使用している場合、GuiObject または 2>Class.UIGridLayout2> などのレイアウト構造を使用している場合、ソート順序を制御するための5>Class.

方法

TweenPosition

Smoothly moves a GUI to a new UDim2 position in the specified time using the specified Enum.EasingDirection and Enum.EasingStyle .

この関数は、tween がプレイするかどうかを返します。別の tween が GuiObject で動作している場合、オーバーライドパラメーターが偽であるため扮演しません。

参照してください:

パラメータ

endPosition: UDim2

GUI が移動する場所。

easingDirection: Enum.EasingDirection

GUI を endPosition に簡単に移動する方向。

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

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

既定値: "Quad"
time: number

ツインの完了にかかる時間(秒単位)。

既定値: 1
override: bool

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

既定値: 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

Smoothly resizes a GUI to a new UDim2 in the specified time using the specified Enum.EasingDirection and Enum.EasingStyle .

この関数は、ツイーンが再生するかどうかを返します。通常、これは常に true を返す必要がありますが、別のツイーンがアクティブであり、オーバーライドが false に設定されている場合は、ファルスを返します。

参照してください:

パラメータ

endSize: UDim2

GUI のサイズを変更する必要があります。

easingDirection: Enum.EasingDirection

GUIをendSizeに簡単に移動する方向。

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

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

既定値: "Quad"
time: number

ツインの完了にかかる時間(秒単位)。

既定値: 1
override: bool

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

既定値: 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

Smoothly resizes and moves a GUI to a new UDim2 size and position in the specified time using the specified Enum.EasingDirection and Enum.EasingStyle .

この関数は、ツイーンが再生するかどうかを返します。通常、これは常に true を返す必要がありますが、別のツイーンがアクティブであり、オーバーライドが false に設定されている場合は、ファルスを返します。

参照してください:

パラメータ

endSize: UDim2

GUI のサイズを変更する必要があります。

endPosition: UDim2

GUI が移動する場所。

easingDirection: Enum.EasingDirection

GUI を サイズ変更位置変更 の両方に向ける方向。

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

GUI を サイズ変更位置変更 の両方に簡単に移行するスタイル。

既定値: "Quad"
time: number

ツインの完了にかかる時間(秒単位)。

既定値: 1
override: bool

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

既定値: 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

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

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

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

参照してください:

パラメータ

Class.InputObject 、これは、ユーザーの入力を検索するための便利なデータを含む、type of inputstate of input および 1>Class.InputObj.Position|画面コーデントのクマ1> の。


コードサンプル

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

このイベントは、ユーザーが人間コンピューターインターフェースデバイス (マウスボタン、タッチ開始、キーボードボタンなど) を介してどのようにインタラクトするかを変更すると発生します。

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

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

参照してください:

パラメータ

Class.InputObject 、これは、ユーザーの入力を検索するための便利なデータを含む、type of inputstate of input および 1>Class.InputObj.Position|画面コーデントのクマ1> の。


コードサンプル

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

ユーザーが人間コンピューターインターフェイスデバイス (マウスボタン、タッチボタン、キーボードボタンなど) を介してインタラクトするのをやめると、InputEnded イベントが発動します。

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

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

参照してください:

パラメータ

Class.InputObject 、これは、ユーザーの入力を検索するための便利なデータを含む、type of inputstate of input および 1>Class.InputObj.Position|画面コーデントのクマ1> の。


コードサンプル

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

MouseEnter イベントは、ユーザーがマウスを GUI 要素に移動すると発動します。

このイベントによって、x および y 引数は、ユーザーのマウスが GUI に入るときにどこにマウスがあるかを判定するためのバカの方法として使用されています。これらのコーディネートは、マウスが GUI に

このイベントは、GUI 要素が別の要素の下にある場合でも発動します。

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

参照してください:

パラメータ

マウスの 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

MouseLeave イベントは、ユーザーが GUI 要素からマウスを移動したときに発動します。

このイベントによって、x および y 引数は、ユーザーのマウスが GUI を終了するときに、x という偽の方法でユーザーのマウスの位置を特定することがあります。これらのコーディネートは、マウ

このイベントは、GUI 要素が別の要素の下にある場合でも発動します。

参照してください:

パラメータ

マウスの X 画面コーディネートは、画面の左上隅に相対してピクセルで表示されます。

マウスの y 画面コーディネート、画面の左上隅に相対します。


MouseMoved

ユーザーが Class.GuiObject|GUI 要素の中にマウスを移動すると、発射されます。これは、ユーザーのマウスが GUI 要素の上にあるかどうかにかかわらず、 Class.Mouse.Move と同じです。

注、このイベントはマウスの位置が更新されると発動するので、移動中に繰り返し発動することになります。

The x および y 引数は、ユーザーのマウスのピクセルの更新された画面コーディネートを示します。これらは、マウスの位置をグローバル変数で追跡されている場合、GUI、画面、およびデルタでユーザーのマウスの位置を特定するのに便利です。

コードは、ユーザーのマウスの相対位置における Vector2 オフセットをユーザーのマウスのオーバーヘッドに示しています:


local CustomScrollingFrame = script.Parent
local SubFrame = CustomScrollingFrame:FindFirstChild("SubFrame")
local mouse = game.Players.LocalPlayer:GetMouse()
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の端に対して正確にマッチしない可能性があります。

参照してください:

パラメータ

マウスの X 画面コーディネートは、画面の左上隅に相対してピクセルで表示されます。

マウスの y 画面コーディネート、画面の左上隅に相対します。


MouseWheelBackward

ユーザーがマウスのホイールを GUI 要素の上にスクロールすると、ホイールバックイベントが発動します。これは、ユーザーのマウスが GUI 要素の上にあるかどうかにかかわらず、Mouse.WheelBackward が発動するのと同じです。

このイベントは、ホイールの後方の移動を表す単なるインジケーターとして発動します。これは、x と y マウスコーディネートの引数がこのイベントの結果として変更されることはありません。これらのコーディネートは、マウスが移動するときのみ変更されます、これは GuiObject.MouseMoved イベントで追跡できます。

参照してください:

パラメータ

マウスの X 画面コーディネートは、画面の左上隅に相対してピクセルで表示されます。

マウスの y 画面コーディネート、画面の左上隅に相対します。


MouseWheelForward

ユーザーがマウスのホイールを上にスクロールすると、GUI 要素の上にマウスのホイールをスクロールすると、Mouse.WheelForward が発動します。これは、ユーザーのマウスが GUI 要素の上にあるかどうかにかかわらず発動します。

このイベントは、車輪の前方の移動のインジケータとしてのみ発動します。これは、x と y のマウスコーディネートの引数がこのイベントの結果として変更されることはありません。これらのコーディネートは、マウスが移動するときのみ変更されます、GuiObject.MouseMoved イベントで追跡できます。

参照してください:

パラメータ

マウスの X 画面コーディネートは、画面の左上隅に相対してピクセルで表示されます。

ユーザーのマウスのコーディネート座標。


SelectionGained

このイベントは、Gamepad セレクターが GuiObject に焦点を合致させ始めると発生します。

ゲームパッドからチェックしたい場合は、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

このイベントは、Gamepad セレクターが GUI に焦点を合わせるのをやめると発生します。

ゲームパッドからチェックしたい場合は、GuiObject.SelectionGained イベントを使用してください。

GUIが選択フォーカスを失うと、SelectionObject プロパティの値が n または選択フォーカスを獲得したGUIエレメントに変更されます。選択フォークスを取得した 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

TouchLongPress イベントは、Touch-Enabled デバイスを使用して指を UI 要素に置くと、Vector2 の表を含む、手指が

このイベントは 1つの指であるため、このイベントは Studio でエミュレータとマウスを使用してシミュレートできます。

パラメータ

touchPositions: Array

Datatype.Vector2 の配列で、手の動きに関連する 相対 位置の指の位置を記述します。

ジェスチャーの状態を記述する Enum.UserInputState

  • スタート時に 1 回のファイアを開始します(ブリーフな遅延後)
  • プレイヤーが指を下に移動させると、ファイアーを変更する
  • 指を解放すると、エンドファイアを 1 回終えます。

コードサンプル

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

TouchPan イベントは、Touch-Enabled デバイスを使用して UI 要素に指を置くときに発動します。これは GuiObject.TouchSwipe が、および GuiObject.TouchTap が、と発動する直前です。このイベントは、プレイヤーが画面上のUI要素の位置を操作するために、Touch-

このイベントは、Vector2 という名前のテーブルにより発動しますが、関連する指の位置を説明するスクリーン位置の相対値を記述しています。さらに、多くの回数で発生します: Enum.UserInputState.Begin 後のブリーフデ

このイベントは、エミュレータとマウスを使用して Studio でシミュレートできません。実際のタッチを有効にしたデバイスを持っていなければ、発射できません。

パラメータ

touchPositions: Array

Datatype.Vector2 オブジェクト の Lua 配列、それぞれがスタイルの手の位置を示しています。

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

TouchPinchイベントは、プレイヤーが画面の要素に 2つの指を使用してピンチまたは引っ張り手势を行うときに発動します。TouchPinchイベントは、2つまたは以上の指が近づいているとき

このイベントは、Vector2 という名前のテーブルによって発動されますが、関連する指の位置を説明します。さらに、Enum.UserInputState.Begin 、Enuam.UserInputState.Change

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

パラメータ

touchPositions: Array

Datatype.Vector2 オブジェクトの Lua 配列、それぞれがピンチスタイルのすべての指の位置を示しています。

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

TouchRotate イベントは、GuiObject.TouchPan デバイスを使用して UI 要素のピンチまたは引っ張りを行うと発動します。このイベントは、Class.GuiObject.TouchPan との共同で使用されます。このイベントは、プレイヤーが画面のローテーションを操作することを許可する <

このイベントは、Vector2 という名前のテーブルにより発動しますが、関連する指の位置を説明するスクリーン位置の相対値を記述しています。さらに、多くの回数で発生します: Enum.UserInputState.Begin 後のブリーフデ

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

パラメータ

touchPositions: Array

Datatype.Vector2 オブジェクト の Lua 配列、それぞれがスタイルの手の位置を示しています。

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 要素にスワイプすると発動します。これは、スワイプの方向(上、下、左または右)とスワイプの参加度(1 以上)で発生します。タッチスワイプは通常、モバイル UI のタブを変更するために使用されます。

このイベントは 1つの指 だけを要するため、Studio でエミュレータとマウスを使用してシミュレートできます。

パラメータ

swipeDirection: Enum.SwipeDirection

上、下、左、または右のスワイプの方向を指している 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

TouchTap イベントは、Touch-Enabled デバイスを使用して UI 要素のタップジェスチャーを実行すると発動します。タップは、移動が関連することなくクイックな単一タップです(長押しすると <

このイベントは 1つの指 だけを要するため、Studio でエミュレータとマウスを使用してシミュレートできます。

パラメータ

touchPositions: Array

Datatype.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)