How to create a theme

From GeeXboX wiki

Jump to: navigation, search

Voir cet article en français - Puede ver el artículo en español - 以正體中文觀看本文

Author : LoR@KoRn (Laurent Peltier) Bits changed / Added by TOTMS.


This tutorial is for GNU-Linux users. (With an alternative method for Windows users.) It describes step by step how creating a complete theme for GeeXboX.

Contents

[edit]

Software requirements

[edit]

Splash-isolinux

Using The Gimp, create your picture at 640x320 resolution and save it as splash-isolinux.png

- Click menu: image > mode > indexed > maximum number of colors > set to 16 > ok

- Click menu: file > save as > file type > PNG image > save (splash-isolinux.png)

In a console: 

 #convert splash-isolinux-png splash-isolinux.ppm
 #ppmtolss16 <splash-isolinux-ppm >splash-isolinux.rle

[edit]

Grub-splash

Using The Gimp, create your picture at 640x480 resolution and save it as grub-splash.xpm.

- Click menu: image > mode > indexed > maximum number of colors > set to 14 > ok

- Click menu file > save as > file type > Pixmap X image > save (grub-splash.xpm)

In a console: 

 #gzip grub-splash.xpm

[edit]

Bootsplash

Using The Gimp, create your picture at 800x600 resolution and save it as bootsplash-800x600.jpeg.

- Click menu: file > save as > file type > JPEG image > save (bootsplash-800x600.jpeg)


Create a file named bootsplash-800x600.cfg with the following lines : 

 # This is the configuration file for the 800x600 bootsplash picture.
 # This file is necessary to specify the coordinates of the text box on
 # the splash screen.
 # config file version
 version=3
 # should the picture be displayed?
 state=1
 # fgcolor is the text forground color.
 # bgcolor is the text background (i.e. transparent) color.
 fgcolor=7
 bgcolor=5
 # (tx, ty) are the (x, y) coordinates of the text window in pixels.
 # tw/th is the width/height of the text window in pixels.
 tx=20
 ty=20
 tw=760
 th=560
 # name of the picture file (full path recommended)
 jpeg=bootsplash-800x600.jpeg
 progress_enable=1
 percent=6000
 # progress bar
 box silent inter 224 393 224 404 #fd8100
 box silent       224 393 601 404 #fd8100
 box        inter 224 393 224 404 #fd8100
 box              224 393 601 404 #fd8100
 box noover        15  17 785 583 #333333E0
 overpaintok=1

Where 393 corresponds to the top of the progress bar, 404 to the bottom, 224 to the left, 601 to the right and #fd8100 to the color. Modify these values according to your realization.

In a console : 

 #cd /where_the_files_are/
 #splash -s -f bootsplash-800x600.cfg > bootsplash-800x600.dat

Patch for bootsplash-3.1 (useful for the progressbar on GeeXboX) : 

--- bootsplash-3.1.orig/Utilities/splash.c   2004-09-20 20:54:42.832461640 +0200
+++ bootsplash-3.1/Utilities/splash.c   2004-09-20 23:49:27.094611528 +0200
@@ -517,13 +517,13 @@
             exit(1);
          }
          fclose(sfp);
-         if (sboxcount)
-            memmove(pic + 47 + l + boxcount * 12,
-               sboxes, sboxcount * 12);
-         silentl += sboxcount * 12;
-         l += silentl;
       }
       fclose(fp);
+      if (sboxcount)
+         memmove(pic + 47 + l + boxcount * 12,
+            sboxes, sboxcount * 12);
+      silentl += sboxcount * 12;
+      l += silentl;
    } else {
       l = 0;
       pic = calloc(47, 1);
[edit]

Background

Using The Gimp, create your picture at 640x480 resolution and save it as 150.jpg.

- Click menu: file > save as > file type > JPEG image > save (150.jpg)

In a console : 

#cd /where_the_file_is/
#for ((i=0;i<149;i++)); do ln -s 150.jpg $i.jpg; done
#mencoder -ffourcc divx mf://*.jpg -mf w=640:h=480:fps=25:type=jpg -ovc lavc
-lavcopts vcodec=mpeg4:vbitrate=4 -oac copy -o background.avi

[edit]

Font of the menu

Choose a Truetype font (.ttf) and create a file named config with the following line : 

 FONT_SIZE=3

You can also use the one from the OMC theme...

[edit]

Finalization

Create a folder named theme-your theme and put there the 6 files you have created 

 splash-isolinux.rle
 grub-splash.xpm.gz
 bootsplash-800x600.dat
 background.avi
 font.ttf
 config

Finally, copy this folder in the themes folder of the FLTK Generator.

[edit]

Alternative Method using Windows

A quick easy way of making themes

I have read the wiki page with regards making themes and quite frankly, it puts me straight off... Then I got thinking, essentially the main elements of a theme are, a) the background and b) the font.

Both of these can be made easily without *really* going out of your way. For example, my main box runs windows (I have a couple of non GB boxes running linux but thats not the point...) So as such I thought I would throw together a quick guide to making a theme.

1) Copy the default theme.

2) Find (or take) a good background image. This can be anything as long as its equal to or greater than 640x480. If the image is larger than you can use a program like photoshop (or many many others including GIMP) to resize it.

3) I then imported the image into Windows Movie Maker (ducks)

4) This produced a 10 second wmv. So the next stage was to convert it to a compressed avi which was 1 second long. (If the movie is any longer then its just needlessly taking up space unless you have some cool effect running...) I did this by using a simple video conversion program (many will do the same thing, most are free) This file, which has to be named background.avi replaces the existing one in the new theme directory

4) Replace the existing font file with a font of your choice.

5) Test - the fastest way I found was to make an ISO and use QEMU to make sure everything installed and worked ok...

And thats it Smile Hope this helps someone!

Retrieved from "http://geexbox.org/wiki/index.php/How_to_create_a_theme"
Personal tools