webentwicklung-frage-antwort-db.com.de

Xamarin.Forms Xaml Hintergrundbild

Ich habe gerade eine Xamarin.Forms-Anwendung gestartet und möchte meiner XAML ein Hintergrundbild hinzufügen. Ich habe das Attribut hinzugefügt, aber es erscheint nicht, wenn ich es ausführen möchte. Hier sind die Bilder.

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, wie kann ich das beheben?

 enter image description here

5
Biellx

Fügen Sie Ihre bg.png-Datei in jedes Ihrer nativen Projekte hinzu, da Sie derzeit einen Android-Emulator verwenden, und beginnen Sie mit Ihrem Xamarin.Android-Projekt:

Android - Mit Build Action: AndroidResource können Sie Bilder in das Verzeichnis Resources/drawable stellen

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

Beispiel: Fügen Sie in Ihrem Xamarin.Android-Projekt bg.png wie gezeigt hinzu:

 enter image description here

Überprüfen Sie den Build Action dieses Bildes und stellen Sie sicher, dass ihm AndroidResource zugewiesen ist. Wiederherstellen und erneut testen.

6
SushiHangover

In Xamarin.forms 

  1. Die Bilder sollten in den folgenden Ordnern abgelegt werden

       iOS, Android  - Resources folder 
    
       Windows/UWP, Windows Phone  - Assets folder 
    
  2. Dann sollte die Build-Aktion (rt click img-> properties) der Bilder wie folgt geändert werden 

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

Wenn das Bild nicht angezeigt wird, ändern Sie das in Ausgabeverzeichnis kopieren, um es zu kopieren, falls es neu ist in den Bildeigenschaften

3
D.vijay

Wenn Sie ein Hintergrundbild in der XAML-Datei für die gesamte Seite des Xamarin-Projekts hinzufügen möchten, verwenden Sie die BackgroundImage-Eigenschaft, und fügen Sie Ihr Bild dem Android-Projekt unter Ressourcen -> drawable-Ordner und für iOS-Ressourcenordner hinzu.

<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

Die Größe des Bildes zu reduzieren, funktionierte für mich.

0
Richard Long

Ein anderer Weg ( source ), den Sie dies erreichen können, besteht darin, die Build-Aktion des Images (in den Dateieigenschaften) als eingebettete Ressource festzulegen.

Mit einer Konverter-Markup-Erweiterung können Sie diese dann direkt in XAML verwenden und müssen die Dateien nicht in jedem plattformspezifischen Projekt kopieren oder verknüpfen.

Hier ist der Konverter, den Sie zu Ihrem tragbaren Projekt hinzufügen sollten:

[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;
  }
}

Dann in deiner 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

Image-Dateien können zu jedem Anwendungsprojekt hinzugefügt und über den gemeinsam genutzten Code von Xamarin.Forms referenziert werden. Um ein einzelnes Bild für alle Apps verwenden zu können, muss auf jeder Plattform derselbe Dateiname verwendet werden. Es sollte ein gültiger Android-Ressourcenname sein (dh, es sind nur Kleinbuchstaben, Ziffern, Unterstrich und Punkt zulässig).

  • iOS - Legen Sie Bilder mit Build Action: BundleResource in den Ordner Resources. Retina-Versionen des Bildes sollten ebenfalls bereitgestellt werden - zwei- und dreifache Auflösung mit einem @ 2x- oder @ 3x-Suffix für den Dateinamen vor der Dateierweiterung (z. B. [email protected]).
  • Android - Platzieren Sie Bilder mit Build Action: AndroidResource in das Verzeichnis Resources/drawable. Versionen mit hoher und niedriger DPI-Auflösung können ebenfalls bereitgestellt werden (in entsprechend benannten Ressourcen-Unterverzeichnissen wie drawable-ldpi, drawable-hdpi und drawable-xhdpi).
  • Windows Phone - Platzieren Sie Bilder mit Build Action: Content im Stammverzeichnis der Anwendung.
  • Windows/UWP - Platzieren Sie Bilder mit Build Action: Content im Stammverzeichnis der Anwendung.

Weitere Informationen finden Sie unter Arbeiten mit Bildern Laden und Anzeigen von Bildern in Xamarin.Forms

0