Browsed by
Month: July 2011

L'équivalent de UniformToFill mais centré

L'équivalent de UniformToFill mais centré

Il y a une problématique qui revient souvent lorsque l’on utilise la propriété Stretch d’une image, c’est qu’il est impossible de demander que l’image garde son ratio (uniform), qu’elle remplisse complètement son “cadre” (Fill) mais que la partie visible soit le centre (le plus important en général).

Il existe bien une propriété UniformToFill, mais celle-ci recadre l’image dans son coin supérieur gauche, pas forcément concluant lorsque l’on a un ratio de cadre très différent du ratio de l’image de base.

Avant d’indiquer la solution, un petit résumé des possibilités de base de la propriété Stretch.

La propriété Stretch

La propriété Stretch de l’élèment Image propose donc 4 valeurs :

None : pas de redimensionnement.

Fill : L’image est redimensionné pour remplir les dimensions de destination. Ceci signifie que le ratio n’est pas conservées, si votre image représente un rond, vous aurez un ovale si votre ratio est différent.

Uniform : Le contenu est redimensionné pour s’ajuster aux dimensions de destination pendant qu’il conserve ses proportions natives. Votre image est juste “(dé)zoomée” sans être déformée. Attention, sauf si le cadre et l’image ont le même ratio, deux côtés auront du vide.

UniformToFill Le contenu est redimensionné pour remplir les dimensions de destination en conservant ses proportions natives. Si les proportions du rectangle de destination diffèrent de la source, le contenu source sera découpé dans le coin supérieur gauche

La solution

 

Classiquement, on écrit :


<Image Source="truc" Height="200" Width="200" Stretch="UniformToFill"/>

le secret pour un bon alignement, est de supprimer les dimensions de l’image et de laisser le parent gérer la taille de l’image :


<Border Width="200" Height="200" >

<Image Source="truc" Stretch="UniformToFill"/>

</Border>

Visuellement on a exactement le même résultat, l’image étant limité par son parent. Toutefois, en ajoutant le border, on a ajouté une marge de manoeuvre, on peut maintenant jouer avec les propriétés VerticalAlignment et HorizontalAlignment de l’image, et en mettant ces deux propriétés à Center, l’image se centre automatiquement, exactement ce que l’on souhaitait !

 

Indirectement, en jouant avec les propriétés VerticalAlignment et HorizontalAlignment, vous pouvez faire en sorte que votre UniformToFill se concentre sur n’importe quel autre coin de l’image, voir même via les margins, s’éloigner un peu de ceux-ci

 

La navigation sous Windows Phone : Mango

La navigation sous Windows Phone : Mango

Dans l’article précédent, nous avons vu comment fonctionne la navigation sous Nodo. Mango va indirectement changer le mécanisme de celle-ci, indirectement car le changement sera la conséquence d’une nouvelle fonctionnalité de mango : le multi-tâche.

 

Le multi-tâche sous mango

Nous n’allons par aborder ici les background tasks, ni même des mécanismes de fonctionnement du multi-tâche ou de sa gestion des contextes. Nous allons plutôt aborder la possibilité pour l’utilisateur de retourner dans une de ces précédentes applications ouverte et gardée en mémoire.

Si on appuie sur la touche “précédent” de son téléphone, un utilisateur à la possibilité de visualiser la liste des applications encore en mémoire, c’est à dire que si je lance l’appliation TVShow et que je fais plusieurs fois “précédent” jusqu’à en sortir, l’application ne sera pas visible, mais si je sors de l’application via le bouton home ou recherche, celle-ci apparaitra.

 

Dans cette logique, on oublie totalement l’analogie d’une ligne droite représentant l’historique avec la possibilité d’avancé ou de reculer d’un cran car on donne ici la possibilité à l’utilisateur d’aller directement à un endroit précis de l’historique.

 

L’ordre des applications

Si je lance dans l’ordre les applications A, B C et D et que je reviens grâce à un appuie long sur “précédent” à l’application B et que je fasse plusieurs précédents jusqu’à en sortir, sur quelle application vais je tomber ? Une logique “navigateur internet” voudrait que je retourne à l’application A. Toutefois, nous sommes dans un contexte de multi-tâche, pas d’historique web, le choix a donc été fait de retourner à la dernière instance d’application lancée.

Analogie

