How to create a theme
From GeeXboX wiki
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 |
Software requirements
- The Gimp
- Convert, part of ImageMagick
- ppmtolss16, part of SysLinux
- Splash, part of BootSplash
- Mencoder, part of MPlayer
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
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
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);
Bootsplash images aren't limited to 800x600 but can have other standard VESA resolutions like 640x480 1024x768..... Moreover, a theme can also contain multiple bootsplash images at different resolutions. Specify all resolutions present in the file called config, by adding a line like
RESOLUTIONS="640x480 800x600"
If RESOLUTIONS isn't specified, default 800x600 is assumed
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
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...
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.
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!
Another Alternative Method using Windows
NOTE: This is for users without Windows Movie Maker.
1) Copy the default theme to another directory and rename the directory.
2) Choose your background image (640x480 or larger).
3) Then use SSMM - Slide Show Movie Maker to produce your AVI file. You can get this from the author's web site. http://www.joern-thiemann.de/tools/SSMM/
4) Rename the AVI file, to background.avi to replace the original one in your new renamed directory.
5) (Optional) Replace the existing font file with your own font, if want a different font.
6) You can now test it in an emulator (VirtualPC, VirtualBox, QEMU etc...) or go ahead and create you ISO, and burn to a blank CD. (I use CDRW's so I can play around with features and options without wasting my blank CDR's.)
Another Alternative Method independent of the operating system
Software requirements
- The Gimp or any other image editing program
- VLC Player
The steps
1) Using Gimp (or other image editing program) create a 640x480 image and save it.
2) Open VLC player, go to File->Convert / Save and select the previously created image. Click 'Convert / Save'.
3) Set the destination file to be background.avi overwriting the file in the default theme.
4) In the same window select the profile settings as:
- container: avi
- video codec: Theora or Mpeg4
- no audio
5) Click 'Start'
6) That's it! Enjoy!

