KDE TechBase
  • Page
  • Discussion
  • Edit
  • History
KDE TechBase is a Wiki - You can help! Please contribute! Questions?
Please ask development related questions in the KDE Community Forum.

Development/Architecture/KDE3/Icon Loader

< Development | Architecture | KDE3

Loading and installing icons in KDE

Icons are an important user interface element in any desktop environment. Because of different user preferences and video hardware, one icon may come in different sizes and display depths. In order to make this manageable, a standard way of storing and accessing icons has been developed.

Contents

  • 1 Loading icons
    • 1.1 Accessing the iconloader
    • 1.2 Loading icons with loadIcon
    • 1.3 Icon groups
    • 1.4 loadIcon continued
  • 2 Installing icons
    • 2.1 Default icon sizes
    • 2.2 Icon context
    • 2.3 Directory hierarchy
    • 2.4 Directory roots
    • 2.5 Installing themed icons
    • 2.6 Loading themed icons
    • 2.7 Unthemed icons
  • 3 Conclusion

[edit] Loading icons

[edit] Accessing the iconloader

Icons are loaded using the class KIconLoader. Every KDE appliation has a global iconloader object. You can access this object with:


Invalid language argument, "cppqt3", select one from the list:
actionscript3
ocaml-brief
dcs
cfdg
gnuplot
whitespace
lisp
cpp
xml
ocaml
prolog
reg
diff
css
providex
pixelbender
xpp
applescript
thinbasic
c
d
caddcl
freebasic
lolcode
actionscript
cpp-qt
dos
dot
sas
cmake
winbatch
hq9plus
abap
cadlisp
oobas
delphi
rebol
haskell
ruby
povray
progress
kixtart
purebasic
oberon2
email
groovy
oracle11
pascal
c_mac
lsl2
vbnet
tcl
tsql
make
cppqt
apache
matlab
sql
php-brief
klonec
lua
text
scala
m68k
bf
html4strict
autoit
scilab
autohotkey
sdlbasic
fo
oracle8
glsl
smarty
lscript
robots
io
xorg_conf
typoscript
python
visualfoxpro
nsis
z80
ada
gml
cobol
smalltalk
bibtex
csharp
apt_sources
mirc
po
gdb_backtrace
eiffel
modula3
vb
basic4gl
objc
whois
lotusformulas
genero
java
qbasic
vim
verilog
gettext
mxml
pic16
idl
klonecpp
vhdl
plsql
asm
asp
per
visualprolog
javascript
rails
php
awk
mysql
latex
powershell
locobasic
blitzbasic
erlang
bnf
java5
teraterm
intercal
mpasm
ini
boo
bash
inno
cfm
fortran
rsplus
perl
cil
scheme
lotusscript
avisynth
properties

[edit] Loading icons with loadIcon

The iconloader loads icons, transparently caches them and applies effects. To load an icon, use the method loadIcon(), which is defined like this:


Invalid language argument, "cppqt3", select one from the list:
actionscript3
ocaml-brief
dcs
cfdg
gnuplot
whitespace
lisp
cpp
xml
ocaml
prolog
reg
diff
css
providex
pixelbender
xpp
applescript
thinbasic
c
d
caddcl
freebasic
lolcode
actionscript
cpp-qt
dos
dot
sas
cmake
winbatch
hq9plus
abap
cadlisp
oobas
delphi
rebol
haskell
ruby
povray
progress
kixtart
purebasic
oberon2
email
groovy
oracle11
pascal
c_mac
lsl2
vbnet
tcl
tsql
make
cppqt
apache
matlab
sql
php-brief
klonec
lua
text
scala
m68k
bf
html4strict
autoit
scilab
autohotkey
sdlbasic
fo
oracle8
glsl
smarty
lscript
robots
io
xorg_conf
typoscript
python
visualfoxpro
nsis
z80
ada
gml
cobol
smalltalk
bibtex
csharp
apt_sources
mirc
po
gdb_backtrace
eiffel
modula3
vb
basic4gl
objc
whois
lotusformulas
genero
java
qbasic
vim
verilog
gettext
mxml
pic16
idl
klonecpp
vhdl
plsql
asm
asp
per
visualprolog
javascript
rails
php
awk
mysql
latex
powershell
locobasic
blitzbasic
erlang
bnf
java5
teraterm
intercal
mpasm
ini
boo
bash
inno
cfm
fortran
rsplus
perl
cil
scheme
lotusscript
avisynth
properties

As you see, there are a lot of parameters. The first two are most important:

  1. name - The name of the icon to load. You must pass the bare icon name here, without extension.
  2. group - The icon group. This is explained below.

[edit] Icon groups

The idea of an icon group is an important concept in the KDE icon scheme. The icon group denotes where on the screen the icon is going to be used. This is relevant because the KDE user can bind icon sizes and visual effects to each group. When passing the icon group to the icon loader, you are in fact telling it which incarnation of the icon to load. And by requiring the group argument, the iconloader provides the means to have a consistent and configurable icon look over the whole KDE desktop.

For example: The user can configure that he wants 32 pixel icons with 0.2 desaturation for the main toolbars.