Comme pour nodo, nous allons nous baser sur une analogie pour mieux comprendre le fonctionnement. On va cette fois prendre comme référentielle les applications et non les “pages” comme précédemment pour simplifier les choses.

Mango est un lecteur DVD (pour faire plaisir à David Catuhe), accompagné d’un côté d’une bibliothèque de DVD avec leurs jaquettes, correspondant à la liste de vos applications, et à droite une pile de disques correspondant aux instances des applications que vous avez lancées (si on veut aller plus loin, le marketplace est amazon).

 

 

Lorsque l’on souhaite lire un DVD (lancer une application), on la cherche dans nos DVD (applications), on prend le disque dans la jaquette (on lance l’instance) et on le place au sommet de notre pile de disques en cours. Si jamais le disque n’était pas présent dans la jaquette, c’est qu’il est dans la pile de disques, on le retire alors de la pile et on le remet dans sa jaquette (on détruit l’instance précédente) avant de le reprendre pour le remettre dans la pile (nouvelle instance).

On a donc toujours une liste de disques dans l’ordre décroissant de dernière utilisation.

Si jamais on ne veut plus du disque courant (on sort de l’application via la touche précédente), on enlève le disque de la pile et on le range (on supprime son instance), le nouveau disque au sommet devenant alors le disque (l’application) courant. Enfin, si je souhaite retourner à un disque déjà dans la pile (à une instance d’application en mémoire), je prend le DVD et le place en tête.

L’ordre des applications

Cette analogie répond donc à plusieurs question :

  • il est impossible d’avoir deux fois la même application dans la liste des instances
  • si on sort d’une application, c’est la dernière application lancée qui prend sa place
  • si on retourne via le multi-tâche dans une ancienne application, on ne fait que de la mettre au sommet de la pile
  • si lance une application qui était déjà en mémoire via la liste des applications, on supprime son instance pour en créer une nouvelle au sommet de la pile

Gestion de la mémoire

Que se passe t’il lorsque j’ai trop d’application en mémoire ?

Une application prend plus ou moins de place en mémoire, il se pend que le système décide de supprimer des instances afin de gagner en place, il va donc vider la pile d’instance (de DVD) par le dessous, en supprimant les plus anciennes instances utilisées jusqu’à avoir assez de place pour la nouvelle application.

La navigation sous Windows Phone : Nodo

La navigation sous Windows Phone : Nodo

Nous allons aborder ici le fonctionnement de la navigation sous Windows Phone 7 Nodo (et précédent).

Le principe

 

Le fonctionnement est assez simple à comprendre. Lorsque vous êtes dans une application et que vous cliquez sur un bouton, vous changez de pages (gros résumé) mais vous pouvez retourner en arrière via la touche “retour” de votre téléphone.

Lorsque vous appuyez plusieurs fois sur la touche retour, vous pouvez “sortir” de l’application et retourner sur la page d’accueil de votre téléphone (ou la liste des applications) ou dans l’application précédente. Vous pourrez alors naviguer dedans ou allez un peu plus loin dans votre historique.

Si on prenait un peu de recul, la navigation ressemblerait à cela :

 

On passe d’une application à une autre de façon linéaire, avec la possibilité de retourner en arrière, et dès que l’on sort d’une application via le bouton retour, l’application se décharge complètement

Analogie

Il est très difficile d’expliquer une expérience de navigation avec des mots, je vais donc utiliser des analogies pour visualiser le concept.

Pour se donner une idée de l’expérience de navigation, il faut imaginer Windows Phone comme un Internet Explorer 6 à qui on aurait enlevé la touche “suivant” et la barre d’adresse en ne laissant que le bouton “Précédent”, “Home” et “Recherche”.

Avec votre navigateur internet, vous pouvez cliquez sur des liens, la page courante sera alors remplacée par une autre, celle-ci peut être une sous-page du site actuel mais aussi un lien vers un autre site. Vous pouvez aussi cliquer sur le bouton précédent, et retourner sur la page précédente sans devoir la recharger. Vous avez aussi la possibilité d’appuyer sur le bouton “home”, vous verrez alors apparaître la page d’accueil avec des liens dessus, que vous pourrez aussi cliquez. Vous pouvez aussi avoir des choses un peu plus tordu, comme un bouton html ou un lien qui va retourner en arrière. De plus en cliquant sur le bouton précédent, vous ne retourné en arrière que d’un seul cran, jamais plus.

