Como-crear-Temas-para-Metacity-Espa__ol-Lionel-Bino

13

Click here to load reader

Transcript of Como-crear-Temas-para-Metacity-Espa__ol-Lionel-Bino

Page 1: Como-crear-Temas-para-Metacity-Espa__ol-Lionel-Bino

Diseñar Metacity Themes --Diseño de un tema Metacity es una tarea relativamente simple, aunque modificando para satisfacer sus necesidades puede resultar algo lenta. Un tema Metacity se basa en un formato XML definido y, en función de un tema dado, una serie de imágenes [generalmente Portable Network Graphic, PNG, tipo de archivo].

Introducción --El primer paso que tendrá que hacer es crear un directorio en cualquiera de los siguientes lugares de interés --

$ PREFIX / share / themes / [nombre de tu tema] / metacity-1 /$ HOME / .themes / [nombre de tu tema] / metacity-1 /

de acuerdo con el nombre de tu tema. Aunque Metacity detectará temas en cualquier ubicación, tal vez sea prudente si mantiene el tema dentro de su directorio, mientras usted escribe y depurarlo.

El siguiente paso para crear un tema Metacity es editando un archivo dentro de ese directorio llamado "metacity-theme-1.xml. Este es el archivo que contiene la descripción de XML para el tema que tiene la descripción de la DTD siguientes. Al crear un nuevo tema Metacity, es útil para tener un tema existente, copiar toda la descripción XML y luego modificarla, en lugar de crear un tema completamente nuevo desde cero.

Las primeras líneas del formato son --

<?xml version="1.0"?><metacity_theme><info> <name>Atlanta</name> <author>Nombre del autor</author> <copyright>Tipo de Licencia</copyright> <date>Fecha</date> <description>Una descripcion del tema en cuestion</description></info>

<!-- Este lugar es donde puedes especificar tu tema! -->

</metacity_theme>

Tema Básico --Antes de entrar en una explicación detallada de cada parte, vamos a dar una visión general de las medidas adoptadas.

Tipos de ventanas compatiblesExisten 6 tipos de ventanas Metacity específicas que reconoce --

normal un alto nivel normal de la ventanadialog de una ventana de diálogomodal_dialog de una ventana de diálogo que tiene es decir, estado

modal. intervención requerida por el usuario antes de que puedan interactuar con su ventana padre

Page 2: Como-crear-Temas-para-Metacity-Espa__ol-Lionel-Bino

menu pinnable es decir, una ventana de menú. Menu comunutility persistentes, es decir una pequeña ventana de la utilidad. paleta o

caja de herramientas.Border una ventana que no debe presentar decoraciones suelen

decir. ventana a pantalla completa

EstilosPara cada tipo de ventana, es necesario asignar un "conjunto de estilo '[o decoración de ventanas] en él. Cada "conjunto de estilo 'es una composición de varios estilos para diferentes estados de marco». Usted tendrá que especificar cómo cada uno de estos estados marco debería mirar en su estilo. Estados de fotogramas se determina por la siguiente --

Si la ventana está centrada o no se centraSi la ventana está maximizada o de sombra [o ambos]Si la ventana puede ser vertical, horizontal, vertical y horizontalmente, cambiar el tamaño

Cada estado "marco" se asigna a un "estilo de marco. Un estilo de marco se divide en dos partes diferentes - marco de "piezas" y la ventana de 'botones'. Esta separación hace que sea más fácil para construir un tema Metacity.

Marco piezasSi se omite alguna de las piezas, entonces nada se establecerá para esa pieza. Metacity reconoce las piezas del marco siguiendo --

entire_background todo el marco de la ventana que se dibuja primero

titlebar área por encima de la ventana de la aplicación. Barra de titulos..

titlebar_middle ámbito de la barra de título no se considera una "ventaja" pieza de

left_titlebar_edge área a la izquierda de la barra de título

right_titlebar_edge área a la derecha de la barra de título

top_titlebar_edge área a la parte superior de la barra de título

bottom_titlebar_edge área a la parte inferior de la barra de título

title área que contiene el título

