Making themes

(New page: === Purpose === This tutorial is to help people make new themes. I have had several people ask me how to make new themes. Creating a theme is very easy; all you need is a image editing p...)
(Extract Data File)
 
(9 intermediate revisions not shown)
Line 1: Line 1:
-
=== Purpose ===
+
This tutorial is to help people make new themes. I have had several people ask me how to make new themes. Creating a theme is very easy; all you need is a image editing program like Photoshop, GIMP, Paintshop Pro, or any other. I prefer one that has Layers and other advance features but any will work. You will also need to download the theme maker from [https://garage.maemo.org/frs/?group_id=36&release_id=1629 the Garage download page].
-
This tutorial is to help people make new themes. I have had several people ask me how to make new themes. Creating a theme is very easy; all you need is a image editing program like Photoshop, Gimp, Paintshop Pro, or any other. I prefer one that has Layers and other advance features but any will work. You will also need to download the theme maker from [https://garage.maemo.org/frs/?group_id=36&release_id=1629 | Here.]
+
 +
== Guide ==
-
=== Guide ===
+
=== Making a binary package ===
-
The first step is to ''unzip'' the folder to your computer. (I keep the Theme maker folder on my desktop since that is where the program creates the theme files and it’s easy to get to).
+
-
 
+
-
Second if you look into the folder there is an a file called '''NuvoPearl-template.psd''' that is the file you will ''edit'' to make your new theme.  ''Open'' it up with your image editor.
+
 +
<ol>
 +
<li>
 +
''unzip'' the folder to your computer. (I keep the Theme maker folder on my desktop since that is where the program creates the theme files and it’s easy to get to).
 +
</li>
 +
<li>
 +
look into the folder there is an a file called <code>NuvoPearl-template.psd</code> that is the file you will ''edit'' to make your new theme.  ''Open'' it up with your image editor.
 +
</li>
 +
<li>
''Edit'' this file to look like what ever you want your theme to look like (I wont go into how to edit the file in this document but I normally do layers over the background image this has several advantages over just editing the image.)
''Edit'' this file to look like what ever you want your theme to look like (I wont go into how to edit the file in this document but I normally do layers over the background image this has several advantages over just editing the image.)
 +
</li>
 +
<li>
 +
''save'' your file twice once in the <code>.psd</code> format and once in the <code>.png</code> format.
 +
</li>
 +
<li>
 +
Next ''Open'' '''MaemoThemeMaker.jar'''
-
Once done ''save'' your file twice once in the '''.psd''' format and once in the '''.png''' format.
+
[[Image:Thememaker1.png]]
-
Next ''Open'' '''MaemoThemeMaker.jar'''
+
Make the theme file.
 +
<ol>
 +
<li>
 +
Enter Theme Name Max Length 9 Characters. 
 +
</li>
 +
<li>
 +
Enter Your Name or Screen Name if you wish to use that instead.
 +
</li>
 +
<li>
 +
Select Theme Background File.
 +
</li>
 +
<li>
 +
Select Theme Source File(Select the .png formatted file.)
 +
</li>
 +
<li>
 +
Layout for Theme is Chinook (Still works for Diablo)
 +
</li>
 +
<li>
 +
Theme Version ( I normally start with 0.1)
 +
</li>
 +
<li>
 +
Top Bar Height need to be at least 45 pixels but I always do 60 so the Top bar is always the same size since home view will always be 60.)
 +
</li>
 +
<li>
 +
I normally go with 12 or higher for system font.
 +
</li>
 +
<li>
 +
I notice anything over 20 and things start to get misshaped do to font size.
 +
</li>
 +
<li>
 +
I normally go with 12 or so on Title font also.
 +
</li>
 +
<li>
 +
I don’t use this but it just makes your borders smaller.
 +
</li>
 +
</ol>
 +
</li>
 +
<li>
 +
''Click'' '''Build Theme Tab''' then '''Build Theme!'''  
-
[http://www.andrewblck.com/Stuff/thememaker1.PNG Maemo Theme Maker Screenshot]
+
[[Image:Thememaker2.png]]
-
Steps to making theme file.
+
Once Progress bar hits 100% (sometimes I get a popup saying its done sometimes I don’t) you will find your theme files in the ThemeMaker Folder you unzip earlier.
 +
</li>
 +
<li>
 +
''Upload'' that file to your Tablet or Web and ''Install''.  Then share with everyone else.
 +
</li>
 +
</ol>
-
1. Enter Theme Name Max Length 9 Characters. 
+
=== Making a source package ===
-
2. Enter Your Name or Screen Name if you wish to use that instead.
+
==== Prerequisites ====
-
3. Select Theme Background File.
+
*7zip
 +
*Filezilla
 +
*Script to build source deb
-
4. Select Theme Source File(Select the .png formatted file.)
+
Download and Install to (N8x0 tablet):
 +
*Py2deb
 +
*Gainroot
 +
*ssh server
-
5. Layout for Theme is Chinook (Still works for Diablo)
+
==== Extract Data File ====
-
6. Theme Version ( I normally start with 0.1)
+
# Now right click on your .deb file > 7zip > Extract Here. That will give you two files: <code>control.tar</code> and <code>data.tar</code>.
 +
# Right Click on <code>data.tar.gz</code> > 7zip > Extract Here. That will give you <code>data.tar</code>
 +
# Right Click on <code>data.tar</code> > 7zip > Extract Here. That will give you a folder called <code>usr</code>
 +
# Now Create a new folder called <code>src</code> and move folder <code>usr</code> into that folder.
 +
# Next edit the py2deb script you downloaded earlier
 +
# Upload source data to tablet
 +
# Connect to tablet using filezilla
 +
# Create folder called <code>build</code> in <code>MyDocs</code> Folder
 +
# Upload <code>src</code> folder and <code>py2deb</code> script to build folder.
-
7. Top Bar Height need to be at least 45 pixels but I always do 60 so the Top bar is always the same size since home view will always be 60.)
+
==== Build Source ====
-
8. I normally go with 12 or higher for system font.
+
<ol>
 +
<li>
 +
Open xterm on tablet
 +
</li>
 +
<li>
 +
Type the following commands in xterm:
-
9. I notice anything over 20 and things start to get misshaped do to font size.
+
<pre>
 +
sudo gainroot
 +
cd /home/user/MyDocs/build
 +
python build_myapp.py
 +
</pre>
 +
</li>
 +
<li>
 +
Follow the instructions given in xterm
 +
</li>
 +
<li>
 +
Refresh view on filezilla > View > Refresh
 +
</li>
 +
</ol>
-
10. I normally got with 12 or so on Title font also.
+
==== Upload Source to extras-devel ====
-
11. I don’t use this but it just makes your borders smaller.
+
* Download <code>themename.changes</code>, <code>themename.dsc</code>, and <code>themename.tar.gz</code> files
 +
* Go to the [https://garage.maemo.org/extras-assistant/index.phpGarage Extras Assistant]
 +
* Login and follow steps to upload files an add files to builder queue.
 +
* Wait about 30 minutes then your files will be on [[extras-devel]].
-
Next ''Click'' '''Build Theme Tab''' then '''Build Theme!'''
+
== Further information ==
-
[http://www.andrewblck.com/Stuff/thememaker2.PNG Maemo Theme Maker Screenshot Build Tab]
+
* [http://talk.maemo.org/showthread.php?p=339928#post339928 How to - Build a source package and upload os2008 themes to extras-devel]
-
Once Progress bar hits 100% (sometimes I get a popup saying its done sometimes I don’t) you will find your theme files in the ThemeMaker Folder you unzip earlier.
+
[[Category:HowTo]]
-
 
+
[[Category:Power users]]
-
''Upload'' that file to your Tablet or Web and ''Install''.  Then share with everyone else.
+
[[Category:Themes]]

Latest revision as of 16:21, 6 February 2011

This tutorial is to help people make new themes. I have had several people ask me how to make new themes. Creating a theme is very easy; all you need is a image editing program like Photoshop, GIMP, Paintshop Pro, or any other. I prefer one that has Layers and other advance features but any will work. You will also need to download the theme maker from the Garage download page.

Contents

[edit] Guide

[edit] Making a binary package

  1. unzip the folder to your computer. (I keep the Theme maker folder on my desktop since that is where the program creates the theme files and it’s easy to get to).
  2. look into the folder there is an a file called NuvoPearl-template.psd that is the file you will edit to make your new theme. Open it up with your image editor.
  3. Edit this file to look like what ever you want your theme to look like (I wont go into how to edit the file in this document but I normally do layers over the background image this has several advantages over just editing the image.)
  4. save your file twice once in the .psd format and once in the .png format.
  5. Next Open MaemoThemeMaker.jar Image:Thememaker1.png Make the theme file.
    1. Enter Theme Name Max Length 9 Characters.
    2. Enter Your Name or Screen Name if you wish to use that instead.
    3. Select Theme Background File.
    4. Select Theme Source File(Select the .png formatted file.)
    5. Layout for Theme is Chinook (Still works for Diablo)
    6. Theme Version ( I normally start with 0.1)
    7. Top Bar Height need to be at least 45 pixels but I always do 60 so the Top bar is always the same size since home view will always be 60.)
    8. I normally go with 12 or higher for system font.
    9. I notice anything over 20 and things start to get misshaped do to font size.
    10. I normally go with 12 or so on Title font also.
    11. I don’t use this but it just makes your borders smaller.
  6. Click Build Theme Tab then Build Theme! Image:Thememaker2.png Once Progress bar hits 100% (sometimes I get a popup saying its done sometimes I don’t) you will find your theme files in the ThemeMaker Folder you unzip earlier.
  7. Upload that file to your Tablet or Web and Install. Then share with everyone else.

[edit] Making a source package

[edit] Prerequisites

  • 7zip
  • Filezilla
  • Script to build source deb

Download and Install to (N8x0 tablet):

  • Py2deb
  • Gainroot
  • ssh server

[edit] Extract Data File

  1. Now right click on your .deb file > 7zip > Extract Here. That will give you two files: control.tar and data.tar.
  2. Right Click on data.tar.gz > 7zip > Extract Here. That will give you data.tar
  3. Right Click on data.tar > 7zip > Extract Here. That will give you a folder called usr
  4. Now Create a new folder called src and move folder usr into that folder.
  5. Next edit the py2deb script you downloaded earlier
  6. Upload source data to tablet
  7. Connect to tablet using filezilla
  8. Create folder called build in MyDocs Folder
  9. Upload src folder and py2deb script to build folder.

[edit] Build Source

  1. Open xterm on tablet
  2. Type the following commands in xterm:
    sudo gainroot
    cd /home/user/MyDocs/build
    python build_myapp.py
    
  3. Follow the instructions given in xterm
  4. Refresh view on filezilla > View > Refresh

[edit] Upload Source to extras-devel

  • Download themename.changes, themename.dsc, and themename.tar.gz files
  • Go to the Extras Assistant
  • Login and follow steps to upload files an add files to builder queue.
  • Wait about 30 minutes then your files will be on extras-devel.

[edit] Further information