Avec Windows Phone, l’expérience utilisateur est totalement identique, vous retrouvez la touche “précédente”, la touche “home” ainsi que des liens/boutons permettant la navigation et la touche recherche. Donc si on devait résumer l’expérience de navigation sous nodo en une seule image :

 

Cette expérience de navigation est simple à assimiler, il suffit juste d’imaginer ses applications comme des sites internet, et sa navigation comme l’historique web, sans aucune distinction entre la navigation au sein de l’application et la navigation entre applications. Il est aussi facilement compréhensible qu’une fois retourné en arrière, on ne peut retourné en avant, comme un Ctrl+Z sans Ctrl+Y.

Oui mais non…

En fait, il y a une subtilité que l’on a mis de côté,. Avec votre navigateur internet, vous pouvez aller sur Bing, puis facebook, puis MSDN, puis de nouveau facebook et si vous appuyez sur “précédent”, vous parcourez la liste dans le sens contraire, c’est à dire facebook->MSDN->facebook->Bing. Sous Windows Phone avec des applications, ça ressemblerait plutôt à facebook->MSDN->facebook->Bing. Pourquoi ?

En fait, lorsque l’on ouvre une application qui était déjà instancié dans l’historique, cette dernière supprime son instance précédente, on ne peut donc avoir dans notre “historique”, qu’une seule instance d’une application.

Pour s’en rendre compte, c’est assez simple, il suffit de lancer une application via Visual Studio, ce dernier sera alors lié à l’instance de l’application, si on sort de l’application en cliquant sur le bouton windows et on ouvre d’autres applications, notre visual studio sera toujours en débogage, mais si on clique de nouveau sur l’icône de notre première application, Visual sort du mode débogage, preuve que le windows phone à “supprimé” l’instance précédente.

 

Le cas de la page d’accueil

La page d’accueil (avec les tiles) est considéré comme une application au même titre que les autres, on ne peut donc y retourner qu’une seule fois en faisant “précédent” sauf quand on arrive au bout de l’historique où la page d’accueil représente la fin de la navigation.

La reconnaissance de livres/dvd/cd sous mango

La reconnaissance de livres/dvd/cd sous mango

Pour changer un peu nous n’allons pas parler de développement.

Parmi les nouveautés de mango, nous trouvons Bing Vision, ce dernier permet notamment de lire les QRCode, de traduire un texte d’une photo (le menu d’un restaurant à l’étranger par exemple) ou de faire une recherche à partir d’un texte sur une photo.

Toutefois aux états-unis, un autre service est disponible sous bing vision et est plutôt impressionnant : la reconnaissance d’un livre, d’un CD ou d’un DVD en scannant non pas le code barre mais en scannant directement la couverture ! L’application vous retourne alors un résumé complet du livre, les avis des lecteurs ainsi que le prix chez les différents marchands en ligne.

Voici une petite démonstration en vidéo :

(vidéo filmé avec un autre LG Optimus 7, dsl pour la qualité)

Plutôt impressionnante, la réconnaissance est ultra rapide, les ingénieurs de microsoft ont fait un excellent boulot ! La reconnaissance fonctionne uniquement avec du contenu anglais actuellement, mais il est fort possible que le service soit disponible en france à la sortie officiel de mango.

Activer le service

La reconnaissance de livres/cd/dvd est uniquement activé pour les utilisateurs américain actuellement, pour l’activer il suffit donc de passer son téléphone en langue anglaise :

  • aller dans la liste des applications
  • cliquez sur paramètres
  • allez dans “région+langue”
  • changez la “langue d’affichage” en english (United States)
  • cliquez sur le lien pour redémarrer le téléphone

 

 

les évènements calendrier sous Mango

les évènements calendrier sous Mango

Comme vous le savez sûrement , mango ou “windows phone 7.1” apporte énormément de nouvelles api pour les développeurs, et notamment la possibilité d’accéder aux données de l’utilisateur, que ce soit ses contacts ou ses évènements.

Nous allons nous donc nous concentrer sur les évènements et la façon de les récupérer sous mango.

Autoriser l’application à accéder aux évènements

Avant de commencer, il faut vérifier que votre application est autorisées à accéder à cette partie de la l’api. Pour cela, ouvrez le WMAppManifest.xml et vérifiez que vous avez :

<Capacities>
...
<Capability Name="ID_CAP_APPOINTMENTS" />
...
</Capacities>