left_edge el borde izquierdo del marco

right_edge el borde derecho del marcobottom_edge el borde inferior del marcooverlay mismo que entire_background, sólo que se dibuja por

última vez

Botones de la ventanaMetacity reconoce los botones de la siguiente ventana --

close Botón Cerrar ventanamaximize Maximizar el botón de la ventanaminimize Botón Minimizar la ventana

Page 3: Como-crear-Temas-para-Metacity-Espa__ol-Lionel-Bino

menu Botón de Menú

y para los siguientes botones –

left_left_background Especifica el fondo del botón de la 1 ª a la izquierdaleft_middle_background Especifica el fondo del botón de la 2 ª a la izquierdaleft_right_background Especifica el fondo del botón de la 3 ª a la izquierdaright_left_background Especifica el fondo del botón de la 1 ª a la derecharight_middle_background Especifica el fondo del botón de la 2 ª a la derecharight_right_background Especifica el fondo del botón de la 3 ª a la derecha

Botones metacity.Para cada botón en la ventana, se debe especificar la forma en que deberían aparecer en un determinado número de estados del botón. Metacity reconoce los siguientes estados del botón –normal ¿Cómo el botón debe aparecer normalmente por un

estado dado el marco?pressed ¿Cómo el botón debería aparecer al 'click' [con un

ratón]?prelight ¿Cómo el botón debe aparecer cuando se obtiene el

foco?

Los menús de ventanaEl último paso para crear un tema es mediante la especificación de los iconos de menú. Estos aparecen en el menú de la ventana para las siguientes entradas –

close Icono Cerrar ventanamaximize Maximizar el icono de la ventanaminimize Icono Minimizar la ventanaunmaximize Icono de la ventana Unmaximize

y para los siguientes Estados dependiendo de la ventana....

normal ¿Cómo el icono de menú que aparecen normalmente en los menús de?prelight ¿Cómo el icono de menú que aparece cuando la entrada del menú se focaliza?active ¿Cómo el icono de menú que

aparece cuando la entrada del menú está activo [es decir. Comprobar]?

selected ¿Cómo el icono de menú que aparece cuando se selecciona la entrada de menú?

insensitive ¿Cómo el icono de menú que aparece cuando la entrada de

menú está desactivada [es decir. Gris]?

Page 4: Como-crear-Temas-para-Metacity-Espa__ol-Lionel-Bino

Probando Su tema

Al crear un tema Metacity, es aconsejable usar una aplicación especialmente diseñada para los temas de las pruebas, metacity-theme-viewer Para utilizar esta aplicación, se limitan a brindar en el tema que desea cargar como un argumento. El tema que desea cargar se analiza, y si hay errores, se producirá la salida cualquier error a la línea de comandos. Usted debe corregir cualquier error antes de que un tema se carga correctamente.Esta aplicación sólo es realmente útil cuando se diseña el estilo de la decoración de las ventanas, ya que no será capaz de interactuar con los botones o los menús de la ventana.Para cambiar de tema nuevo, usted necesita utilizar gconftool-2 o el uso de la interfaz de usuario en las Preferencias del escritorio> Tema, seleccione la pestaña "Borde de ventana Theme '. Si se utiliza gconftool2-, usted necesita utilizar el comando siguiente -- gconftool-2 --type=string --set /apps/metacity/general/theme [theme_name]

Page 5: Como-crear-Temas-para-Metacity-Espa__ol-Lionel-Bino

El interior de DeepDown

Marco GeometríaLo primero que tendrá que crear es la "geometría del cuadro. El nombre de la geometría del cuadro se hace referencia más adelante por un estilo determinado "marco".

<frame_geometry name="my_frame_geometry">

<!-- Aquí es donde tenemos que empezar a especificar la geometría de su marco -->

</frame_geometry>

El siguiente diagrama muestra las diferentes anchuras y alturas que puede modificar la geometría en un marco determinado –

La geometría del cuadro tiene una serie de atributos opcionales que puede proporcionar -- has_title Determina si la altura del texto del título debe ser

