Ir al contenido principal

MI PROPIO TEMA DE VENTANAS PARA XFCE



   Parece mentira, pero en muy poco tiempo he pasado de no saber casi nada sobre el gestor de ventanas
de Xfce, que lleva el nombre de Xfwm, a modificar, (y yo creo que mejorar) , un tema para vestir adecuadamente el marco de las ventanas de mi ordenador.

  Lo primero, por supuesto, era encontrar un tema de mi gusto, así que me di una vuelta por Xfce-Look.
Personalmente, a mi siempre me ha gustado el diseño y apariencia de los Mac, pero tampoco es que quiera una copia exacta, ni mucho menos, me gusta que se note que estoy usando Ñu-Linux. En resumidas cuentas, buscaba un tema oscuro, con los botones redondos, con los típicos colores de los botones de un Mac, rojo, verde y amarillo.

   Lo más parecido que encontré fue el tema "WoW", click aquí . Así que lo descargué en el link del primer enlace, el que pone, "WoW-Latest GTK Theme" , y lo instalé en el ordenador. Lo primero que hice para instalar fue descomprimir el paquete en formato "zip" que me había descargado, (click derecho sobre el archivo zip y seleccionamos en el menú desplegable "extraer aquí") al hacerlo me encontré con que contenía otros cinco paquetes en formato "tar.gz".

   Entre todos ellos seleccione el que se llama, "WoW-Dark.tar.gz", (supuse que sería el que contenía las variaciones del tema más oscuras) , y volví a descomprimir, (click derecho sobre el archivo, etc, etc). Abrí la carpeta resultante y comprobé que contenía otra carpeta con el tema del marco de las ventanas nombrado "xfmw4", eliminé las carpetas para el tema gtk2 y metacity que no me interesaban, y el archivo de texto "Index.theme".

   Después de eso abrí otra vez Thunar en mi carpeta personal, y usando la combinación de teclas "Control+h", para ver los archivos ocultos, localicé la carpeta donde se instalan los temas para mi usuario, nombrada como ".themes". (Si vosotros no la tenéis sólo tenéis que crearla, recordar que poniendo un punto delante del nombre de una carpeta ésta quedará oculta) , y arrastré dentro de esta carpeta la carpeta del tema que había descargado. Lo explicaré un poco mejor con ayuda de unas imágenes:




   Con estos pasos, y tras cerrar Thunar ya tenemos nuestro tema instalado, ahora para activarlo tenemos que irnos al "Menú del sistema > Configuración > Gestor de ventanas". Y en la lista de nuestra izda buscamos el nombre de nuestro tema, y al marcarlo, veremos los cambios inmediatamente:


   La verdad es que me llevé una pequeña desilusión, había varias cosas que no me gustaban.
Lo primero, el color del texto de las ventanas era de un gris apagado y mortecino. Lo segundo es que el marco de las ventanas por abajo era blanco, lo tercero, aunque la apariencia de los botones me encantaba, los colores no eran lo que yo buscaba. Eran de color rojo, azul y verde, en vez de rojo, verde y amarillo. Y finalmente la distribución de los botones estaba bloqueada y no existía el botón para enrollar y desenrollar la ventana que a mi me gusta utilizar.



BUSCANDO SOLUCIONES


   Lo primero que había que solucionar, era el bloqueo en la distribución de los botones, eso ya sabía
hacerlo, como explico en este post, click aquí. Me voy a la carpeta del tema y busco el archivo "themerc" para comentar la línea "button_layout" y desbloquear los botones.

   Justo debajo, veo que hay una línea, "active_text_color", con un valor hexadecimal que se corresponde a un color. Yo "controlo" lo justo de inglés, pero "active text color", vendría a ser en "cristiano", "color de texto activo". Parece bastante probable que se trate del color del texto del marco de la ventana, así que abro el navegador y en esta página, click aquí , busco el código de un color naranja, que quedaría muy bien en ese fondo casi negro, sustituyo un código por otro, y guardo los cambios en "gedit".

   No sucede nada, así que abro de nuevo el gestor de ventanas, selecciono un tema distinto y vuelvo a seleccionar el tema que estoy editando, (de esta manera se refresca) , y... ¡Bingo! , ya tengo los botones desbloqueados y un hermoso color naranja en el texto de la ventana. Poco a poco vamos avanzando, y
