static-httpd

Sitio web estático (HTML + CSS) que sostiene el blog del autor
Log | Files | Refs

index.html (11073B)


      1 <!DOCTYPE html>
      2 <html>
      3 <head>
      4 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
      5 <meta name="viewport" content="width=device-width, initial-scale=1" />
      6 <title>Configuración y uso personal de dwm</title>
      7 <link rel="icon" type="image/png" href="/favicon.png" />
      8 <link rel="stylesheet" type="text/css" href="../article.css" />
      9 </head>
     10 <body>
     11 <header>
     12 <p class="title">Configuración y uso personal de dwm</p>
     13 <p class="date">9 de octubre de 2021 • fjbalon</p>
     14 </header>
     15 <p>En orden a construir <emb>dwm</emb> necesita los archivos de cabecera de Xlib. Edite config.mk para localizar tu configuración local (<emb>dwm</emb> es instalado en usr/local por defecto). La instalación se realiza directamente compilando el código, para ello dispone de un archivo <emb>makefile</emb>. Para limpieza de archivos compilados y temporales en directorio de trabajo, dispone de la orden <emb>clean</p>emb>.</p>
     16 <p><emb>dwm</emb> se configura mediante el archivo <emb>config.h</emb> y (re)compilando.</p>
     17 <p>Existen parches ya programados y publicados por la comunidad de suckless que permiten extender fácilmente el windows manager según los parámetros requeridos por el usuario. En mi caso, utilizo éstos de base:</p>
     18 <ul>
     19 <li>Parches estéticos</li>
     20 <ul>
     21 <li><a href="https://dwm.suckless.org/patches/actualfullscreen">actualfullscreen</a>: Alterna la pantalla completa para una ventana, en lugar de alternar la barra de estado y el diseño monocle2.</li>
     22 <li><a href="https://dwm.suckless.org/patches/titlecolor">titlecolor</a>: Añade un nuevo esquema de color utilizado por el título de la ventana en la barra, de modo que sus colores (primer plano y fondo) se pueden cambiar de forma independiente.</li>
     23 <li><a href="https://dwm.suckless.org/patches/noborder">noborderfloating</a>: Elimina el borde cuando sólo haya una ventana visible.</li>
     24 </ul>
     25 <li>Parches funcionales</li>
     26 <ul>
     27 <li><a href="https://dwm.suckless.org/patches/movestack">movestack</a>: Permite mover clientes en la pila e intercambiarlos con el maestro.</li>
     28 <li><a href="https://dwm.suckless.org/patches/pertag">pertag</a>: Mantiene layout, mwfact, barpos y nmaster por etiqueta (tag).</li>    
     29 </ul>
     30 </ul>
     31 <p>Basado en el artículo <a href="https://ratfactor.com/dwm">Dave's Visual Guide to dwm</a>  y usando, con su permiso, algunas imágenes de su autoría; voy a exponer cómo uso, o conduzco, <emb>dwm</emb> obteniendo toda su potencia gráfica. A priori, puede parecer un uso complejo y complicado, y de hecho así lo es en un inicio. Sin embargo, como aquel que controla maquinaria pesada o programas complejos, con el uso rutinario que se convierte en hábito, se convierte en un poderoso arma de productividad y enfoque táctico.</p>
     32 <p>Lo primero que hay que definir es la tecla principal, que en mi caso es <kbd>Mod4</kbd>. Cabe destacar que por defecto es <kbd>Alt</kbd>.</p>
     33 <h2>Layouts</h2>
     34 <p>Un layout, en el contexto de diseño gráfico y de interfaces de usuario, es la disposición visual y organizativa de los elementos en una pantalla. <emb>dwm</emb> cuenta con 3 layouts:</p>
     35 <ol start="0">
     36 <li>
     37 <p><kbd>Mod4</kbd>+<kbd>t</kbd> Tiled (mosaico): reorganiza las ventanas en la configuración maestra/pila de mosaicos dinámicos.</p>
     38 <img style="width: 45%;" src="resources/tiled_layout.png"/>
     39 <p>Es el layout por defecto al abrir una tag. La ventana creada comienza a pantalla completa. A medida que se agregan ventanas, se abren en el área master (zona izquierda); mientras que las más antiguas se empujan al área stack(zona derecha, apiladas).</p>
     40 <img style="width: 60%;" src="resources/dwm_master_stack_layout.png"/>
     41 </li>
     42 <li>
     43 <p><kbd>Mod4</kbd>+<kbd>f</kbd> Floating (flotante): las ventanas pueden superponerse, moverse y dimensionarse manualmente.</p>
     44 <img style="width: 20%;" src="resources/floating_layout.png"/>
     45 </li>
     46 <li>
     47 <p><kbd>Mod4</kbd>+<kbd>m</kbd> Monocle (monóculo): una sóla ventana completa enfocada se empuja hacia el frente, el resto, esperan detrás a ser enfocadas.</p>
     48 <img style="width: 45%;" src="resources/monocle_layout.png"/>
     49 </li>
     50 </ol>
     51 <p>Además, alterna entre los dos layouts más actuales con <kbd>Mod4</kbd>+<kbd>Space</kbd>. Para cambiar entre los estados de mosaico y flotante en la ventana enfocada <kbd>Mod4</kbd>+<kbd>Shift</kbd>+<kbd>Space</kbd>.</p>
     52 <img style="width: 45%;" src="resources/toggle_window_floating.png"/>
     53 <h2>Administración de ventanas</h2>
     54 <p>De forma predeterminada, hay dos formas de abrir una nueva ventana: abrir una shell (por defecto <emb>st</emb>) o ejecutar <emb>dmenu</emb>. Ambas son aplicaciones separadas que se construyeron específicamente y modularmente para trabajar con <emb>dwm</emb> (aunque pueden usarse fuera de éste sin problemas). En mi caso uso ambas, cuyas combinaciones de teclas predeterminadas para cada una son:</p>
     55 <p><kbd>Mod4</kbd>+<kbd>Return</kbd> abre específicamente <emb>st</emb>, si desea que abra otra terminal, como <emb>xterm</emb> o <emb>urxvt</emb>, deberá configurar <emb>config.h</emb>.</p>
     56 <img style="width: 45%;" src="resources/new_term.png"/>
     57 <p><kbd>Mod4</kbd>+<kbd>r</kbd> ejecuta el pequeño menú dinámico llamado dmenu en la barra superior de <emb>dwm</emb>.</p>
     58 <p>Para cerrar una ventana, puede cerrarla desde la aplicación o indicar que cierre la ventana con <kbd>Mod4</kbd>+<kbd>Shift</kbd>+<kbd>c</kbd> sobre la ventana enfocada. No podemos empezar a usar un programa si no sabemos terminarlo o salir de él. En el caso de <emb>dwm</emb>, saldremos de él mediante <kbd>Mod4</kbd>+<kbd>Shift</kbd>+<kbd>q</kbd>.</p>
     59 <img style="width: 45%;" src="resources/close_window.png"/>
     60 <h2>Administración del foco</h2>
     61 <p>Para mover el foco entre ventanas, utilizo <kbd>Mod4</kbd>+<kbd>j</kbd> para moverlo hacia la siguiente. Esto sirve para todos los layouts. En modo mosaico, vamos en dirección de la agujas del reloj.</p>
     62 <img style="width: 45%;" src="resources/focus_next_tiled.png"/><img style="width: 45%;" src="resources/focus_next_floating.png"/>
     63 <p>Para mover el foco a la ventana anterior utilizo <kbd>Mod4</kbd>+<kbd>k</kbd>.</p>
     64 <img style="width: 45%;" src="resources/focus_prev_tiled.png"/><img style="width: 45%;" src="resources/focus_prev_floating.png"/>
     65 <h2>Administración de mosaico (tiled layout)</h2>
     66 <p>Para aumentar el número de ventanas divididas en el área master (lo que moverá las ventanas en caso de haberlas fuera del área de pila según sea necesario) utilizo <kbd>Mod4</kbd>+<kbd>i</kbd> (increment master).</p>
     67 <img style="width: 70%;" src="resources/master_increase.png"/>
     68 <p>Del mismo modo a la inversa, para reducir el número de ventanas divididas utilizo <kbd>Mod4</kbd>+<kbd>d</kbd> (decrement master).</p>
     69 <img style="width: 70%;" src="resources/master_decrease.png"/>
     70 <p>Para incrementar el área física que ocupa master utilizo <kbd>Mod4</kbd>+<kbd>l</kbd>.</p>
     71 <img style="width: 45%;" src="resources/master_bigger.png"/>
     72 <p>Para reducir el área física que ocupa master utilizo <kbd>Mod4</kbd>+<kbd>h</kbd>.</p>
     73 <img style="width: 45%;" src="resources/master_smaller.png"/>
     74 <p>Para aplicar zoom, o en palabras más técnicas, alternar la ventana entre las áreas master y stack, utilizo <kbd>Mod4</kbd>+<kbd>Shift</kbd>+<kbd>Return</kbd>. Si la ventana enfocada está en stack se moverá a master y viceversa.</p>
     75 <img style="width: 45%;" src="resources/zoom.png"/>
     76 <h2>Administración de etiquetas (tags)</h2>
     77 <p>Si esta familiarizado con el concepto de escritorios múltiples o escritorios virtuales lo entenderá rápidamente. Las etiquetas o tags brindan la misma funcionalidad, pero con más flexibilidad y velocidad. Cada etiqueta es un escritorio, que administra un conjunto específico de ventanas que tiene abiertas.</p>
     78 <p>Si hay alguna diferencia con los escritorios virtuales clásicos, es que una ventana puede pertenecer a más de una tag, e incluso puede ver todas las etiquetas a la vez, combinarlas, etc.</p>
     79 <p>Para movernos entre tags, basta con <kbd>Mod4</kbd>+<kbd>1...n</kbd>, donde <emb>n</emb> es el número de tag que queremos visualizar. <kbd>Mod4</kbd>+<kbd>Tab</kbd> conmuta entre las 2 tags más recientes.</p>
     80 <img style="width: 45%;" src="resources/view_tagged_windows.png"/>
     81 <p>Para asignar un nuevo tag a una ventana, en otras palabras, mover una ventana entre tags, uso <kbd>Mod4</kbd>+<kbd>Shift</kbd>+<kbd>1...n</kbd>, que moverá la ventana enfocada al tag <emb>n</emb>.</p>
     82 <img style="width: 45%;" src="resources/assign_window_tag.png"/>
     83 <p>Para universalizar la ventana enfocada, uso <kbd>Mod4</kbd>+<kbd>Shift</kbd>+<kbd>0</kbd>; de tal forma que la ventana se mostrará en todos los escritorios. Para agregar o eliminar la visualización del foco en una tag <emb>n</emb> concreta, en lugar de en todas, uso <kbd>Mod4</kbd>+<kbd>Ctrl</kbd>+<kbd>Shift</kbd>+<kbd>1...n</kbd>.</p>
     84 <img style="width: 45%;" src="resources/assign_all_window_tags.png"/>
     85 <p>Para visualizar todas las ventanas de todas las tags uso <kbd>Mod4</kbd>+<kbd>0</kbd>. Si lo que queremos es combinar x tags concretas en lugar de todas, podemos conmutarlas con <kbd>Mod4</kbd>+<kbd>Ctrl</kbd>+<kbd>1...n</kbd>.</p>
     86 <img style="width: 45%;" src="resources/view_all_windows.png"/>
     87 <h2>Administración de barra (bar)</h2>
     88 <p>La barra o bar puede ocultarse o mostrarse simplemente usando <kbd>Mod4</kbd>+<kbd>b</kbd>. Es muy útil a veces.</p>
     89 <img style="width: 45%;" src="resources/toggle_bar.png"/>
     90 <h2>Administración del ratón (mousing)</h2>
     91 <p>Aunque como sabemos, <emb>dwm</emb> está diseñado para que no se requiera el ratón. A veces puede ser un añadido muy útil, en especial cuando ya estamos usándolo en programas que por diseño lo requieren, como el navegador, programas gráficos o algún juego.</p>
     92 <p>Si queremos activar la administración del ratón, sólo tenemos que mantener pulsado <kbd>Mod4</kbd> durante su uso.</p>
     93 <p><kbd>Mod4</kbd>+<kbd>Button1</kbd> mueve la ventana en modo flotante. Si la ventana se encontraba incrustada en el mosaico, cambiará su modo a flotante.</p>
     94 <img style="width: 20%;" src="resources/mouse_controls.png"/>
     95 <p><kbd>Mod4</kbd>+<kbd>Button2</kbd> alterna la ventana entre el estado flotante y mosaico. <kbd>Mod4</kbd>+<kbd>Button3</kbd> redimensiona la ventana. Al igual que con el movimiento, si la ventana estaba embaldosada, se flotará. Otro uso del ratón a tener en cuenta es como enfocador. Si el ratón se superpone sobre una ventana esta adquirirá automáticamente el foco. Igual en varios monitores.</p>
     96 <h2>Administración de monitores</h2>
     97 <p>En ocasiones, trabajamos con más de un monitor. En ese caso, cada monitor extenderá el escritorio de <emb>dwm</emb>, manteniendo 9 tags independientes -por defecto- en cada escritorio.</p>
     98 <p>Cada escritorio puede ser comportado como una tag superior, moviendo el foco de escritorio con <kbd>Mod4</kbd>+<kbd>,</kbd> y <kbd>Mod4</kbd>+<kbd>.</kbd>. Para enviar una ventana a la tag enfocada del siguiente escritorio uso <kbd>Mod4</kbd>+<kbd>Shift</kbd>+<kbd>,</kbd>, <kbd>Mod4</kbd>+<kbd>Shift</kbd>+<kbd>.</kbd> para enviarla al escritorio anterior.</p>
     99 </body>
    100 </html>