The available icon groups are given below. All are defined in the KIcon class, so prefix them with KIcon::.

  • Desktop - Icons for use on the desktop, in the filemanager and similar places.
  • Toolbar - Icon for in normal toolbars.
  • MainToolbar - Icons for in the main toolbar. An application can have multiple toolbars, of which one is allways the main toolbar. This typically has entries like "Save" and "Open" and contains larger icons than the other toolbars.
  • Small - Various small icons, like the ones in popup menus, listviews and treelists.
  • User - Special group for loading application specific icons. This is explained in section 3: Installing icons.

So, to load the icon "kfind" for use in the Desktop group, you'd use:


Invalid language argument, "cppqt3", select one from the list:
actionscript3
ocaml-brief
dcs
cfdg
gnuplot
whitespace
lisp
cpp
xml
ocaml
prolog
reg
diff
css
providex
pixelbender
xpp
applescript
thinbasic
c
d
caddcl
freebasic
lolcode
actionscript
cpp-qt
dos
dot
sas
cmake
winbatch
hq9plus
abap
cadlisp
oobas
delphi
rebol
haskell
ruby
povray
progress
kixtart
purebasic
oberon2
email
groovy
oracle11
pascal
c_mac
lsl2
vbnet
tcl
tsql
make
cppqt
apache
matlab
sql
php-brief
klonec
lua
text
scala
m68k
bf
html4strict
autoit
scilab
autohotkey
sdlbasic
fo
oracle8
glsl
smarty
lscript
robots
io
xorg_conf
typoscript
python
visualfoxpro
nsis
z80
ada
gml
cobol
smalltalk
bibtex
csharp
apt_sources
mirc
po
gdb_backtrace
eiffel
modula3
vb
basic4gl
objc
whois
lotusformulas
genero
java
qbasic
vim
verilog
gettext
mxml
pic16
idl
klonecpp
vhdl
plsql
asm
asp
per
visualprolog
javascript
rails
php
awk
mysql
latex
powershell
locobasic
blitzbasic
erlang
bnf
java5
teraterm
intercal
mpasm
ini
boo
bash
inno
cfm
fortran
rsplus
perl
cil
scheme
lotusscript
avisynth
properties

[edit] loadIcon continued

Now lets discuss the other parameters of loadIcon.

  1. size - Override the globally configured size for the specified icon group. Effects bound to the group are still applied.
  2. state - The icon state. The icon state is one of KIcon::DefaultState, KIcon::ActiveState or KIcon::DisabledState. The icon state denotes in which state the icon is. Toolbar buttons, for example, are in state active if the mouse pointer is above them, in state disabled when they are not available, and default otherwise. Each icon state can have different effects assigned to it to give the user visual feedback.
  3. path_store - If you want to know where the icon you just loaded is in the filesystem, you can pass a pointer to a QString here and the icon path is stored there.
  4. canReturnNull - If the requested icon is not found, the result of loadIcon depends on this parameter. If canReturnNull is true, a null pixmap will be returned, if not, the "unknown" icon is returned.

[edit] Installing icons

Icons may come in different sizes and display depths. I shall refer to these icons as themed icons. Icons that come in just one form are referred to as unthemed icons.

[edit] Default icon sizes

Themed icons come in different sizes and display depths. The standard sizes are:

40 Colors
16x16 pixels
22x22 pixels
32x32 pixels
Truecolor
22x22 pixels
32x32 pixels
48x48 pixels

Please refer to the KDE icon factory for information on which icon sizes are mandatory and more. Remember that each of these sizes can be bound to an icon group.

[edit] Icon context

Themed icons are stored in a directory hierarchy according to their 1. depth, 2. size and 3. context. The term context is new concept introduced by the KDE icon scheme. The context of an icon is what the icon means. The standard contexts are given below:

  • action - The icon represents an action in a toolbar, for example "Open" or "Save".
  • application - The icon represents an application, for example "kfind".
  • device - The icon represents something related to a device, for example "floppy" or "mount".
  • filesystem - The icon represents something in the filesystem, for example "directory", "socket" or "trashcan".
  • mimetype - The icon represents an mimetype, for example "text/html".

Contexts are important in one case: selecting an icon. When an application wants the user to select an icon for, say, a toolbar, it would be very user unfriendly to show every single icon installed in KDE. Instead, it is much better to let the user select an icon from the "action" icons only. These all represent some action and therefore are suitable for in toolbars.

[edit] Directory hierarchy

The directory hierarchy in which themed icons are stored follows. The directory names are self explanatory.

hicolor/
    22x22/
        actions/
        apps/
        devices/
        filesystems/
        mimetypes/
    32x32/
        ...
    48x48/
        ...

locolor/
    16x16/
        ...
    22x22/
        ...
    32x32/
        ...

[edit] Directory roots

Themed icons can be installed either globally with respect to KDE, or in application specific place. In the global case, the icon theme hierarchy resides under $KDEDIR/share/icons while in the application specific case, it is under $KDEDIR/share/apps/$APPNAME/icons.

[edit] Installing themed icons