incluido en la calculadora de altura. Este defecto a true si no se especifica.

title_scale Utilización de marcado Pango - xx-small, x-small, small, medium, large, x-large y XX-grande. El valor predeterminado para recoger a su fuente de sobremesa si no se especifica.

rounded_top_left Determina si la esquina superior izquierda de la ventana debe ser redondeado. Este defecto a false si no se especifica.

rounded_top_right Determina si la esquina superior derecha de la ventana debe ser redondeado. Este defecto a false si no se especifica.

rounded_bottom_left Determina si la esquina inferior izquierda de la ventana debe ser redondeado. Este defecto a false si no se especifica.

Page 6: Como-crear-Temas-para-Metacity-Espa__ol-Lionel-Bino

rounded_bottom_right Determina si la esquina inferior derecha de la ventana debe ser redondeado. Este defecto a false si no se especifica.

<frame_geometry name="normal_geometry"> <distance name="left_width" value="6"/> <distance name="right_width" value="6"/> <distance name="bottom_height" value="7"/> <distance name="left_titlebar_edge" value="6"/> <distance name="right_titlebar_edge" value="6"/> <distance name="button_width" value="17"/> <distance name="button_height" value="17"/> <distance name="title_vertical_pad" value="4"/> <border name="title_border" left="3" right="12" top="4" bottom="3"/> <border name="button_border" left="0" right="0" top="1" bottom="1"/></frame_geometry>

Al especificar la geometría del cuadro, es posible utilizar la herencia. Esto simplemente sobrescribe los valores que establecen que se heredan de los padres.

<frame_geometry name="borderless_geometry" rounded_top_left="true" rounded_top_right="true" parent="normal_geometry"> <distance name="left_width" value="0"/> <distance name="right_width" value="0"/> <distance name="bottom_height" value="0"/> <distance name="left_titlebar_edge" value="0"/> <distance name="right_titlebar_edge" value="0"/> </frame_geometry>

En lugar de especificar anchuras y alturas de botón, usted puede especificar una relación de aspecto en su lugar.

<aspect_ratio name="button" value="1.0"/>

Operaciones de dibujo'operaciones de dibujo son el corazón de diseño de un tema Metacity. Con el fin de establecer con éxito una parte de la trama, tendrá que especificar una operación de dibujo para que «pieza de marco».

<draw_ops name="my_drawing_operation">

<! - Aquí es donde tenemos que empezar a especificar su operación de dibujo ->

</ draw_ops>

OperadoresLas operaciones de dibujo se presentaron declararon en general, pero también se puede colocar en línea [véase el ejemplo de abajo]. La siguiente lista de los operadores están permitidas dentro de una operación de dibujo --

Operador Significado Ejemplo

Page 7: Como-crear-Temas-para-Metacity-Espa__ol-Lionel-Bino

+ Más 2 + 3-- Menos 5-4* Multiplicar 3 * 2/ Dividir 10 / 2% Módulo 34% 3«max» Máximo 4 `` max 5min »» Mínimo 7 `min` 3() Paréntesis (5 * 3) + 5Cabe señalar que las normas precidence normal aplicable a todos los operadores.

Constantes

Dentro de las operaciones de dibujo, es posible utilizar las variables predefinidas o constantes. Constantes han de tener visión declarada y debe comenzar con una letra mayúscula.

<constant name="MyConstant" value="3"/>

La siguiente es una lista de variables predefinidas que pueden ser utilizados –

width Anchura de la zona objetivoheight Altura de la zona objetivoobject_width Anchura natural del objeto que está dibujadoobject_height Natural altura del objeto está elaborandoleft_width Distancia desde la izquierda del marco de la ventana del cliente deright_width Distancia desde la derecha del marco de la ventana del clientetop_height Distancia desde la parte superior del marco de ventana del clientebottom_height Distancia desde la parte inferior del marco de la ventana del clientemini_icon_width Ancho de la mini-icono para la ventanamini_icon_height Altura de la mini-icono para la ventanaicon_width Ancho de la gran iconoicon_height Altura de los iconos grandestitle_width Ancho de títulos de textotitle_height Altura del título del texto

