Make a autocomplete username system

Im trying to make a autocomplete username system, but all i found was a system that checked for the players ingame names that match the most with the textbox text.

I want it to be like on the website (with RoPro). Where if you type a name it will show up a name with a profile picture on a dropdown. and if the typed in name is also a friend of you, then it will show up first in the list.

Example:

1 Like
  1. UI Design:
  • Create a TextBox for users to input the username.
  • Create a UI container (e.g., a Frame) to display the dropdown list.
  • Design how each dropdown item should look: profile picture, username, and any other relevant information.
  1. Scripting:
  • Use the UserInputService to detect when the TextBox text changes.
  • Whenever the text changes, update the dropdown list based on the entered text.
  • Fetch the list of friends using the Players service and the FriendsService.
  • Filter and sort the list of usernames based on the entered text. Friends should be sorted first.
  • Update the UI dropdown list with the filtered and sorted usernames, along with their profile pictures.

Here’s a basic outline of how the script could look:

local UserInputService = game:GetService("UserInputService")
local Players = game:GetService("Players")
local FriendsService = game:GetService("FriendsService")

local textBox = -- Reference to your TextBox
local dropdownContainer = -- Reference to your dropdown UI container
local dropdownItemTemplate = -- Reference to your dropdown item template

local function updateDropdownList(searchText)
    dropdownContainer:ClearAllChildren()

    local friends = FriendsService:GetFriendsAsync(Players.LocalPlayer.UserId)
    local usernames = {} -- List of usernames matching the searchText
    for _, player in ipairs(Players:GetPlayers()) do
        if searchText == "" or string.find(player.Name:lower(), searchText:lower(), 1, true) then
            table.insert(usernames, player.Name)
        end
    end

    table.sort(usernames, function(a, b)
        local isFriendA = table.find(friends, Players:GetUserIdFromNameAsync(a))
        local isFriendB = table.find(friends, Players:GetUserIdFromNameAsync(b))
        if isFriendA and not isFriendB then
            return true
        elseif isFriendB and not isFriendA then
            return false
        end
        return a < b
    end)

    for _, username in ipairs(usernames) do
        local dropdownItem = dropdownItemTemplate:Clone()
        -- Customize dropdownItem UI with profile picture and username
        dropdownItem.NameLabel.Text = username
        -- Add click event to the dropdownItem
        dropdownItem.Parent = dropdownContainer
    end
end

textBox.FocusLost:Connect(function(enterPressed)
    if not enterPressed then
        updateDropdownList(textBox.Text)
    end
end)

UserInputService.InputChanged:Connect(function(input)
    if input.UserInputType == Enum.UserInputType.MouseMovement then
        updateDropdownList(textBox.Text)
    end
end)

You will need to replace dropdownItemTemplate with a reference to your UI template for each dropdown item, and adjust the UI customization part accordingly.

This is a basic outline to get you started. You can further enhance the script with additional features like selecting an item from the dropdown, updating the TextBox text when an item is clicked, and handling UI layout adjustments.

3 Likes

This would only work with friends. While this looks functional at a quick glance (props to ChatGPT) it isn’t fully what they were asking

1 Like

yeah.

i just found out that he used Players:GetPlayers() wich would only get the players in that server, and is not trying to match the textbox imput to a actual user (not in that server)

1 Like

Yep. Can’t write actual code right now but I can sorta describe the basic process, and you can borrow some of the code from the other post if needed. When the textbox updates, pcall Players:GetNameFromUserIdAsync and see if it succeeds. If it does, use the name and get their photo using Players:GetUserThumbnailAsync. If their id is in GetFriendsAsync, then give them a friend icon. This is for a system identical to the RoPro one. As for a list, I’m not sure that’s possible to do with all Roblox users. It would work with friends and server members, but afaik you can’t do that with all users.

2 Likes

Quite a few months ago I made a system similar to this for some ReportUI, here is some of the code which handles autocompleting the name:

local Players = game:GetService("Players")

local SearchBar = script.Parent
local PlayerParent = Players:GetPlayers()

script.Parent.Focused:Connect(function()
	PlayerParent = Players:GetPlayers()
end)


function UpdateSearch()
	local search = string.lower(SearchBar.Text)

	for i,v in pairs(PlayerParent) do
		if search ~= "" then
			local item = string.lower(v.Name)

			if string.find(item, search) then
				script.Parent.Parent.PlayerChoose.Text = v.Name
			end
		end
	end
end

SearchBar.Changed:Connect(UpdateSearch)

Basically, it loops through the Players table looking to see if the inputted text matches or atleast is close to matching a players name. If you would like to make a dropdown menu with the Players Thumbnail you can refer to what @FloofyNezzled has said.

2 Likes

the thing is that this is also only for the players in your server, because you use Players:GetPlayer()

i don’t know if there is a way to get any player even if they are not in your server. like @FloofyNezzled said

2 Likes

So you would like to get the players across multiple servers? if so you can communicate between different servers and use that information to create your playerlist/menu using MessagingService.

1 Like

i would like to search anybody, even people who are not online or haven’t been online for years.

just like the roblox (RoPro) search does, be able to search anybody

1 Like

Yeah, I don’t think there’s a way to do this. There might be some API somewhere that lets you but I highly doubt it (at least one that you can use in-game)

1 Like

and then it also needs to work on a proxy otherwise i would be rate limited

Wouldn’t you still get rate limited with a proxy?

i don’t think so, i didn’t get rate limited using roproxy

so far i see you guys don’t have a solution and i don’t really want to read all the posts above so i might repeat something that was already said

you cant really get list of all usernames to match closest one for autocompletion, but you can limit the scope of your autocompletion program to friend list of the user using GetFriendsAsync as this information is available

but how do you get mugshot of an arbitary player after typing his name?
get his userid using GetUserIdFromNameAsync and if returned value is nil then there is no such player on Roblox, after that use GetUserThumbnailAsync to get thumbnail picture of that player

and the rest is left to you to fill your guis with that information

i already got a module to get the players mugshot, i can try using only GetFriendsAsync but i wanted a way to match it to any name and not only the people in your server.

i gues there is no way to match it to any playername

yeah there is no way to get a list of players with matching name from a string as there is simply too much data to process

but how does an extension like RoPro do it, and so quickly? do they have an API that can’t be used in roblox games?

image
it says there are 66.1 million active users but there are also inactive users
to go through more than 66.1 million usernames and process whether their username matches would take a lot of time

how does an extension like RoPro does it? it doesnt suggest you a name autocompletion (i mean it does but its scope is limited to your friend list) it simply returns information for current user that is being typed which you could replicate using methods i mentioned above

so you can only do it for people that are on your friends list?

as you can see yourself it doesnt suggest you anybody outside of your friend list