Fermer

avril 6, 2018

Applications colorées Xamarin construites avec l'interface utilisateur Telerik

ColorfulXamarinWPF-and-WinForms_870x220


Apprenez à créer facilement un thème Telerik personnalisé et coloré pour les applications Xamarin avec ce guide pratique rapide.

Quand je suis entré dans le monde mobile en provenance du monde des applications WPF jolies et fluides, j'ai été vraiment surpris pour voir à quel point mon application était différente sur différents appareils et plateformes. Une application que vous compileriez sur iOS serait totalement différente sur Android ou UWP. Une grande partie de ceci est attribuée à l'expérience d'utilisateur et aux modèles de conception incorporés par ces plates-formes et je le comprends. Pourtant, je voulais obtenir un aspect cohérent sur toutes les plateformes et «contrôler» l'apparence de mon application.

Je voulais créer facilement une belle application colorée.

Pour résoudre ce problème pour chaque développeur mobile qui ressent la même chose, nous avons introduit un mécanisme de thème et un thème prédéfini dans Telerik UI pour Xamarin qui répond à ce défi – le thème Telerik Blue

 Couleurs et Couleurs Complémentaires

Après la sortie de ce thème, nous avons reçu beaucoup de commentaires positifs et plusieurs questions:

  • "Avez-vous l'intention de publier plus de thèmes?"
  • "J'aimerais voir un autre thème dans la suite!"
  • "J'ai deux questions: combien, et donnez-moi ça." 19659010] Ok, eh bien, en tant que développeur, je sais – nous aimons les thèmes. Alors ne soyez pas timide et dites-nous quels sont les thèmes dont vous avez besoin.

    Note: S'il vous plaît faites-nous savoir quelle interface et quel thème vous aimeriez utiliser dans votre application.

    cet article, je vais vous montrer comment personnaliser le thème actuel et changer ses couleurs dans une application qui utilise Telerik UI pour Xamarin . Par exemple, je vais modifier l'aspect de Calendar mais la même approche est valable pour toute la suite.

    Tout d'abord, appliquons le thème par défaut en ajoutant simplement le ResourceDictionary entrées pour l'assembly nécessaire. Une entrée pour le dictionnaire BlueResources est requise pour tous les composants. Je vais également ajouter une entrée pour les TelerikThemesStyles pour l'assemblage d'entrée (cet assemblage contient le composant Calendar ):

    
      
        
        
      
    

    Ensuite, nous allons définir la propriété StyleClass du contrôle:

    Si nous exécutons cet exemple, le contrôle Calendar est affiché comme suit:

     BlueCalendar

    Maintenant, changeons le bleu pour une couleur plus ensoleillée, comme le jaune. Pour ce faire, nous allons créer un thème personnalisé basé sur le bleu existant.

    Tout d'abord, nous allons définir un nouveau ResourceDictionary :

    
    

    Voici la définition de classe qui l'accompagne:

     classe partielle publique YellowResources: ResourceDictionary
    {
      public YellowResources ()
      {
        InitializeComponent ();
      }
    } 

    Ensuite, trouvons les pinceaux spécifiques pour le contrôle du thème existant et ajoutons-les au dictionnaire. Vous pouvez les trouver décrits ici . Appliquons la couleur Orange :

    
      
       Orange 
       # 919191 
       Orange 
       Jaune 
       Jaune 
       Jaune 
       # 3D5AFE 
       Orange 
       Jaune 
       Jaune 
       Jaune 
     

    Maintenant, revenez à l'application et remplacez le dictionnaire de ressources telerikCommon: BlueResources par le nouveau local : YellowResources :

      
      
        
        
        
      
     

    Et voilà, voici le calendrier jaune:

     SunnyCalendar

    Vous pouvez en savoir plus sur le thème et comment le personnaliser ici .

    Télécharger un essai gratuit

    Vous fournir les composants fiables, personnalisables et beaux dont vous avez besoin est notre mission, et la mission de Telerik UI pour Xamarin . Mais ne nous croyez pas sur parole. télécharger un essai gratuit dès aujourd'hui et le constater par vous même

    Commencer mon essai


Les commentaires sont désactivés en mode d'aperçu.



Source link