Operaciones

Metacity admite las siguientes operaciones en cualquier dibujo dado «operación» --

line Dibuja una línea con origen (x1, y1) y destino (x2, y2) y el color dado. Los colores pueden ser un nombre de color como "azul", un número hexadecimal como "# FF0099", o un color de un tema GTK dado como "gtk: base [NORMAL]" [Véase algunos ejemplos más abajo]. Toma anchura atributos adicionales, dash_on_lengthy dash_off_length, que son "0" por defecto.

<line color="#00FF00" x1="3" y1="4" x2="0" y2="height" dash_off_length="2" dash_on_length="3"/>

Page 8: Como-crear-Temas-para-Metacity-Espa__ol-Lionel-Bino

rectangle Dibuja un rectángulo con origen (x, y) y teniendo en cuenta la anchura y la altura.Se necesitan atributos opcionales para cubrir, que es "falso" por defecto.

<rectangle color="blend/gtk:fg[NORMAL]/gtk:bg[NORMAL] x="0" y="0" width="width" height="height" filled="true"/>

arc Dibuja un arco con origen (x, y) y dada la anchura, altura, start_angle yextent_angle. Se necesitan atributos opcionales para cubrir, que es "falso" por defecto.

<arc color="yellow" x="0" y="0" width="width-1" height="height-1" start_angle="30" extent_angle="180"/>

tint APLICA un tinte de origen (x, y) y dada la anchura, altura, color y alfa.

<tint color="orange" alpha="0.2" x="0" y="0" width="width - mini_icon_width" height="height"/>

gradient Dibuja un gradiente de origen (x, y) y dada la anchura, altura, tipo [ya sea vertical, horizontal o diagonal] y cualquier número de elementos de color.

<gradient type="vertical" x="10" y="10" width="width - title_width" height="height / 4"> <color value="blue"> <color value="gtk:fg[SELECTED]> <color value="blend/gtk:light[SELECTED]/gtk:dark[ACTIVE]"></gradient>

image Mapas de una imagen para el elemento de origen (x, y) y dado el ancho, la altura y el nombre de archivo. Se necesita argumentos opcionales alfa y colores, que son "0" y no hay color por defecto.

<image filename="my_image.png" x="0" y="0" width="width" height="height" alpha="0.5" colorize="#FF3399"/>

gtk_arrow Dibuja una flecha con origen (x, y) y teniendo en cuenta la anchura, altura, estado de GTK, sombra [no, dentro, fuera, etched_in y etched_out] y la dirección [arriba, abajo, izquierda o derecha]. Toma argumento opcional llena, que es "falso" por defecto.

<gtk_arrow state="normal" x="2" y="2" width="width-4" height="height" shadow="in" arrow="up" filled="true"/>

gtk_box Dibuja un cuadro de origen (x, y) y dada la anchura, altura, estado de GTK y lasombra.

<gtk_box state="normal" x="2" y="2" width="width - 4" height="height" shadow="out"/>

gtk_vline Dibuja una línea vertical con origen (x, y1) y destino (x, y2) y el estado de GTK.

<gtk_vline state="normal" x="0" y1="0" y2="height"/>

icon Llama la ventana con el icono de origen (x, y) y teniendo en cuenta la anchura y la altura. Toma alfa argumento opcional, que es "0" por defecto.

<icon x="10" y="30" width="width / 3" height="height / 3" alpha="0.3"/>

Page 9: Como-crear-Temas-para-Metacity-Espa__ol-Lionel-Bino

title Señala el texto con el título de la ventana de origen (x, y) y el color dado.

<title x="10" y="30" color="gtk:text[NORMAL]"/>

clip Clips de una zona determinada, con origen (x, y) y teniendo en cuenta la anchuray la altura.

<clip x="5" y="2" width="width - 10" height="height – SpacerHeight"/>

include Incluir otras operaciones de dibujo con el nombre dado. Se necesita argumentos opcionales (x, y), anchura y altura, con valores por defecto FIXME.

<include name="other_drawing_operations"/>