Si ce n’est pas le cas, ajoutez le
 

Accéder aux évènements

Nous ne disposons pas d’un accès direct au données, il faut en réalité passer par une recherche, cela évite de récupérer toutes les données pour ensuite les filtrer.

Pour réaliser une recherche, il faut utiliser la classe : Microsoft.Phone.UserData.Appointments et notamment sa méthode SearchAsync. Voici un exemple d’utilisation :


using Microsoft.Phone.UserData;

var app = new Microsoft.Phone.UserData.Appointments();
app.SearchCompleted += new EventHandler<Microsoft.Phone.UserData.AppointmentsSearchEventArgs>(app_SearchCompleted);

app.SearchAsync(DateTime.Now.AddDays(-1), DateTime.Now.AddDays(4), this);

Premier détail : la recherche se fait de façon asynchrone, toujours dans une logique de ne pas bloquer l’UI pendant la recherche. Si vous n’êtes pas à l’aise avec l’asynchronisme, vous pouvez essayer le framework Async pour windows phone qui vous facilitera la tâche.

Détaillons les différents paramètres de la fonction SearchAsync :

  • DateTime startTimeInclusive
  • DateTime endTimeInclusive
  • Object state

Les deux premiers paramètres permettent de sélectionner un intervalle de recherche, uniquement les évènements entre ces deux dates (incluses) seront retournés.

La troisième paramètres “state”, est une variable d’état, elle n’influe pas la recherche mais est retournée dans la fonction completed.

Deux autres paramètres sont optionnels :

  • int maximumItems : le nombre maximum de résultat à retourner, par défaut : infini
  • Account account : le compte utilisateur où effectué la recherche, par défaut : tous les comptes

Comme vous pouvez le voir, il n’est possible d’effectuer une recherche uniquement sur tous les comptes ou sur un compte spécifique, si vous ne voulez faire votre recherche uniquement sur 2 comptes, vous devrez faire deux recherches (ou une recherche globale + un filtrage des données)

Le résultat de la recherche

Le prototype de la fonction callback est assez classique :


void app_SearchCompleted

(object sender,

Microsoft.Phone.UserData.AppointmentsSearchEventArgs e)

L’objet AppointmentsSearchEventArgs retourné dispose de 4 propriétés :

  • BeginTimeInclusive
  • EndTimeInclusive
  • State
  • Results

Attention, les propriétés BeginTimeInclusive et EndTimeInclusive représente le début et la fin de la recherche que vous avez préalablement spécifié, ils ne sont pas lié aux résultats (ils ne correspondent donc pas à la date du premier et du dernier évènement trouvé)

La propriété State contient l’objet que vous avez passé durant la recherche.

Enfin Results est une énumération des évènements (de type Appointment) trouvés correspondant aux critères de recherches.

Le détail sur les évènements

L’objet Appointment dispose de toutes les propriétés dont vous aurez besoin :

 

  • Account : le compte utilisateur (gmail, outlook, téléphone, etc…) propriétaire de l’évènement
  • Attendees : la liste des personnes invités
  • Details : une string contenant le détail de l’évènement
  • EndTime : le début de l’évènement
  • IsAllDayEvent : un booléen indiquant si l’évènement s’il est ponctuel (false) ou la journée entière (true)
  • IsPrivate : indique si l’évènement est privé (true) ou publique (false)
  • Location : le nom du lieu (string)
  • Organizer : les informations (mail et nom) de l’organisateur
  • StartTime : le début de l’évènement
  • Status : indique votre disponibilité pendant l’évènement (occupé, absent, disponible)
  • Subject : l’intitulé de l’évènement

 

Comment récupérer la liste des comptes

En effet, si l’on souhaite demandé les résultats d’un compte spécifique, il faut au préalablement pouvoir avoir la capacité de lister les comptes du téléphone.

Encore une fois, Microsoft nous a facilité la vie en fournissant directement la liste des comptes utilisateurs pouvant synchroniser des évènements (si vous avez un email qui ne gère pas les évènements, il ne sera pas listé)


Microsoft.Phone.UserData.Appointments app = new Microsoft.Phone.UserData.Appointments();

foreach (var account in app.Accounts)

System.Diagnostics.Debug.WriteLine(account.Name);

Inclusion des évènements

