Mon Blog

Pour supprimer l'historique d'une recherche dans un composant de type SearchBox sur Windows Phone ou du composant SearchBar sur Xamarin avec Windows, il suffit d'éxécuter ce code:

 
// Clear SearchBar history
var searchManager = new Windows.ApplicationModel.Search.Core.SearchSuggestionManager();
searchManager.ClearHistory();

Avec Xamarin, il suffit d'éxécuter ce code dans le App.xaml.cs de l'application Windows après cette ligne de code:

 
 // Place the frame in the current Window
Window.Current.Content = rootFrame;

Dans ce tutorial nous allons voir la facon la plus simple de développer une application web a la fois compatible 'desktop' et mobile. Avec l'apparence d'une apps.

Pour cela nous allons utiliser le plugin 51Degrees et Jquery Mobile.

Avec cette méthode, le contenu de l'application web et le contenu de l'application desktop seront les memes mais présentés de facon tres différentes. Dans une application professionnelle, souvent on souahite un site assez différent de l'application web. Nous verrons cela dans un autre tutorial mais le principe de base sera quasiment le meme.

Avec MVC4, tout sera déja intégré, mais en attendant l'arrivée de MVC4 c'est ici que ca se passe !

1) Créer une nouvelle application web de type MVC3:

2) Créer une nouvelle mise en page (layout) pour les mobiles

Copier coller le layout par defaut et le renommer _LayoutMobile.cshtml. Pour les futurs tests, vous pouvez rajouter un texte pour différencier les vues:

3) Modifier le "sélectionneur de mise en page" /Views/_ViewStart.cshtml

Remplacer:

@{
    Layout = "~/Views/Shared/_Layout.cshtml";
}

Par:

@{
    Layout = Request.Browser.IsMobileDevice ? "~/Views/Shared/_LayoutMobile.cshtml" : "~/Views/Shared/_Layout.cshtml";
}

4) Tester notre application avec un navigateur de type Desktop et avec un émulateur mobile

Si vous ne voullez pas vous embeter avec un émulateur je vous conseil d'utiliser firefox avec l'extension User Agent Switcher

Sinon vous pouvez utiliser l'émulateur windows phone fournit par le windows phone sdk, ou l'émulateur iphone/ipad disponnible ici.

C'est partit pour les tests:

- Desktop (ici avec Firefox)

- Mobile (ici avec ibbdemo3)

Nous pouvons voir le texte "Hello I am a mobile"affiché

5) Probleme avec cette technique :

Tous les appareils et navigateur mobiles ne sont pas détecté par défaut avec le framework .Net

Example avec opera mobile :

C'est la version desktop qui est affiché

Pour remédier a ce problème, c'est ici que le plugin 51Degrees intervient

6) Installation du plugin 51Degrees

Pour cela, ouvrir la console NuGet package manager (Ou directement avec l'outil NuGet) et entrer la commande : Install-Package 51Degrees.mobi

Première chose a faire :

Plusieurs fichiers ont été créés, ouvrir le fichier de configuration 51Degrees.mobi.config et commenter ces lignes (Ces lignes servent uniquement pour une application ASP.NET):

<!--<redirect firstRequestOnly="false"
              mobileHomePageUrl="~/mobile/default.aspx"
              timeout="20"
              devicesFile="~/App_Data/Devices.dat"
              mobilePagesRegex="mobile">
</redirect>-->

Apres avoir compiler et rafraichi opera mobile, notre application est opérationelle pour la pluspart des mobiles du marché (De plus 51Degrees peut recevoir des mises a jour)

7) Maintenant a vous de personnaliser le design de votre application mobile

Courte introduction a jQueryMobile:

Retour a la console NuGet: Install-Package jquery.mobile

Que se passe t-il, il y a des fichiers partout ! Pas de panique... On va arranger ca.

Dans le dossier theme, creer un dossier 'mobile' et déposez y tous les fichiers liés a Jquery mobile. Deplacez le fichier Site.css dans le theme 'base'.

Ne pas oublier de mettre a jour _Layout.cshtml avec le theme par defaut et la nouvelle version de JQuery.

Voici a quoi ressemble le layout _LayoutMobile.cshtml pour utiliser jQueryMobile:

<link href="@Url.Content("~/Content/themes/mobile/Site.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/themes/mobile/jquery.mobile-1.1.1.min.css")" rel="stylesheet" type="text/css" />
<script src="@Url.Content("~/Scripts/jquery-1.6.4.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.mobile-1.1.1.min.js")" type="text/javascript"></script>

Nous pouvons maintenant commencer a faire joujou avec les éléments jQuery mobile :

<div data-role="page" class="page">
        <div data-role="header">
            <div id="title">
                <h1>My Mobile MVC Application</h1>
            </div>
            <div id="logindisplay">
                @Html.Partial("_LogOnPartial")
            </div>
            <div data-role="navbar">
                <ul>
                    <li>@Html.ActionLink("Home", "Index", "Home")</li>
                    <li>@Html.ActionLink("About", "About", "Home")</li>
                </ul>
            </div>
        </div>
        <section id="main" style="min-height: 300px">
            @RenderBody()
        </section>
        <div data-role="footer" style="text-align: center">
            Copyright : @DateTime.Now.Year
        </div>
</div>

Pour plus d'exemples : go to http://jquerymobile.com/demos

8) Résultat final:

Voila c'est fini !

Comparer deux listes :

Obtenir les résultats communs entre la list2 et la list1

 var result = list2.Where(l2 => list1.Any(l1 => l1.Id == l2.Id)).ToList();