tile Otro dibujo Azulejos operaciones de lista con el nombre, tile_width y tile_height.Se necesita argumentos opcionales (x, y), anchura, altura, tile_xoffset ytile_yoffset con impagos FIXME.

<tile name="other_drawing_operations" tile_width="10" tile_height="10"/>

Estilo del marcoLa geometría del cuadro Cuando se crea un "estilo de marco ', que se ata en las diversas diferentes piezas marco' y 'botones de la ventana" a un "específico. Por lo general, la necesidad de crear un estilo para los estados de ventana normal, al máximo, a la sombra, maximized_and_shaded y en función de si la ventana está en foco o no.

En primer lugar, crear una plantilla que contendrá toda la información necesaria para establecer un estilo de marco dado.

<frame_style name="my_frame_style" geometry="my_frame_geometry">

<! - Aquí es donde tenemos que empezar a precisar su estilo de marco ->

</ frame_style>

La herencia es también permitió en un estilo de marco determinado. Cualquier cosa puede ser re-especificado para reemplazar el estilo de los padres.

<frame_style name="my_child_frame_style" parent="my_frame_style" geometry="my_frame_geometry">

</ frame_style>

Marco piezasPara dibujar las partes del marco, usted tendrá que proporcionar una operación de dibujo para cada pieza del marco. Si se omite una parte, entonces nada se extraerán de la parte de la estructura.

<piece position="entire_background" draw_ops="my_drawing_operation"/>

Alternativamente, como se mencionó anteriormente, usted puede proporcionar una operación de línea de dibujo.

Page 10: Como-crear-Temas-para-Metacity-Espa__ol-Lionel-Bino

<piece position="left_edge"> <draw_ops> <rectangle color="#FF0000" x0="0" y0="0" x1="width" y1="height" filled="true"/> </draw_ops></piece>

Los siguientes diagramas muestran las diferentes piezas que se pueden estilo en un marco determinado –

Botones de la ventana

Como se mencionó anteriormente, es necesario especificar un conjunto mínimo de botones de la ventana para un tema dado. Los métodos de dibujo debe ser proporcionado para el cierre, maximizar, minimizar y botones del menú definido para cada uno de los dos estados - normal y presionado. PRELIGHT Si no se especifica, lo normal será utilizada para ese estado.

<button function="close" state="normal" draw_ops="my_drawing_operation"/>

Page 11: Como-crear-Temas-para-Metacity-Espa__ol-Lionel-Bino

Junto con la especificación de los botones de la ventana, puede especificar cómo se puede dibujar una parte del botón en función de la posición en el marco de la ventana. Si todos los botones tienen el mismo fondo, sólo tiene que especificar las operaciones de dibujo para left_middle_background y right_middle_background.

<button function="left_middle_background" state="pressed" draw_ops="my_background_drawing_operation"/>

Poner toda esta información en un estilo de marco único "podría parecerse a la siguiente --

<frame_style name="my_frame_style" geometry="my_frame_geometry">

<! - En primer lugar, mostrar el título -> <piece position="title" draw_ops="title_normal"/>

<! - Vamos a dar algunos de los bordes belleza -> <piece position="left_edge" draw_ops="draw_left_edge"/> <piece position="right_edge" draw_ops="draw_right_edge"/> <piece position="bottom_edge" draw_ops="draw_bottom_edge"/>

<! - Tenemos que especificar las posiciones de los botones ahora -> <button function="left_middle_background" state="pressed" draw_ops="background_button"/> <button function="right_middle_background" state="pressed" draw_ops="background_button"/>

<! - Tenemos que especificar los botones de ahora -> <button function="close" state="normal" draw_ops="close_button"/> <button function="close" state="pressed" draw_ops="minimize_button"/> <button function="minimize" state="normal" draw_ops="minimize_button"/> <button function="minimize" state="pressed" draw_ops="minimize_button_pressed"/> <button function="maximize" state="normal" draw_ops="maximize_button"/> <button function="maximize" state="pressed" draw_ops="maximize_button_pressed"/> <button function="menu" state="normal" draw_ops="menu_button"/> <button function="menu" state="pressed" draw_ops="menu_button_pressed"/> </ frame_style>