Un évènement est caractérisé par un début et une fin et la recherche se fait sur un intervalle, on peut donc s’interroger sur la disponibilité des évènements à cheval sur l’intervalle de recherche (ceux commençant avant mais terminant après le début de l’intervalle ou ceux commençant avant la fin mais terminant après l’intervalle). L’api retourne en fait tous les évènements ayant sur durant l’intervalle, même si la fin de l’évènement est après l’intervalle ou si l’évènement à commencé avant, ce qui est un bon choix à mon goût.

Comment différencier les évènements spécifique à l’utilisateur des évènements “publiques”

Une des nouveautés de mango, est qu’il ajoute aux évènements calendrier les a

nniversaires de vos contacts facebook ou windows live, mais aussi les évènements nationaux comme le 14 juillet ou noël. Ces évènements ne concerne pas directement l’utilisateur, il peut donc être utile de les différencier des évènements comme les réunions, les rendez vous, etc…

L’application calendrier de windows phone fait bien cette distinction entre les deux types, un évènement de l’utilisateur disposant d’un rectangle plein, alors qu’un évènement “publique” dispose d’un rectangle vide dans la vue “agenda”.

Il n’existe pas de propriété spécifique pour cela, IsPrivate est plutôt un indicateur sur la confidentialité de l’évènement. Toutefois, il est possible de “deviner” cette distinction en regardant la propriété Organizer, un évènement “publiques” ne disposant pas d’organisateur (donc null) contrairement à un évènement spécifique à l’utilisateur (ce dernier n’étant pas forcément l’organisateur)

 

 

Ce qu’il manque

Certain vous diront qu’il manque la possibilité d’ajouter des évènements, je ne pense pas que c’est une bonne idée, ou alors uniquement via un launcher, afin de laisser l’utilisateur maitre de son calendrier et qu’il puisse valider ou non l’ajout.

Par rapport à l’application native, il manque juste une information : le nom du sous-calendrier. Par exemple, avec un compte windows live, vous avez à disposition 3 calendriers par défaut : vos évènements, les anniversaires et les fêtes nationales. Lorsque vous regardez le détail d’une fête nationale par exemple, il est bien indiqué :

calendrier : Vacances en France (read only) – Windows Live

Or l’api actuelle nous donne uniquement l’information “Windows Live”, nous n’avons donc aucune info sur le sous-calendrier utilisé. L’information n’est pas indispensable, mais puisqu’elle est disponible, autant la fournir. Pour finir il ne faut pas oublier que mango est en beta actuellement et les choses risquent de changer d’ici la version finale.

Mango et l'erreur 0x81030120

Mango et l'erreur 0x81030120

 

 

Si vous avez créé votre application via Expression Blend et que vous rencontrez l’erreur 0x81030120 lorsque vous essayez de la déployer vers un téléphone mango, c’est “normal”, enfin presque…

 

La raison

Par défaut, Blend active toutes les “capacities” possibles dans votre projet, or parmi celles-ci ce trouve ID_CAP_INTEROPSERVICES, qui ne doit surtout pas être activé.

Qu’est ce que ‘ID_CAP_INTEROPSERVICES’

Cette propriété permet à une application d’utiliser du code non managé (par exemple pour accéder ou modifier la base de registre, modifier l’OS, etc…), ce qui est évidemment strictement interdit et ne passe pas la validation du marketplace.

Toutefois, cette propriété était utilisé sous nodo par les “homebrews”, en effet, à condition d’avoir un téléphone débloqué via un compte développeur, on pouvait déployer sans aucune manipulation spéciale des applications utilisant du code non managé (avec donc ID_CAP_INTEROPSERVICES d’activé).

Avec l’arrivée de mango, Microsoft a souhaité semble t’il limiter ces possibilités, et donc interdit tout code non signé, Il est toujours possible de compiler ce genre de projet, mais il est impossible de déployer le xap vers le téléphone (via visual ou l’outils application deployment). Adieu donc la possibilité de voir ce qui se passe dans la base de registres ou de modifier des propriétés systèmes (la couleur des thèmes, etc…).

 

La solution

Revenons à notre problème, c’est à dire l’erreur 0x81030120.

Pour supprimer cette erreur, il suffit d’ouvrir le fichier WMAppManifest.xml du répertoire “‘Properties”, et de supprimer la ligne suivante :


<Capability Name="ID_CAP_INTEROPSERVICES"/>

Enregistrez la modification et redéployer votre application, l’erreur devrait disparaître.

Bon développement !