Sustituyendo la interfaz gráfica por QML (parte II)

Bien, siguiendo con la parte anterior del tutorial, ahora me dispongo a analizar el significado de las diferentes partes del código.

Es importante tener el programa al lado del resultado de la ejecución del truco sucio anterior para saber de qué va el cotarro, pero en este caso el truco sucio sirve para antes de mirar el código a lo bestia podamos analizar los comandos de forma idependiente. Empezamos con la primera parte, bastante en serio en este caso porque es importante puesto que recoge las declaraciones y setups y esas cosas, luego iré más rápido.

1. Ui::CallWindow ui;
2. : KXmlGuiWindow(), d(new Private)
3. d->ui.setupUi(this);
4. d->ui.errorWidget->hide();
5. d->ui.errorWidget->setMessageType(KMessageWidget::Error);
6. setupGUI(QSize(428, 395), ToolBar | Keys | StatusBar | Create, QLatin1String(“callwindowui.rc”));

En la línea 1 tenemos la declaración de la interfaz, no nos interesa más allá de saber que la tendremos que borrar más adelante. La línea 2 no tiene nada que ver con lo nuestro sólo es la herencia de la ventana principal. Ahora empieza lo interesante: La línea 3.

La línea 3, como he dicho en la parte anterior del tuto es la que selecciona el archivo XML como la forma que tendrá la ventana. Si toco este ahora todo casca porque sigue llamándola el resto del programa, así que vamos a ir poco a poco.

4 y 5 son sobre el widget de mensajes de errores que tenía hecho el desarrollador anterior, yo esto no lo he implementado en la interfaz gráfica en QML aún, pero tampoco sé como enfocarlo, seguramente lo quite o lo haga a través de consola, pero antes preguntaré.

La línea 6 también es muy interesante porque esa orden es la que asigna digamos el contorno de la aplicación, antes os he mentido un poquito y en realidad hay dos archivos XML uno de ellos es el que os he dicho antes y otro, en el caso de KDE, se encarga de hacer barras de herramientas y esas cosas. Ese archivo es el callwindowui.rc. A diferencia del .ui, este se puede leer y editar fácilmente (en realidad se hace a mano, no como el otro). En este caso, por ejemplo, si borramos la parte de ToolBar nos quedamos con lo siguiente (en este caso la he comentado para que veáis lo que era antes, la tenéis en gris):

<?xml version="1.0" encoding="UTF-8"?>
<gui name="callwindow"
     version="1"
     xmlns="http://www.kde.org/standards/kxmlgui/1.0"
     xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
     xsi:schemaLocation="http://www.kde.org/standards/kxmlgui/1.0
                         http://www.kde.org/standards/kxmlgui/1.0/kxmlgui.xsd" >

  <MenuBar>
    <Menu name="call" >
      <text>Call</text>
      <Action name="hangup" />
      <Action name="hold" />
    </Menu>
    <Menu name="view">
      <Action name="showMyVideo" />
      <Action name="showDtmf" />
      <Action name="goToSystemTray" />
    </Menu>
    <Menu name="media" >
      <text>Media</text>
      <Action name="sendVideo" />
      <Action name="mute" />
    </Menu>
  </MenuBar>

  <!--<ToolBar name="mainToolBar" position="bottom" >
    <text>Main Toolbar</text>
    <Action name="hangup" />
    <Action name="hold" />
    <Separator />
    <Action name="showDtmf" />
    <Action name="showMyVideo" />
    <Separator />
    <Action name="mute" />
    <Action name="sendVideo" />
  </ToolBar>-->

</gui>

Y si compilamos y ejecutamos el programa se observa lo siguiente:

Ya no aparece la barra inferior 🙂

Si quitásemos la línea 6 entera tampoco aparecería la barra de menú de arriba. Pero eso lo probáis vosotros que no quiero andar subiendo otra foto 😛 y además la voy a dejar así porque quiero aprovechar la barra superior.

Bien.

El resto de líneas del comando se pueden resumir en el uso que hace de los diferentes widgets definidos en el archivo .ui, que son:

1. errorWidget
2. remoteUserDisplayLabel
3. videoPreviewWidget
4. videoWidget
5. callStackedWidget
6. dtmfStackedWidget

Podríamos haber llegado a la misma conclusión abriendo el archivo .ui. Pero la interfaz no me gusta demasiado y así queda más claro porque en el otro se usan layouts y contenedores que realmente no tienen uso en la lógica de programa. Si lo abrís lo veréis, un montón de widgets superpuestos que son una liada, en QML lo intentaré hacer más sencillo.

El siguiente paso es analizar cuando se usa cada una de esos widgets y si es necesario crear una equivalencia en QML. Pero eso en el próximo capítulo.

Seguimos en la parte III.

Kisses.