Iconos de menúEn los menús de la ventana se debe especificar los iconos para ver las entradas del menú Cerrar, Maximizar, Minimizar y UnMaximize. Es suficiente para especificar las operaciones de dibujo para el estado normal solamente. Si lo desea, puede especificar operaciones de dibujo para los otros estados, como se mencionó anteriormente.

<window_icon function="close" state="normal" draw_ops="menu_close_icon"/> <window_icon function="maximize" state="normal" draw_ops="menu_maximize_icon"/> <window_icon function="minimize" state="normal"

Page 12: Como-crear-Temas-para-Metacity-Espa__ol-Lionel-Bino

draw_ops="menu_minimize_icon"/> <window_icon function="unmaximize" state="normal" draw_ops="menu_unmaximize_icon"/>

Marco Conjunto de estilosUna vez que tenemos varios estilos de marco que necesitamos para asignarlos a la ventana de diversos estados. Hacemos esto mediante la creación de un «conjunto marco de estilo". El atributo de nombre se hace referencia más adelante dado por AA 'tipo de ventana.

<frame_style_set name="my_style_set"> <frame focus="yes" state="normal" resize="both" style="my_normal_focused_style"/> <frame focus="no" state="normal" resize="both" style="my_normal_unfocused_style"/> <frame focus="yes" state="maximized" style="my_maximized_focused_style"/> <frame focus="no" state="maximized" style="my_maximized_unfocused_style"/> <frame focus="yes" state="shaded" style="my_shaded_focused_style"/> <frame focus="no" state="shaded" style="my_shaded_unfocused_style"/> <frame focus="yes" state="maximized_and_shaded" style="my_maximized_shaded_focused_style"/> <frame focus="no" state="maximized_and_shaded" style="my_maximized_shaded_unfocused_style"/> </ frame_style_set>

Como se puede ver arriba, usted debe proporcionar un marco para cada una de la ventana de los estados, con foco de la ventana sí y no.Las referencias a su atributo de estilo de 'estilo de marco. También debe proporcionar un atributo para cambiar el tamaño de cualquier marco de un estado normal con el valor de «ambas». Si lo desea, puede especificar los marcos para otros no cambiar el tamaño de los atributos, horizontal y vertical.

WindowsEl mapa final que debe proporcionar es mapear la ventana "tipos" de dado "establece el estilo de marco. Cada tipo de ventana necesita un conjunto de estilo - normal, de diálogo, modal_dialog, menú, la utilidad y la frontera

<window type="normal" style_set="my_normal_style_set"/> <window type="dialog" style_set="my_dialog_style_set"/> <window type="modal_dialog" style_set="my_modal_dialog_style_set"/> <window type="menu" style_set="my_menu_style_set"/> <window type="utility" style_set="my_utility_style_set"/> <window type="border" style_set="my_border_style_set"/>

Descripción generalComo puede ver, crear un tema Metacity tomar una cantidad un poco grande de tiempo. Es aconsejable tomar los temas existentes y modificar y observar los cambios que realice en forma gradual, en vez de empezar de nuevo. Muchos temas [Crux y Aqua buenos ejemplos que] se basan casi exclusivamente en imágenes, que será más difícil para que usted pueda modificar. Mientras que un tema compuesto por imágenes puede parecer a veces muy tentador, debe permitir que consideran que se necesita una cantidad considerable de tiempo a hacer el tema.

Page 13: Como-crear-Temas-para-Metacity-Espa__ol-Lionel-Bino

Un buen recurso para los temas de Metacity es art.gnome.org. Informes de fallos deben hacerse en bugzilla.gnome.org en el componente de la "Metacity.

Metacity fue escrito por Havoc Pennington y está disponible bajo la GNU General Public License [GPL]. Este documento fue escrito por Fernando San Martín Woerner, que tiene cero talento artístico, Traducido al español por Lionel Bino está licenciado bajo la GPL y los derechos de autor de 2002, Sun Microsystems Inc.