A little update from developer: It’s been a while since I open-sourced something. One of my last projects, Techy’s Obby System, did pretty well and helped a lot of developers out there. However, it was heavily unoptimized due to my lack of scripting skills at the time, so I didn’t open-source too many models afterward. Recently, I was looking for a client-side music player for my game but couldn’t find a good one. So, I decided to spend some time creating this music player and open-sourcing it to save some of your time as well. Here it is!
Key features:
- Highly customizable
- Simple animations enhance the UI’s visual appeal
- Easily configurable settings
- Allows users to loop & shuffle
- Supports album art, music name, and artist
- Compatible with all devices
The music loader preloads all musics before appearing to ensure gapless music. You can tweak settings in the configuration script, or modify the main script if you have a good knowledge in scripting. You can get some idea about how customizable the UI & the system is from the Configuration script.
Cofiguration Script
local Config = {
-- Created by 0Techy
-- Note that the music player will first preload all sounds then load. So you might not see the music player visible for a few seconds after joining
ApplyScriptedTheme = true; -- Set to false if you want to manually color the UI. It will disable loop/shuffle selected animation too
PrimaryColor = Color3.fromRGB(45, 52, 54);
SecondaryColor = Color3.fromRGB(27, 194, 87);
TextImageColor = Color3.fromRGB(255, 255, 255);
BackgroundTransparency = 0.2;
-- Tip: You can manually change the UI Corner Values
ConsoleToggleButton = Enum.KeyCode.DPadUp; -- The button used to toggle the visibility of the GUI
ConsolePause = Enum.KeyCode.DPadDown; -- Only applies when music frame is fully visible
ConsoleNext = Enum.KeyCode.DPadRight;
ConsolePrevious = Enum.KeyCode.DPadLeft;
-- Loop and Shuffle for console isn't scripted yet. Feel free to modify the script to add that.
UseConfigPositions = true; -- Set to false if you don't want it to animate and want to create it yourself
MusicPlayer_Hidden = UDim2.new(0.01, 0, 0.962, 0);
MusicPlayer_HalfVisible = UDim2.new(0.01, 0, 0.89, 0);
MusicPlayer_Visible = UDim2.new(0.01, 0, 0.815, 0);
IconHoverSizeIncrease = UDim2.new(0.02, 0, 0.02, 0);
-- Animation settings can be tweaked by some advanced scripting in VisibilityHandler (I forgot lol)
StartWithRandomMusic = true; -- If false, the first music in the list plays by default. Else, plays a random one from the list.
DefaultVolume = 0.5;
MusicIntervalDelay = 0.5; -- Delay after a music ends (in seconds)
MusicInfoViewTime = 3.5; -- For how long the music player stays half visible after a music ends (in seconds)
MobileMouseLeaveDelay = 1.5; -- Set how long the music player stays half visible after a player using mobile clicks on it. This delay allows them to fully open the music player
ShowArtist = true;
Debug = true;
MusicList = {
{
SoundId = 1846575559;
MusicName = ""; -- Leaving it empty like this will make the script automatically use the name thats used in the store
MusicArtist = ""; -- Leaving it empty will make the script automatically use the creator name thats used in the store
AlbumIcon = ""; -- Leaving it empty will use the default icon from the UI. Make sure to put "rbxassetid://youriconid" if you're using custom one
};
{
SoundId = 1845756489;
MusicName = "";
MusicArtist = "";
AlbumIcon = "";
};
{
SoundId = 1835643971;
MusicName = "";
MusicArtist = "";
AlbumIcon = "";
};
{
SoundId = 1841647093;
MusicName = "";
MusicArtist = "";
AlbumIcon = "";
};
}
}
return Config
Setup:
- Get the model by pressing the button below
- Insert it in your game and move
MusicPlayertoStarterGui - Open
Configurationscript and add some music ID (you can find in store) by following the correct format - Enjoy!
Showcase:
(sorry for low quality recording)
You can also test the music player out yourself in this game! Also here are some…
Screenshots
Lastly, a heavily customized UI. ApplyScriptedTheme was still set to true, just added some UIStroke and removed some UICorner from the UI.
Thanks for checking my creation out. Hope it helped. Feel free to give me suggestions through replies or direct messages.