estoy consiguiendo moldear el tema a mi gusto, y eso sin haber leído ni un "tip" de como se hace, este es el motivo por el que acabas adorando usar Ñu-Linux.




EN EL MUNDO DE "GIMP", Y DE LOS MINÚSCULOS ICONOS


   Estaba claro que la siguiente etapa en mi búsqueda del tema de ventanas perfecto, iba a ser la más difícil. Ahora no se trataba de editar archivos de texto, ahora tendría que modificar imágenes con "Gimp".

   Los conocimientos que yo tengo sobre "Gimp", se los debo sobre todo, a los vídeo-tutoriales de Juanete, click aquí . Pero para este caso creo que iban a ser suficientes, (al menos eso esperaba) ... lo primero era otear el panorama. Así que me voy a ".themes" , donde está la carpeta del tema instado, y observo unos iconos que vienen en blanco, son diminutos, pero sin duda son los responsables de que la parte de abajo del marco tenga esa línea blanca.




   Lo primero que hago, antes de editar nada, es una copia de seguridad de la carpeta, no vaya a ser que metamos la pata y nos la carguemos. Después, doy click derecho para abrir con Gimp, uno de los iconos del marco de la ventana de arriba, que ya tienen el color correcto.

   De este modo, y usando la herramienta "recoge color" puedo seleccionar el color exacto que tengo que dar a los iconos que voy a editar. Voy seleccionando uno a uno, y abriéndolos con "Gimp", gracias a la herramienta de la cubeta, cambio su color con un sólo click. Los que van en las esquinas, son redondeados y tienen una parte transparente, esa no hay que tocarla, sólo cambiamos lo que viene en blanco.

   Si tuviese que explicaros todo esto con imágenes, probablemente tardaría un siglo, así que voy a hacerlo con un vídeo, no tiene sonido, (porque no tengo micrófono) , pero creo que es suficiente para que veáis lo fácil que me ha resultado editar estos iconos. La calidad es mala, y creo que desde la página de YouTube se ve bastante mejor. La verdad es que mi tarjeta gráfica es una mierda, pero creo que os servirá para explicaros con detalle todo el proceso .



MEJORANDO Y CAMBIANDO EL TEMA


   Después de haber conseguido mejorar algunos aspectos del tema de ventanas, tengo que cambiar los colores de los botones, no termino de acostumbrarme a los que trae por defecto, y me hago un pequeño lío a la hora de utilizarlos. Ojeando los iconos de la carpeta, pienso primero en colorearlos, pero va a ser complicado que queden bien tratándose de unos iconos tan pequeños



   Necesito una imagen de botón redondo y amarillo para usar, y la página de búsqueda y descarga de iconos que yo suelo utilizar es esta, click aquí . Después de pasar un buen rato buscando me bajé varios iconos más, de maximizar, cerrar, etc etc...para probar a ver cual quedaba mejor.


  Lo primero de todo es cambiar el icono de maximizar, que es de color azul, cuando debería ser verde. Así que me voy a la carpeta del tema, copio el icono de color verde, y lo pego fuera, en la carpeta contenedora, ".themes" , y simplemente lo renombro como "maximize-active.xpm".

   Al volver a meterlo en la carpeta del tema, me salta una ventana que me avisa de que ya hay otro icono que se llama igual, y me da la opción de sustituirlo, evidentemente le marco que sí, que lo sustituya, y de esta manera tan sencilla ,ya tengo el botón en color verde para maximizar.

