UITableLayout

사용되지 않는 항목 표시

*이 콘텐츠는 AI(베타)를 사용해 번역되었으며, 오류가 있을 수 있습니다. 이 페이지를 영어로 보려면 여기를 클릭하세요.

UITableLayout는 형제 UI 요소를 테이블의 행으로 배치합니다.이러한 행의 자식 UI 요소(테이블 셀)는 열(행 내)로 정렬됩니다.행 내의 각 셀은 높이가 동일하고 열 내의 각 셀은 너비가 동일합니다.

UIGridStyleLayout.FillDirection를 변경하여 형제 UI 요소가 대신 열로 작동할 수 있습니다.

적용되면 UITableLayout이 형제 요소와 세포 요소의 GuiObject.Size 및 GuiObject.Position를 제어합니다.속성 창에서 이를 변경하는 것은 여전히 가능하지만 효과가 없습니다.

결과 테이블의 세포 차원은 부모 UI 요소의 차원으로 제어됩니다.UITableLayout.FillEmptySpaceColumns 또는 UITableLayout.FillEmptySpaceRows 가 활성화되지 않으면 셀 크기는 부모 UI 요소의 것이고 (따라서 하나 이상의 셀이 부모 요소 밖으로 확장되는 테이블).

세포는 내부의 UISizeConstraint 개체를 계속 존중할 것입니다.즉, 헤더 셀 내에서 에 설정을 하면 나머지 세포의 크기를 결정할 수 있습니다.만약 UISizeConstraint.MaxSize 세포의 크기가 할당된 공간을 채우는 것을 제한한다면(즉다른 행/열이 더 넓으면 왼쪽 상단에 맞춥니다.

코드 샘플

This code sample builds a table of 4 rows, the first having headers. It does this using some for-loops and a UITableLayout. The widths of each column are set using UISizeConstraints.

Build UI Table
local frame = script.Parent



-- Table data

local headerWidth = { 200, 80, 80 }

local headers = {

	"Name",

	"Job",

	"Cash",

}

local data = {

	{ "Bob", "Waiter", 100 },

	{ "Lisa", "Police", 200 },

	{ "George", "-", 50 },

}



-- First, build the table layout

local uiTableLayout = Instance.new("UITableLayout")

uiTableLayout.FillDirection = Enum.FillDirection.Vertical

uiTableLayout.HorizontalAlignment = Enum.HorizontalAlignment.Center

uiTableLayout.VerticalAlignment = Enum.VerticalAlignment.Center

uiTableLayout.FillEmptySpaceColumns = false

uiTableLayout.FillEmptySpaceRows = false

uiTableLayout.Padding = UDim2.new(0, 5, 0, 5)

uiTableLayout.SortOrder = Enum.SortOrder.LayoutOrder

frame.Size = UDim2.new(0, 0, 0, 40) -- The Size of the parent frame is the cell size

uiTableLayout.Parent = frame



-- Next, create column headers

local headerFrame = Instance.new("Frame")

headerFrame.Name = "Headers"

headerFrame.Parent = frame

for i = 1, #headers do

	local headerText = headers[i]

	local headerCell = Instance.new("TextLabel")

	headerCell.Text = headerText

	headerCell.Name = headerText

	headerCell.LayoutOrder = i

	headerCell.Size = UDim2.new(0, 0, 0, 24)

	headerCell.Parent = headerFrame

	local headerSize = Instance.new("UISizeConstraint")

	headerSize.MinSize = Vector2.new(headerWidth[i], 0)

	headerSize.Parent = headerCell

end



-- Finally, add data rows by iterating over each row and the columns in that row

for index, value in ipairs(data) do

	local rowData = value

	local rowFrame = Instance.new("Frame")

	rowFrame.Name = "Row" .. index

	rowFrame.Parent = frame

	for col = 1, #value do

		local cellData = rowData[col]

		local cell = Instance.new("TextLabel")

		cell.Text = cellData

		cell.Name = headers[col]

		cell.TextXAlignment = Enum.TextXAlignment.Left

		if tonumber(cellData) then -- If this cell is a number, right-align it instead

			cell.TextXAlignment = Enum.TextXAlignment.Right

		end

		cell.ClipsDescendants = true

		cell.Size = UDim2.new(0, 0, 0, 24)

		cell.Parent = rowFrame

	end

end

요약

속성

  • FillEmptySpaceColumns:boolean
    병렬 읽기

    세포가 부모 UI 요소의 가로 공간을 차지하도록 크기가 조정되는지 여부를 결정합니다.

  • FillEmptySpaceRows:boolean
    병렬 읽기

    세포가 부모 UI 요소의 세로 공간을 차지하도록 크기가 조정되는지 여부를 결정합니다.

  • MajorAxis:Enum.TableMajorAxis
    병렬 읽기

    형제 UI 요소가 행이나 열로 처리되는지 여부를 결정합니다.

  • Padding:UDim2
    병렬 읽기

    세포 사이의 빈 공간을 결정합니다.

속성가 UIGridStyleLayout에서 상속되었습니다
Instance에서 상속된 모든 항목 보기
Object에서 상속된 모든 항목 보기

속성

FillEmptySpaceColumns

boolean
병렬 읽기

빈 공간 열을 채우기는 셀의 X 크기가 설정되어 부모 UI 요소의 전체 가로 공간이 사용되는지 여부를 결정합니다.이를 활성화하면 테이블이 더 쉽게 예측 가능한 수준의 가로 공간(부모 UI 요소의 X축 크기)을 차지하는지 확인할 수 있습니다.여전히 세포에 적용된 UISizeConstraint에 의해 언더플로/오버플로가 발생할 가능성이 있습니다.

이 속성을 활성화할 때 열 너비는 대략 부모의 GuiBase2d.AbsoluteSize .X 구성분을 열 수(패딩이나 다른 요소를 고려하지 않음)으로 나눈 것과 같습니다.

코드 샘플

This code sample builds a table of 4 rows, the first having headers. It does this using some for-loops and a UITableLayout. The widths of each column are set using UISizeConstraints.

Build UI Table
local frame = script.Parent



-- Table data

local headerWidth = { 200, 80, 80 }

local headers = {

	"Name",

	"Job",

	"Cash",

}

local data = {

	{ "Bob", "Waiter", 100 },

	{ "Lisa", "Police", 200 },

	{ "George", "-", 50 },

}



-- First, build the table layout

local uiTableLayout = Instance.new("UITableLayout")

uiTableLayout.FillDirection = Enum.FillDirection.Vertical

uiTableLayout.HorizontalAlignment = Enum.HorizontalAlignment.Center

uiTableLayout.VerticalAlignment = Enum.VerticalAlignment.Center

uiTableLayout.FillEmptySpaceColumns = false

uiTableLayout.FillEmptySpaceRows = false

uiTableLayout.Padding = UDim2.new(0, 5, 0, 5)

uiTableLayout.SortOrder = Enum.SortOrder.LayoutOrder

frame.Size = UDim2.new(0, 0, 0, 40) -- The Size of the parent frame is the cell size

uiTableLayout.Parent = frame



-- Next, create column headers

local headerFrame = Instance.new("Frame")

headerFrame.Name = "Headers"

headerFrame.Parent = frame

for i = 1, #headers do

	local headerText = headers[i]

	local headerCell = Instance.new("TextLabel")

	headerCell.Text = headerText

	headerCell.Name = headerText

	headerCell.LayoutOrder = i

	headerCell.Size = UDim2.new(0, 0, 0, 24)

	headerCell.Parent = headerFrame

	local headerSize = Instance.new("UISizeConstraint")

	headerSize.MinSize = Vector2.new(headerWidth[i], 0)

	headerSize.Parent = headerCell

end



-- Finally, add data rows by iterating over each row and the columns in that row

for index, value in ipairs(data) do

	local rowData = value

	local rowFrame = Instance.new("Frame")

	rowFrame.Name = "Row" .. index

	rowFrame.Parent = frame

	for col = 1, #value do

		local cellData = rowData[col]

		local cell = Instance.new("TextLabel")

		cell.Text = cellData

		cell.Name = headers[col]

		cell.TextXAlignment = Enum.TextXAlignment.Left

		if tonumber(cellData) then -- If this cell is a number, right-align it instead

			cell.TextXAlignment = Enum.TextXAlignment.Right

		end

		cell.ClipsDescendants = true

		cell.Size = UDim2.new(0, 0, 0, 24)

		cell.Parent = rowFrame

	end

end

FillEmptySpaceRows

boolean
병렬 읽기

빈 공간 행 채우기는 셀의 Y 크기가 설정되어 부모 UI 요소의 전체 세로 공간이 사용되는지 여부를 결정합니다.이를 활성화하면 테이블이 더 쉽게 예측 가능한 수준의 세로 공간(부모 UI 요소의 Y축 크기)을 차지하는지 확인할 수 있습니다.여전히 세포에 적용된 UISizeConstraint에 의해 언더플로/오버플로가 발생할 가능성이 있습니다.

이 속성을 활성화할 때 행 높이는 부모의 GuiBase2d.AbsoluteSize .Y 구성분과 행 수(패딩이나 다른 요소를 고려하지 않음)로 대략적으로 같아집니다.

코드 샘플

This code sample builds a table of 4 rows, the first having headers. It does this using some for-loops and a UITableLayout. The widths of each column are set using UISizeConstraints.

Build UI Table
local frame = script.Parent



-- Table data

local headerWidth = { 200, 80, 80 }

local headers = {

	"Name",

	"Job",

	"Cash",

}

local data = {

	{ "Bob", "Waiter", 100 },

	{ "Lisa", "Police", 200 },

	{ "George", "-", 50 },

}



-- First, build the table layout

local uiTableLayout = Instance.new("UITableLayout")

uiTableLayout.FillDirection = Enum.FillDirection.Vertical

uiTableLayout.HorizontalAlignment = Enum.HorizontalAlignment.Center

uiTableLayout.VerticalAlignment = Enum.VerticalAlignment.Center

uiTableLayout.FillEmptySpaceColumns = false

uiTableLayout.FillEmptySpaceRows = false

uiTableLayout.Padding = UDim2.new(0, 5, 0, 5)

uiTableLayout.SortOrder = Enum.SortOrder.LayoutOrder

frame.Size = UDim2.new(0, 0, 0, 40) -- The Size of the parent frame is the cell size

uiTableLayout.Parent = frame



-- Next, create column headers

local headerFrame = Instance.new("Frame")

headerFrame.Name = "Headers"

headerFrame.Parent = frame

for i = 1, #headers do

	local headerText = headers[i]

	local headerCell = Instance.new("TextLabel")

	headerCell.Text = headerText

	headerCell.Name = headerText

	headerCell.LayoutOrder = i

	headerCell.Size = UDim2.new(0, 0, 0, 24)

	headerCell.Parent = headerFrame

	local headerSize = Instance.new("UISizeConstraint")

	headerSize.MinSize = Vector2.new(headerWidth[i], 0)

	headerSize.Parent = headerCell

end



-- Finally, add data rows by iterating over each row and the columns in that row

for index, value in ipairs(data) do

	local rowData = value

	local rowFrame = Instance.new("Frame")

	rowFrame.Name = "Row" .. index

	rowFrame.Parent = frame

	for col = 1, #value do

		local cellData = rowData[col]

		local cell = Instance.new("TextLabel")

		cell.Text = cellData

		cell.Name = headers[col]

		cell.TextXAlignment = Enum.TextXAlignment.Left

		if tonumber(cellData) then -- If this cell is a number, right-align it instead

			cell.TextXAlignment = Enum.TextXAlignment.Right

		end

		cell.ClipsDescendants = true

		cell.Size = UDim2.new(0, 0, 0, 24)

		cell.Parent = rowFrame

	end

end

MajorAxis

Enum.TableMajorAxis
병렬 읽기

MajorAxis는 형제 UI 요소가 행이나 열로 처리되는지 여부를 결정합니다.

코드 샘플

This code sample builds a table of 4 rows, the first having headers. It does this using some for-loops and a UITableLayout. The widths of each column are set using UISizeConstraints.

Build UI Table
local frame = script.Parent



-- Table data

local headerWidth = { 200, 80, 80 }

local headers = {

	"Name",

	"Job",

	"Cash",

}

local data = {

	{ "Bob", "Waiter", 100 },

	{ "Lisa", "Police", 200 },

	{ "George", "-", 50 },

}



-- First, build the table layout

local uiTableLayout = Instance.new("UITableLayout")

uiTableLayout.FillDirection = Enum.FillDirection.Vertical

uiTableLayout.HorizontalAlignment = Enum.HorizontalAlignment.Center

uiTableLayout.VerticalAlignment = Enum.VerticalAlignment.Center

uiTableLayout.FillEmptySpaceColumns = false

uiTableLayout.FillEmptySpaceRows = false

uiTableLayout.Padding = UDim2.new(0, 5, 0, 5)

uiTableLayout.SortOrder = Enum.SortOrder.LayoutOrder

frame.Size = UDim2.new(0, 0, 0, 40) -- The Size of the parent frame is the cell size

uiTableLayout.Parent = frame



-- Next, create column headers

local headerFrame = Instance.new("Frame")

headerFrame.Name = "Headers"

headerFrame.Parent = frame

for i = 1, #headers do

	local headerText = headers[i]

	local headerCell = Instance.new("TextLabel")

	headerCell.Text = headerText

	headerCell.Name = headerText

	headerCell.LayoutOrder = i

	headerCell.Size = UDim2.new(0, 0, 0, 24)

	headerCell.Parent = headerFrame

	local headerSize = Instance.new("UISizeConstraint")

	headerSize.MinSize = Vector2.new(headerWidth[i], 0)

	headerSize.Parent = headerCell

end



-- Finally, add data rows by iterating over each row and the columns in that row

for index, value in ipairs(data) do

	local rowData = value

	local rowFrame = Instance.new("Frame")

	rowFrame.Name = "Row" .. index

	rowFrame.Parent = frame

	for col = 1, #value do

		local cellData = rowData[col]

		local cell = Instance.new("TextLabel")

		cell.Text = cellData

		cell.Name = headers[col]

		cell.TextXAlignment = Enum.TextXAlignment.Left

		if tonumber(cellData) then -- If this cell is a number, right-align it instead

			cell.TextXAlignment = Enum.TextXAlignment.Right

		end

		cell.ClipsDescendants = true

		cell.Size = UDim2.new(0, 0, 0, 24)

		cell.Parent = rowFrame

	end

end

Padding

UDim2
병렬 읽기

패딩은 간격을 두고 요소를 위치시킵니다.이는 UDim2의 규모 또는 오프셋 구성 요소를 사용하여 수행할 수 있습니다.부정 값은 요소를 가까이 가져올 수 있습니다.0이 아닌 경우 형제 UI 요소는 그들 내의 세포 사이에서 표시될 수 있습니다.

코드 샘플

This code sample builds a table of 4 rows, the first having headers. It does this using some for-loops and a UITableLayout. The widths of each column are set using UISizeConstraints.

Build UI Table
local frame = script.Parent



-- Table data

local headerWidth = { 200, 80, 80 }

local headers = {

	"Name",

	"Job",

	"Cash",

}

local data = {

	{ "Bob", "Waiter", 100 },

	{ "Lisa", "Police", 200 },

	{ "George", "-", 50 },

}



-- First, build the table layout

local uiTableLayout = Instance.new("UITableLayout")

uiTableLayout.FillDirection = Enum.FillDirection.Vertical

uiTableLayout.HorizontalAlignment = Enum.HorizontalAlignment.Center

uiTableLayout.VerticalAlignment = Enum.VerticalAlignment.Center

uiTableLayout.FillEmptySpaceColumns = false

uiTableLayout.FillEmptySpaceRows = false

uiTableLayout.Padding = UDim2.new(0, 5, 0, 5)

uiTableLayout.SortOrder = Enum.SortOrder.LayoutOrder

frame.Size = UDim2.new(0, 0, 0, 40) -- The Size of the parent frame is the cell size

uiTableLayout.Parent = frame



-- Next, create column headers

local headerFrame = Instance.new("Frame")

headerFrame.Name = "Headers"

headerFrame.Parent = frame

for i = 1, #headers do

	local headerText = headers[i]

	local headerCell = Instance.new("TextLabel")

	headerCell.Text = headerText

	headerCell.Name = headerText

	headerCell.LayoutOrder = i

	headerCell.Size = UDim2.new(0, 0, 0, 24)

	headerCell.Parent = headerFrame

	local headerSize = Instance.new("UISizeConstraint")

	headerSize.MinSize = Vector2.new(headerWidth[i], 0)

	headerSize.Parent = headerCell

end



-- Finally, add data rows by iterating over each row and the columns in that row

for index, value in ipairs(data) do

	local rowData = value

	local rowFrame = Instance.new("Frame")

	rowFrame.Name = "Row" .. index

	rowFrame.Parent = frame

	for col = 1, #value do

		local cellData = rowData[col]

		local cell = Instance.new("TextLabel")

		cell.Text = cellData

		cell.Name = headers[col]

		cell.TextXAlignment = Enum.TextXAlignment.Left

		if tonumber(cellData) then -- If this cell is a number, right-align it instead

			cell.TextXAlignment = Enum.TextXAlignment.Right

		end

		cell.ClipsDescendants = true

		cell.Size = UDim2.new(0, 0, 0, 24)

		cell.Parent = rowFrame

	end

end
Instance에서 상속된 모든 항목 보기
Object에서 상속된 모든 항목 보기

메서드

Instance에서 상속된 모든 항목 보기
Object에서 상속된 모든 항목 보기

이벤트

Instance에서 상속된 모든 항목 보기
Object에서 상속된 모든 항목 보기