Obtenir les résultats de list1 qui ne sont pas dans list2

var result = list1.Where(l2 => !list2.Any(l1 => l1.Id == l2.Id)).ToList();

Voici un exemple d'implémentation du plugin UserDialogs pour la plateforme Windows.

L'auteur du plugin a indiqué qu'il ne supportera pas Windows 8. Il préfère se concentrer sur le développement du plugin pour Windows 10.

ConfirmAsync

public async Task<bool> ConfirmAsync(string message, string title = null, string okText = "OK", string cancelText = "Cancel")
{
   var messgeDialog = new MessageDialog(message, title);
   messgeDialog.Commands.Add(new UICommand(okText));
   messgeDialog.Commands.Add(new UICommand(cancelText));
   messgeDialog.DefaultCommandIndex = 0;
   messgeDialog.CancelCommandIndex = 1;
   var result = await messgeDialog.ShowAsync();
   if (result.Label.Equals(okText))
   {
      return true;
   }
   else
   {
      return false;
   } 
}

AlertAsync

public async Task AlertAsync(string message, string title = null, string okText = "OK")
{
   var md = new MessageDialog(message, title);
   await md.ShowAsync();
}

PromptAsync

public async Task PromptAsync(string message, string title = null, string okText = "OK", string cancelText = "Cancel", string placeholder = "", bool secure = false)
{
   var dialog = new PromptDialog(message, placeholder);
   var result = await dialog.ShowAsync();
   if (result != null)
   {
      return result;
   }
   else
   {
     

Pour tester une application Windows store, vous serez quasiment obligé d'éxécuter l'application sur des tablettes et des PC en mode Debug sans passer par le Store.

Pour publier une application Windows 8 ou Windows 10 sans passer par le Store "SideLoading" il suffit de :

1) Créer les packages de l'application

Clic droit sur le projet, puis Windows Store > Créer des packages d'application...

Répondre Non à la question suivante, puis Suivant

Il faudra au moins sélectionner la cible x86 ou x64 en fonction de la plateforme ciblée.

2) Hack du script d'installation

Cette étape est nécessaire seulement si la machine cible n'est pas équipée de Visual Studio et que l'on ne désire pas saisir de compte développeur Windows.

Ouvrir le fichier "Add-AppDevPackage.ps1" généré précedemment, avec un éditeur de texte et rechercher la ligne suivante:

$NeedDeveloperLicense = CheckIfNeedDeveloperLicense

Remplacer par:

$NeedDeveloperLicense = $false

3) Installation de l'éxécutable

 Sur la tablette ou le PC client, copier le dossier généré précédemment. Ouvrir le dossier ayant la version désirée, puis faire un clic droit sur le fichier "Add-AppDevPackage.ps1" et "Exécuter avec PowerShell'

Suivre les instructions, appuyer sur entrer

Installation du certificat de test, entrer « Y / O / U » pour continuer (en fonction de la langue) 

Installation terminée, appuyer sur entrer

La tuile pour démarrer l’application apparait sur le menu de démarrage (Sur Windows 10, elle apparaitra dans le menu démarrer « applications récentes » 

4) Autoriser Windows à executer des applications de confiance (allow trusted apps to run) 

Comme dans l'étape 2, si Visual Studio est installé sur le poste, cette étape est inutile. Sinon il faudra mettre à jour une clé dans la base de registre.

Ouvrir l’éditeur de stratégie de groupe locale avec gpedit.msc et changer les 2 valeurs suivantes : (Seulement la première pour Windows 8)

En anglais : Local Computer Policy > Computer Configuration > Administrative Templates > Windows Components > App Package Deployment > Allow all trusted apps to install setting Les clés suivantes vienent dêtre créées :

HKEY_LOCAL_MACHINE\Software\Policies\Microsoft\Windows\Appx\AllowAllTrustedApps = 1 HKEY_LOCAL_MACHINE\Software\Policies\Microsoft\Windows\Appx\AllowDevelopmentWithoutDevLicence = 1

Pour Windows 10, il sera également nécessaire d’activer le mode développeur : Cortana -> « développeur ». De plus la clé de registre AllowDevelopmentWithoutDevLicence ne sera pas présente dans gEdit.

Et voila, votre application est installée sans être passé par le Store ;)

Se connecter au team project :

Pour la démo je mets les settings directement dans les classes/méthodes. Dans la vrai vie, on utilisera un fichier de conf ou autre ;)

public static Uri CollectionUri = new Uri("https://adresse-serveur-tfs/tfs/DefaultCollection");
public static NetworkCredential NetworkCredential = new NetworkCredential(@"login", "pwd"); 

TfsTeamProjectCollection teamProjectCollection = new TfsTeamProjectCollection(CollectionUri , NetworkCredential ); 
workItemStore = teamProjectCollection.GetService(); 

if (!teamProjectCollection.HasAuthenticated) { 
    throw new Exception("Not Authenticated"); 
} 

// Ici seront faites, toutes les opérations (read + write)
teamProjectCollection.Dispose(); 

Lire un WorkItem

// Ici on souhaite obtenir un WI en fonction de son titre.
string query = "SELECT * FROM Issue WHERE Title = '" + title + "'";

WorkItemCollection workItemCol = workItemStore.Query(query); // Exécution de la requête
WorkItem workItem = workItemStore.Query(query)[0]; // récupération du WI

#if DEBUG
	// Liste tous les champs du WI, très utile en debug pour connaître le nom des champs
     	var filedsStr = string.Join(" - ", workItem.Fields.Cast().Select(f => f.ReferenceName).ToList());

#endif
      	// get title
        var