Sólo me queda editar el botón de minimizar, que se llama "hide-active.xpm" con el icono amarillo que me bajé de internet, así que lo selecciono en la misma carpeta del tema, (click dch), y lo abro con "Gimp".

   Después de eso, en el menú de "Gimp" , me voy a "Archivo", y selecciono la opción de abrir como capas, dirijo la ventana del navegador de archivos que se me abre, hasta el icono de botón amarillo que me descargué. Al abrirlo con Gimp, como el icono es demasiado grande, me aparece todo el lienzo cubierto de color amarillo, ahora solo tengo que darle el tamaño adecuado, por el conocido sistema español de ir tanteando hasta acertar.

   Sitúo el cursor sobre el lienzo, doy click dch, y en el menú que se abre selecciono "capa", y después en el submenú, escalar capa. Probé un par de veces hasta acertar, el valor que quedó perfecto fue de 8 px de alto y 8 px de largo, vuelvo a abrir el menú de capa y escojo la opción de combinar hacia abajo, ¡y listo! . Ahora sólo me queda guardar, usando la opción de sobreescribir el archivo, refrescar el tema de ventanas y ya tengo todo como yo quería. Mejor que lo veáis en el siguiente vídeo.



MÁS, QUIERO MÁS

Pues sí, escuchando este magnífico tema de mis adorados ÑU, ¡fantástico grupo de rock! , click aquí
. He decidido modificar el tema completamente, añadiéndole cosas de mi cosecha, para subirlo luego a Xfce-Look. He observado, que en otros temas de Xfmw, los botones de las ventanas cambian al acercarles el cursor, aparte de eso, me sigue faltando el botón para enrollar las ventanas, (es una "chorrada", pero a mi me presta tenerlo) , así que pienso en la manera de conseguir, habilitarlos en mi propio tema. Únicamente, (simple deducción lógica) , tengo que crear unos nuevos iconos y ponerles el nombre adecuado para que funcionen. Pero... ¿cual es ése nombre? , la solución es sencilla, simplemente tengo que observar como se nombran esos iconos en otros temas que si los tengan habilitados.



Mirando este otro tema, y con ayuda del traductor oficial de mi casa, es decir, de mi mujer que es de origen escocés, (vosotros podéis usar el traductor de google, que es más barato, consume menos, y no da tanta guerra, juas juas...). Close es el icono de cerrar, hide el de minimizar, maximize es obvio lo que és. Menu también resulta obvio que habilita el botón del menú de las ventanas, stick, es el botón de pegado, shade es para enrollar hacia arriba las ventanas, y shade-toggled para desenrollarlas.


   Entre los atributos que tienen los iconos, basta con añadir a su nombre: "-active", que sería el botón de la ventana activa, "-inactive", para los iconos de las ventanas en segundo plano, "-prelight", modifica el icono por el de nuestra elección cuando le acercamos el puntero, y "-pressed" que lo modifica justo cuando lo presionamos.

   Por lo tanto, lo único que tengo que hacer , es crear esos iconos a mi conveniencia e incluirlos en la carpeta del tema. Haciendo cuentas, para añadir la propiedad "prelight" a los botones actuales, necesito 3 iconos, para habilitar los iconos de enrollar las ventanas 4, para desenrollar otros 4, y 4 más para el menú. Al final añadiría 3 más, por si las moscas, (más vale que sobre, que no que falte).

   Así que creo una carpeta nueva, llamada iconos-previa, y en ella pego la base del botón de las ventanas, (la que viene como un agujero vacío) , 18 veces. Para hacerlo así, hay que copiar el icono que nos servirá como base, que esta en la carpeta del tema, y pegarlo en la carpeta que hemos creado. Luego copiamos otra vez el que acabamos de pegar, (no el anterior), y lo pegamos nuevamente, sin salirnos de la carpeta, las veces que lo necesitemos.



   Ahora , para no liarse procedo a nombrar correctamente todos los archivos, mucho cuidado en este paso, pues un error al escribir cada nombre haría que no nos funcionase el botón en cuestión. Podemos también ir renombrando de uno en uno sobre la marcha, pero yo creo que es más práctico de este modo.


   Abro una nota y escribo cada nombre, luego ya será copiar y pegar:



   Busco los iconos adecuados para poner en los botones, se me ha ocurrido que quedaría muy bien que al acercar el puntero, el botón se agrandara, también me vendría bien un icono con una pequeña explosión ó destello para que de la impresión, de que el botón explota al presionarlo. Después de revolver en Internet un buen rato, me decido por utilizar los que podéis ver en la siguiente imagen, ya les pongo de paso un nombre descriptivo del uso que les voy a dar, para no liarme a la hora de utilizarlos:






    Ahora, sólo me queda editar uno a uno con "Gimp", los iconos de los botones, para terminar mi propio tema de ventanas. Obviamente, (ya os habréis dado cuenta) , no tuve que editar todos los iconos, ya que la propiedad "pressed" que cambia la imagen un instante al presionar los botones, era igual para minimizar, maximizar , enrollar, desenrollar y cerrar. Únicamente puse un botón distinto en el menú, con la intención de diferenciarlo aún más del resto. Tampoco fue necesario editar la apariencia de los iconos de las ventanas en segundo plano, (nombrados como "inactive") , solamente hice las copias necesarias del icono de la carpeta original, y les puse el nombre adecuado. Por lo tanto, de las 18 copias que había hecho, me sobraron unas cuantas.


   El tamaño para que los iconos se agranden al situar sobre ellos el puntero, fue al final de 20x20 px, creo que ya habéis visto como se trabaja con las capas para editar los iconos, así que no tendréis mayor dificultad. No obstante, os dejo un último vídeo para que veáis como edité los iconos de enrollar y desenrollar, (a manera de ejemplo) , y el paso final, que consiste simplemente en moverlos a la carpeta de nuestro tema, refrescarlo con el gestor de ventanas y disfrutar de nuestra propia creación.





   Espero que todo este extenso post pueda serviros para dar rienda suelta a vuestra creatividad. La verdad es que yo he disfrutado muchísimo descubriendo poco a poco como funciona, y que puede hacerse con un marco de ventanas en nuestro super-ratón.

   Ahora sólo me restaba subirlo a Xfce-Look para compartirlo con el resto de nuestra comunidad. Creo que eso es lo más grande que tiene Ñu-Linux, y también lo que te aporta la mayor satisfacción. Poder crear en libertad, para compartir en libertad.


Nota: He hecho cinco versiones más sobre el tema original, con los botones de las ventanas más grandes, en 3D, y también con símbolos. Podéis descargar cualquiera de ellas desde los siguientes enlaces en Xfce-Look.




(Versión original)



(Nueva versión con los botones más grandes)



(Nueva versión con los botones en 3D)


                                   (Nueva versión con los botones más grandes y en 3D)     
                                                 

(Nueva versión con botones  3D, y símbolos en vez de botones al acercar el puntero)


(Nueva versión con botones más grandes en 3D, y símbolos en vez de botones al acercar el puntero)



  Ojalá que os guste, gracias por vuestra atención, y hasta la próxima.







