web-dev-qa-db-fra.com

Xamarin.Forms Xaml Image de fond

Je viens de démarrer une application Xamarin.Forms et je souhaite ajouter une image d'arrière-plan à mon XAML. J'ai ajouté l'attribut mais il n'apparaît pas à l'exécution !! Voici les images.

APP

public class App : Application
{
    public App()
    {
        // The root page of your application
        MainPage = new Page();
    }

XAML:

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
         xmlns:x="http://schemas.Microsoft.com/winfx/2009/xaml"
         x:Class="App1.Page"
         BackgroundImage="bg.png">

 enter image description here

SO, comment puis-je résoudre ce problème?

 enter image description here

5
Biellx

Ajoutez votre fichier bg.png dans chacun de vos projets natifs, car vous utilisez actuellement un émulateur Android. Commencez par votre projet Xamarin.Android:

Android - Placez les images dans le répertoire Resources/drawable avec l'action de construction: AndroidResource

ref: https://developer.xamarin.com/guides/xamarin-forms/working-with/images/

Exemple: dans votre projet Xamarin.Android, ajoutez bg.png comme indiqué:

 enter image description here

Vérifiez le Build Action de cette image et assurez-vous qu'elle est assignée à AndroidResource. Reconstruisez et re-testez.

6
SushiHangover

Dans Xamarin.forms 

  1. Les images doivent être placées dans les dossiers suivants

       iOS, Android  - Resources folder 
    
       Windows/UWP, Windows Phone  - Assets folder 
    
  2. Ensuite, l'action de construction (rt click img-> propriétés) des images doit être modifiée comme suit 

    iOS - BundleResource             Windows Phone - Content
    
    Android - AndroidResource        Windows/UWP - Content
    

Si l'image fixe n'est pas affichée, essayez de changer le répertoire Copier dans le répertoire de sortie pour le copier s'il est plus récent in image

3
D.vijay

Si vous souhaitez ajouter une image d’arrière-plan au fichier XAML pour l’ensemble de la page du projet Xamarin, utilisez la propriété BackgroundImage et ajoutez votre image au projet Android sous Ressources -> dossier pouvant être dessiné et pour le dossier Ressources iOS.

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.Microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:PhoneDailerDemo"
             x:Class="PhoneDailerDemo.MainPage"
             BackgroundImage="image3.jpg">

    <Label Text="Welcome to Xamarin Forms!" 
           VerticalOptions="Center" 
           HorizontalOptions="Center" />
    <StackLayout Padding="100">
       //..........
    </StackLayout>
</ContentPage>
1
Prabhat Maurya

Réduire la taille de l'image a fonctionné pour moi.

0
Richard Long

Pour ce faire, vous pouvez également ( source ) définir l'action de génération de l'image (dans les propriétés du fichier) en tant que ressource incorporée.

Ensuite, en utilisant une extension de balisage de convertisseur, vous pourrez l’utiliser directement dans XAML sans avoir à copier ou à lier les fichiers de chaque projet spécifique à une plate-forme.

Voici le convertisseur que vous devez ajouter à votre projet portable:

[ContentProperty(nameof(Source))]
public class ImageResourceExtension : IMarkupExtension
{
  static readonly Assembly CurrentAssembly = 
    typeof(ImageResourceExtension).GetType().Assembly;

  public const string Assets = nameof(Assets);

  public string Source { get; set; }

  public object ProvideValue(IServiceProvider serviceProvider)
  {
    if (string.IsNullOrWhiteSpace(Source))
      return null;

    // Do your translation lookup here, using whatever method you require            
    var source = $"{CurrentAssembly.GetName().Name}.{Assets}.{Source}";

    var imageSource = ImageSource.FromResource(source, CurrentAssembly);

    return imageSource;
  }
}

Puis dans votre XAML:

<?xml version="1.0" encoding="UTF-8" ?>
<ContentPage
   xmlns="http://xamarin.com/schemas/2014/forms"
   xmlns:x="http://schemas.Microsoft.com/winfx/2009/xaml"
   xmlns:local="clr-namespace:WorkingWithImages;Assembly=WorkingWithImages"
   x:Class="WorkingWithImages.EmbeddedImagesXaml">
  <Image Source="{local:ImageResource Background.jpg}"}
</ContentPage>
0
Shimmy

Des fichiers image peuvent être ajoutés à chaque projet d'application et référencés à partir du code partagé Xamarin.Forms. Pour utiliser une seule image dans toutes les applications, le même nom de fichier doit être utilisé sur toutes les plateformes. Il doit s'agir d'un nom de ressource Android valide (c.-à-d. Que seules les lettres minuscules, les chiffres, le trait de soulignement et le point sont autorisés).

  • iOS - Placez les images dans le dossier Ressources avec Build Action: BundleResource. Les versions Retina de l'image doivent également être fournies - deux et trois fois la résolution avec les suffixes @ 2x ou @ 3x du nom de fichier précédant l'extension du fichier (par exemple, [email protected]).
  • Android - Placez les images dans le répertoire Resources/drawable avec Build Action: AndroidResource. Des versions haute et basse DPI d'une image peuvent également être fournies (dans des sous-répertoires Ressources nommés de manière appropriée, tels que drawable-ldpi, drawable-hdpi et drawable-xhdpi).
  • Windows Phone - Placez les images dans le répertoire racine de l'application avec Build Action: Content.
  • Windows/UWP - Placez les images dans le répertoire racine de l'application avec Build Action: Content.

Vous pouvez en savoir plus sur Travailler avec des images Chargement et affichage des images dans Xamarin.Forms

0
Rohit Vipin Mathews