The KDE source configuration system (specifically, am_edit) has support for installing themed icons. First, you have to name your icons in a way that it is clear where it must be installed. The naming convention is explained in the table below:

depth size - context - name .png
hi 16 action
lo 22 app
32 device
48 filesys
mime

Examples:

lo22-action-open.png
hi48-app-kfind.png

To install these icons globally, add this line to your Makefile.am.

KDE_ICON = open kfind

and to install them in an application specific directory, use this:

icondir = $(kde_datadir)/myapp/icons
icon_ICON = open kfind

[edit] Loading themed icons

Themed icons are loaded with the iconloader, using the standard icon groups. For example:


Invalid language argument, "cppqt3", select one from the list:
actionscript3
ocaml-brief
dcs
cfdg
gnuplot
whitespace
lisp
cpp
xml
ocaml
prolog
reg
diff
css
providex
pixelbender
xpp
applescript
thinbasic
c
d
caddcl
freebasic
lolcode
actionscript
cpp-qt
dos
dot
sas
cmake
winbatch
hq9plus
abap
cadlisp
oobas
delphi
rebol
haskell
ruby
povray
progress
kixtart
purebasic
oberon2
email
groovy
oracle11
pascal
c_mac
lsl2
vbnet
tcl
tsql
make
cppqt
apache
matlab
sql
php-brief
klonec
lua
text
scala
m68k
bf
html4strict
autoit
scilab
autohotkey
sdlbasic
fo
oracle8
glsl
smarty
lscript
robots
io
xorg_conf
typoscript
python
visualfoxpro
nsis
z80
ada
gml
cobol
smalltalk
bibtex
csharp
apt_sources
mirc
po
gdb_backtrace
eiffel
modula3
vb
basic4gl
objc
whois
lotusformulas
genero
java
qbasic
vim
verilog
gettext
mxml
pic16
idl
klonecpp
vhdl
plsql
asm
asp
per
visualprolog
javascript
rails
php
awk
mysql
latex
powershell
locobasic
blitzbasic
erlang
bnf
java5
teraterm
intercal
mpasm
ini
boo
bash
inno
cfm
fortran
rsplus
perl
cil
scheme
lotusscript
avisynth
properties

This will load the "kfind" icon, of depth and size specified for the Desktop group.

[edit] Unthemed icons

Unthemed icons are installed in $KDEDIR/share/apps/$APPNAME/pics. To install them, use this in you Makefile.am.

icondir = $(kde_datadir)/myapp/pics
icon_DATA = open kfind

You must not give the icons special names. Also, no further processing is done on them: no effects and size,depth selection is done.

Unthemed icons can be loaded with the iconloader using the User group. This will load a user icon:


Invalid language argument, "cppqt3", select one from the list:
actionscript3
ocaml-brief
dcs
cfdg
gnuplot
whitespace
lisp
cpp
xml
ocaml
prolog
reg
diff
css
providex
pixelbender
xpp
applescript
thinbasic
c
d
caddcl
freebasic
lolcode
actionscript
cpp-qt
dos
dot
sas
cmake
winbatch
hq9plus
abap
cadlisp
oobas
delphi
rebol
haskell
ruby
povray
progress
kixtart
purebasic
oberon2
email
groovy
oracle11
pascal
c_mac
lsl2
vbnet
tcl
tsql
make
cppqt
apache
matlab
sql
php-brief
klonec
lua
text
scala
m68k
bf
html4strict
autoit
scilab
autohotkey
sdlbasic
fo
oracle8
glsl
smarty
lscript
robots
io
xorg_conf
typoscript
python
visualfoxpro
nsis
z80
ada
gml
cobol
smalltalk
bibtex
csharp
apt_sources
mirc
po
gdb_backtrace
eiffel
modula3
vb
basic4gl
objc
whois
lotusformulas
genero
java
qbasic
vim
verilog
gettext
mxml
pic16
idl
klonecpp
vhdl
plsql
asm
asp
per
visualprolog
javascript
rails
php
awk
mysql
latex
powershell
locobasic
blitzbasic
erlang
bnf
java5
teraterm
intercal
mpasm
ini
boo
bash
inno
cfm
fortran
rsplus
perl
cil
scheme
lotusscript
avisynth
properties

[edit] Conclusion

There are 3 ways to install icons: global themed, application specific themed and unthemed. All types of icons can be loaded with the iconloader. You should choose a specific installation depending on your needs.


Initial Author: Geert Jansen <jansen@kde.org>

Retrieved from "http://techbase.kde.org/Development/Architecture/KDE3/Icon_Loader"
Categories: KDE3 | Architecture

Navigation

  • Home
  • Help
  • Recent changes

Sections

  • Getting started
  • Development
  • Schedules
  • Policies
  • Contribute
  • Projects

Toolbox

  • What links here
  • Related changes
  • Special pages
  • Printable version
  • Permanent link

Personal tools

  • 38.107.191.96
  • Talk for this IP
  • Log in / create account
  • Login with OpenID
Creative Commons License SA 3.0 as well as the GNU Free Documentation License 1.2
KDE® and the K Desktop Environment® logo are registered trademarks of KDE e.V. | Legal