Comentarios

  1. Hola Mirlo

    Muy bueno, me quito el sombrero (no porque no tengo)

    Saludos

    ResponderEliminar
    Respuestas
    1. jajaja, Luis tú no tendrás sombrero, pero yo ya no tengo ni pelo. La verdad es que estoy supersatisfecho con este post, sobre todo porque pasé de no tener ni idea de como funciona un tema de ventanas a crear uno própio. Eso demuestra que Gnu-Linux no es tan difícil y que tiene la gran virtud de permitirnos "cacharrear" y crear cosas nuevas para compartirlas con los demás.

      Un saludo afectuoso.

      Eliminar
  2. Demasiao p'a mi cuerpo!!!
    Vaya currada.
    Saludos.

    ResponderEliminar
    Respuestas
    1. jejejeje. Gracias compañero, la verdad es que nunca pensé en llegar tan lejos, pero una cosa va llevando a la otra, y en cuanto te das cuenta ¡PUM! . No has hecho un tema sino 6 versiones de un tema.

      Gracias por participar.

      Eliminar
  3. Porque el fondo de las ventanas me aparecen blancos y no negros u oscuros como los tuyos?

    ResponderEliminar
    Respuestas
    1. Hola anónimo, los tema xfwm4 se refiere al marco de las ventanas no al fondo. Para los fondo tienes que seleccionar un tema de escritorio, oscuro evidentemente.

      Saludos y gracias por participar

      Eliminar
    2. Gracias por contestar, y muy buen post por cierto, perdon por no haberlo dicho antes... me ayudarias a cambiar el tema de escritorio? o mejor dicho a agregarle uno nuevo? tengo xubuntu 12.04 y no tiene opciones para descargar asi que supongo tendre que hacerlo manualmente, ademas en administrador de configuracion me figura como apariencia y luego estilo... no se por donde empezar...

      Eliminar
    3. Hola anónimo, en el blog tienes un artículo sobre la instalación de temas de escritorio Clic aquí

      Espero que te sirva. Saludos.

      Eliminar
  4. Hola, quería ante todo decirte que sos un maestro!!! los tutoriales que creaste son muy buenos y muy bien explicados, soy un novato en linux, usé Ubuntu una semana y no me gustó al ver que no era muy personalizable y tampoco estable como Debian, por eso me pasé a Debian, de una manera apresurada pero estoy aprendiendo a base de golpes "prueba y error",instalé varios escritorios pero el que más se ajusta a mi comodidad y al usar una maquina portatil es XFCE, quiero preguntarte, se podrá cambiar los íconos de señal como Wif-fi , Bateria, reloj en el panel superior? es normal que un tema de ícono cambia a modo default cuando lo desplazamos sobre algún dock? saludos y muchas gracias!!!

    ResponderEliminar
    Respuestas
    1. Hola Anónimo, gracias por tus palabras, pero son inmerecidas. En una comunidad no hay maestros, todos aprendemos de todos. Sobre el tema de los iconos que me preguntas, sí, es normal que eso ocurra y no estén integrados con el tema que tengas instalado.

      También depende mucho del tema que hayas descargado, hay algunos más completos que otros. La única manera de cambiarlos es hacerlo a "manopla". El del indicador de la red está en la ruta /usr/share/pixmaps/wicd, si es que tienes wicd instalado para gestionar la red, (ese es mi caso).

      Al sustituirlos, deben de tener el mismo nombre, tamaño y formato, y debes abrir la carpeta con permisos de root. De lo contrario no funcionará el cambio.

      La mayoría de los iconos que no se cambian en la bandeja del sistema están en /usr/share/icons/hicolor. Una carpeta que no puede borrarse pues es imprescindible para el sistema. La idea es localizar el icono que se ve en tu bandeja y sustituirlo por el de tu tema, (hay muchos tamaños) , y es una cuestión de ensayo y error.

      Saludos y gracias por participar.

      Eliminar
  5. Coincido con los demás comentarios, hay que ser muy buena gente para compartir de esa forma tus conocimientos, claros como el agua y paso por paso, muchas gracias

    un saludo

    ResponderEliminar
    Respuestas
    1. Pues muchas gracias, pero no hago nada en especial que no haga mucha otra gente. En fin, que se agradece mucho el apoyo Lupi.

      Un saludo, y gracias por participar

      Eliminar
  6. Muchas gracias, soy nuevo en debian con xfce, y estoy aprendiendo un montón. Gracias por compartir

    ResponderEliminar
  7. Este blog es exelete,de los mejores de linux, felicitaciones amigo.Ademas eres muy cortes al reponder preguntas que.... a veces son muy obvias jajaja!!!

    ResponderEliminar

Publicar un comentario

¡Bienvenido y gracias por tú opinión!

Siéntete libre de expresarte como quieras, únicamente eliminaré aquellos comentarios ofensivos, insultantes, ó que puedan considerarse como spam.