63

I am making a custom distribution, and have a question about the Ubuntu Logo with 5 dots displayed when booting up.

The Ubuntu-Logo-Script in the /lib/plymouth/themes/ubuntutext folder has the word Ubuntu and beneath that 5 progressing 'dots'. Is it possible to remove the progress bar dots, and instead replace it with a faded Ubuntu logo, that gradually colors up to full?

enter image description here

0

3 Answers 3

142
+150

Install Theme

I have created theme as you wanted with a faded Ubuntu logo (moreover I have added an animation of the Ubuntu logo. Hope you'd like it :-P )

Screenshot

Spinning Ubuntu logo and the Ubuntu text logo with a moving fade effect.

Want to see it live?

Go to http://www.youtube.com/watch?v=zPo50gM3txU

Where can you get this theme?

I have uploaded it to Mediafire cloud here.

How do you install it?

Download from the above link, save it on your Desktop, then issue these commands one by one. Please replace /lib/plymouth/themes with /usr/share/plymouth/themes in the commands, if you are on 16.04 or later.

cd ~/Desktop/
tar -xf ubuntufaded.tar
sudo cp -r ubuntu-faded-screen '/lib/plymouth/themes'
sudo rm '/lib/plymouth/themes/default.plymouth'
sudo ln -s '/lib/plymouth/themes/ubuntu-faded-screen/ubuntu-faded-screen.plymouth' '/lib/plymouth/themes/default.plymouth'
sudo update-initramfs -u

How to check it?

  1. Restart Ubuntu and you'll see a nice animation while booting up and shutting down. OR
  2. Copy the whole command below and paste it into a terminal and hit enter. (You will probably need to install a package: sudo apt-get install plymouth-x11)

    sudo plymouthd --debug --debug-file=/tmp/plymouth-debug-out ; sudo plymouth --show-splash ; for ((I=0;I<10;I++)); do sleep 1 ; sudo plymouth --update=event$I ; done ; sudo plymouth --quit

How to create a Plymouth theme yourself

Plymouth Scripting Language is very similar to C or JavaScript. If you know these languages, it'll be very easy to create Plymouth scripts yourself.

Let's start with basics like operators, looping, comments, etc. Three type of comments are supported.

# comment like in bash
// single line comment like in C
/* block comments */

Statements are terminated with a semicolon, e.g.

foo = 10;

Statement blocks can be created with curly brackets, e.g.

{
    foo = 10;
    z = foo + foo;
}

The supported operators are +, -, *, /, %. Shorthand assignment operators are also supported +=, -=, *=, etc. Unary operators are also supported, e.g.

foo *= ++z;

+ is used for concatenation e.g.

foo = "Jun" + 7; # here foo is "Jun7"

Comparison operator example:

x = (3 >= 1); # assign 1 to x because it's true
y = ("foo" == "bar"); # assign 0 to y because it's false

Conditional operations and looping:

if (foo > 4)
{
    foo--;
    z = 1;
}
else
    z = 0;


while (foo--)
    z *= foo;

&&, ||, ! are also supported.

if ( foo > 0 && foo <4 )

This may be new to many readers: hashes, similar to arrays. Hashes can be created by accessing their contents using dot or [ ] brackets, e.g.

foo.a = 5;
x = foo["a"] ; # x equals to 5

Use the fun keyword to define function, e.g.

fun animator (param1, param2, param3)
{
    if (param1 == param2)
        return param2;
    else
        return param3;
}

The two basic Plymouth objects

Image

To create a new Image, give the filename of an image within the theme directory to Image(). Remember, only .png files are supported. For example:

background = Image ("black.png"); 

To show a text message you must create an Image of the text. (This might surprise you.) For example:

text_message_image = Image.Text("I love Ubuntu");

Width and height can be found using GetWidth() and GetHeight(); for example:

image_area = background.GetWidth() * background.GetHeight();

One can rotate or change the size of an Image; for example:

down_image = logo_image.Rotate (3.1415); # Image can be Rotated. Parameter to Rotate is the angle in radians
fat_image = background.Scale ( background.GetWidth() * 4 , background.GetHeight () ) # make the image four times the width

Sprite

Use Sprite to place an Image on screen.

Creating a Sprite:

first_sprite = Sprite ();
first_sprite.SetImage (background);

Or by supplying image to its constructor,

first_sprite = Sprite (background);

How to set different the sprite to different positions on screen (x,y,z):

first_sprite.SetX (300); # put at x=300
first_sprite.SetY (200); # put at y=200
background.SetZ(-20);
foreground.SetZ(50);

Or you can set all at once with SetPosition():

first_sprite.Setposition(300, 200, 50) # put at x=300, y=200, z=50

Changing opacity:

faded_sprite.SetOpacity (0.3);
invisible_sprite.SetOpacity (0);

Some miscellaneous methods used are:

Window.GetWidth();
Window.GetHeight();
Window.SetBackgroundTopColor (0.5, 0, 0); # RGB values between 0 to 1.
Window.SetBackgroundBottomColor (0.4, 0.3, 0.6);
Plymouth.GetMode(); #  returns a string of one of: "boot", "shutdown", "suspend", "resume" or unknown.
etc.

Predefined Functions

Plymouth.SetRefreshFunction (function); # Calling Plymouth.SetRefreshFunction with a function will set that function to be called up to 50 times every second
Plymouth.SetBootProgressFunction(); # function is called with two numbers, time spent booting so far and the progress (between 0 and 1)
Plymouth.SetRootMountedFunction(); # function is called when a new root is mounted
Plymouth.SetKeyboardInputFunction(); # function is called with a string containing a new character entered on the keyboard
Plymouth.SetUpdateStatusFunction(); # function is called with the new boot status string
Plymouth.SetDisplayPasswordFunction(); # function is called when the display should display a password dialogue. First param is prompt string, the second is the number of bullets.
Plymouth.SetDisplayQuestionFunction(); # function is called when the display should display a question dialogue. First param is prompt string, the second is the entry contents.
Plymouth.SetDisplayNormalFunction(); # function is called when the display should return to normal
Plymouth.SetMessageFunction(); # function is called when new message should be displayed. First arg is message to display.

Mathematical Functions

Math.Abs()
Math.Min()
Math.Pi()
Math.Cos()
Math.Random()
Math.Int()
etc.

It is better to modify an existing script than to start from scratch.

Open up .script file from my uploaded theme and try to understand what it does. A fantastic guide can be found here.

I'm sure you'll learn this. It isn't hard. Let me know if you need any help.

Hope it'd help you create one yourself.

Answer to Roshan George's Comment : Is it possible to replace the purple colour with an image as background in the default Plymouth theme names "ubuntu-logo" ?

background = Image ("your-image.png"); 
sprite = Sprite (background.Scale (Window.GetWidth(), Window.GetHeight()));
sprite.SetX (0); # put at x=0
sprite.SetY (0); # put at y=0

You might need to add sprite.SetZ (-10);

You should remove

Window.SetBackgroundTopColor (p, q, r);
Window.SetBackgroundBottomColor (a, b, c);

where p, q, r, a, b, c are some values.

More links

25
  • 1
    Can i get the same as u have created but with the ubuntu logo and text(in same positions like now) glowing and diming alternately(when logo glows,txt dims and when text glows,logo dims) with no rotating border and a slit progress as the Ubuntu9.10 playmouth...i.e this-wiki.ubuntu.com/Artwork/Incoming/Karmic/Boot/… would like to have only the slit progress bar like the one in the link...the txt and logo being in positions same as urs...Can u help me have that?? m trying to learn from what u have xplained meanwhile...Thanx! gr8 answer
    – Nirmik
    Jun 9, 2012 at 18:27
  • 23
    Sometimes I wish I could upvote more than 1 time :D
    – Rinzwind
    Jun 9, 2012 at 18:39
  • 1
    @Rinzwind : I just gave him "10 upvotes" on behalf of us all :)
    – ish
    Jun 11, 2012 at 3:31
  • 3
    Note that in 16.04, the themes directory location changed to: /usr/share/plymouth/themes
    – Olivier
    May 17, 2016 at 11:15
  • 1
    Since Ubuntu 16.04, the plymouth theme directory has been changed as told by another comment. Please update your answer to reflect this, if you have a chance. Thank you! Apr 16, 2017 at 22:52
3

Use the Plymouth Manager to change this. You can get it from from here on Launchpad or run the commands below.

wget https://launchpad.net/plymouth-manager/trunk/stable/+download/plymouth-manager_1.5.0-1_all.deb
sudo dpkg -i plymouth-manager_1.5.0-1_all.deb 

After that you will need to launch plymouth-manager with the command:

sudo plymouth-manager

The "magic" command if you want to do all by yourself, (writing your own plymouth config file), and you want to apply it when you are ready is:

sudo update-alternatives --config default.plymouth && sudo update-initramfs -u
0
1

I have changed the GRUB screen with the GRUB Customizer software. But if you want to change the Plymouth screen it's different.

All the things of this software is in the /lib/plymouth/themes directory and all the animation of this one is in the /lib/plymouth/themes/ubuntu-logo/ubuntu-logo.script file.

If you want to modify to your liking Plymouth, all you need is on the ubuntu-logo folder.

You can do it by your own without the help of any external software, but you must understand programming.

Also you can find tools to do that in the Ubuntu repository, but you need to learn to create Plymouth themes.

Good luck!

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .