Archivo por días: 3 diciembre, 2012

Acceder a los recursos de una aplicación de Windows Store desde código (vb, c#, xaml)

Pues eso… seguimos con la aplicación Reloj para Windows 8, en esta ocasión vamos a añadir un par de cadenas a los recursos de la aplicación y veremos cómo acceder a esos recursos tanto desde código de Visual Basic y C# como desde el código de XAML.

El recurso es para usarlo como cadena de texto en varias partes de la aplicación, por tanto lo definiremos a nivel de aplicación, pero más que nada porque es más fácil de recuperar (o al menos a mí me ha parecido más fácil).

De todas formas, tal como veremos en el código XAML de la página principal, el uso desde el código XAML no afecta dónde esté definido, pero ese sitio si que lo tendremos que tener en cuenta a la hora de acceder a dichos recursos desde el código de VB o C#.

 

Recursos 00
Figura 1. El reloj en funcionamiento

 

Te cuento que a la hora de buscar cómo hacer esto me encontré con ejemplos que utilizan FindResource, entre otros sitios, los que vienen en el libro Windows Presentation Foundation Unleashed (que tengo desde febrero de 2007 y que no usaba desde hace unos cuantos años, pero que he tenido que retomar para consultar las posibles dudas que me vayan surgiendo en mi "pelea" con el código XAML que hay que usar para las aplicaciones de Windows Store).

En ese mismo libro indicaba que se podían acceder indicando el nombre de la clase (página XAML) en la que están definidos los recursos, pero que, tal como te he dicho, a mi no me ha funcionado. Que a lo mejor funciona, que no digo yo que no, pero yo no he sido capaz de utilizarlos como yo quería, así que…

Bueno, vamos al tema…

Lo primero que tenemos que hacer es crear los recursos como cadenas, en mi caso, estoy usando dos cadenas, una para el título de una especie de MessageBox (especie, ya que no son avisos como los que estamos acostumbrados en las aplicaciones de escritorio) y el otro para usarlo como texto de ese aviso y como Tooltip del botón "Acerca de…"

Dichas cadenas las defino de esta forma:

<x:String x:Key="ClockTitle_en">Clock for Windows 8 app Store</x:String>
<x:String x:Key="AboutClock_en">A simple clock for Windows 8 app Store by elGuille.info</x:String>

 

Yo he definido estas dos cadenas en el fichero App.xaml, es decir, en la "aplicación".

Si abrimos el fichero App.xaml veremos que justo después de la cabecera tenemos un elemento llamado Application.Resources y dentro de ese hay otro elemento llamado ResourceDictionary que es el que contiene la definición de ResourceDictionary.MergedDictionaries que es donde está indicado el fichero de los estilos que vimos en el artículo anterior (StandardStules.xaml).

Pues bien, esas dos definiciones de las cadenas las pondremos justo después del inicio del elemento ResourceDictionary, de forma que nos quede de esta forma:

<Application.Resources>
    <ResourceDictionary>
        <x:String x:Key="ClockTitle_en">Clock for Windows 8 app Store</x:String>
        <x:String x:Key="AboutClock_en">A simple clock for Windows 8 app Store by elGuille.info</x:String>

        <ResourceDictionary.MergedDictionaries>

            <!-- 
                Styles that define common aspects of the platform look and feel
                Required by Visual Studio project and item templates
             -->
            <ResourceDictionary Source="Common/StandardStyles.xaml"/>
        </ResourceDictionary.MergedDictionaries>

    </ResourceDictionary>
</Application.Resources>

 

Ahora vamos a modificar MainPage.xaml para asignar el Tooltip al botón buttonClock. Este será el código a usar para definir el botón que está en el segundo panel:

<Button x:Name="buttonClock" Click="button_Clock" 
        Style="{StaticResource AboutClockAppBarButtonStyle}"
        ToolTipService.ToolTip="{StaticResource AboutClock_en}" />

 

Como puedes comprobar, la forma de usar ese recurso desde XAML es igual que el resto de recursos definidos en nuestro proyecto.

Pero al usarlo desde el código tendremos que indicar "dónde" está (obvio por otro lado).

Así que, vamos a modificar el código, particularmente el evento Click del botón buttonClock.

Lo que haremos es mostrar una especie de "popup" que viene a ser como el MessageBox de las aplicaciones de escritorio, pero al estilo de Windows 8.

Para mostrar ese mensaje usaremos la clase MessageDialog que está definida en Windows.UI.Popups y que por medio del método ShowAsync mostraremos el mensaje.

¿Te has fijado en el nombre del método?

Acaba con la palabra Async… lo cual significa que es un método asíncrono… y si queremos usarlo de esa forma (asíncronamente) tendremos que hacer la llamada desde un método asíncrono y por tanto usando Await (los que han visto mi presentación en la gira que hice el mes pasado por Perú sabrán de qué hablo, y tú también, claro, porque ya sabes de qué va esto de Async… ¡ejem! ¡ojú que carraspera tengo!)

Bueno, dejemos las carrasperas y vamos a lo que vamos.

Para acceder a la cadena del recurso ClockTitle_en y asignarlo al título del diálogo haremos algo así:

En C#:

dlg.Title = App.Current.Resources["ClockTitle_en"].ToString();

 

En Visual Basic:

dlg.Title = App.Current.Resources("ClockTitle_en").ToString()

 

Es decir, accedemos a la colección Resources de la aplicación y le indicamos el nombre del recurso al que queremos acceder. Como es una cadena, usamos el ToString para convertirlo adecuadamente.

 

Si en lugar definirlo en el fichero App.xaml queremos definirlo en la propia página en la que tenemos el código (y el diseño de la aplicación), es decir en MainPage.xaml, podemos hacerlo de esta forma:

dlg.Title = Me.Resources("ClockTitle_en").ToString()

 

dlg.Title = this.Resources["ClockTitle_en"].ToString();

 

En ese caso, la definición de las cadenas las tendremos que poner justo después de la definición de la cabecera de la página y encerrarlas en el elemento Page.Resources tal como podemos ver a continuación (aquí sólo he puesto una de las dos cadenas):

<Page.Resources>
    <x:String x:Key="ClockTitle_en">Clock for Windows 8 app Store</x:String>
</Page.Resources>

 

Por supuesto, también podemos definirlo en el fichero StandardStyles.xaml, y la forma de usarlo desde el código (o desde XAML) será de la misma forma que definiéndolo en el fichero App.xaml.

De hacerlo ahí, tendrás que definir las cadenas justo después del "ResourceDictionary" que hay en la parte superior, por tanto lo tendrías que añadir a partir del cierre del elemento, concretamente después de esta línea:

</ResourceDictionary.ThemeDictionaries>.

 

Bien, dicho todo esto, veamos el código completo del evento Click del botón buttonClock y una captura de la pantalla al mostrar el mensaje.

Visual Basic:

Private Async Sub button_Clock(sender As Object, e As RoutedEventArgs)
    ' Mostrar la imagen del SplashScreen o el mismo texto del Tooltip...
    Dim dlg = New Windows.UI.Popups.MessageDialog(
App.Current.Resources("AboutClock_en").ToString()) dlg.Title = App.Current.Resources("ClockTitle_en").ToString() Await dlg.ShowAsync()

 

C#:

private async void button_Clock(object sender, RoutedEventArgs e)
{
    // Mostrar la imagen del SplashScreen o el mismo texto del Tooltip...
    var dlg = new Windows.UI.Popups.MessageDialog(
App.Current.Resources["AboutClock_en"].ToString()); dlg.Title = App.Current.Resources["ClockTitle_en"].ToString(); await dlg.ShowAsync();

 

Como la llamada al método ShowAsync queremos que sea asíncrona, tenemos que definir el método como asíncrono (con el modificador Async / async) y para que dicho método "realmente" sea asíncrono, tenemos que realizar la llamada con Await / await.

 

Al pasar el ratón por el botón de la derecha (el que estamos modificando) se mostrará el ToolTip tal como vemos en la figura 2, y al pulsar en el botón se mostrará el mensaje que vemos en la figura 3.

Recursos 02

Figura 2. El mensaje (Tooltip) al pasar el cursor del ratón por el icono

 

Recursos 03

Figura 3. El mensaje mostrado al pulsar en el botón de la derecha

 

 

Y esto es todo por ahora… espero que te sea de utilidad… 😉

 

Nos vemos.

Guillermo

 

Temas relacionados:

  1. Usar un temporizador en las aplicaciones de Windows store (Visual Basic)
  2. Usar un temporizador en las aplicaciones de Windows store (C#)
  3. Pon una AppBar en tu aplicación de Windows Store
  4. Acceder a los recursos de una aplicación de Windows Store desde código (vb, c#, xaml)
  5. Actualizar el icono (tile) de una aplicación de Windows Store (cada minuto)
  6. Saber cuando la aplicación está en modo Snapped y actuar en consecuencia