wake-up-neo.net

Dynamische Bindung der Bildquelle auf Xamarin-Formularen

meine Frage ist, ob ich das String-Image an die Bildquelle binden kann. Ich habe mehrere Bilder und das Bild ändert sich je nach Bedingung. So:

Xaml auf Xamarin-Formularen: 

<Image Source="{Binding someImage}" Aspect="Fill" Grid.Row="2"></Image>

Codebehind c #

   public String someImage;
    public String SomeImage
    {
        set
        {
            if (someImage != value)
            {
                someImage = value;                                        
            }
        }
        get
        {
            return someImage;
        }
    }

InitializeComponent Teil:

if(true)
            {
                someImage = "backgroundListViewGren.png";
            }
            else
            {
                someImage = "backgroundListViewRed.png";
            }

das Bild befindet sich im Ordner "Images" in einem tragbaren Projekt

aber das funktioniert nicht, vielleicht habe ich etwas geschrieben, aber ich verstehe das nicht .. Irgendwelche Lösungen?

Ich habe es mit ImageSource und nicht mit String versucht, aber es funktioniert auch nicht.

11
Mr. Developer

Ich werde diese Antwort hier posten, weil es die ist, nach der ich gesucht habe, und ich vermute, dass die meisten anderen es sind (und Google führt Sie derzeit hierher, was derzeit nicht besonders hilfreich ist).

So binden Sie ein Bild mit XAML:

XAML:

<Image>
    <Image.Source>
        <FileImageSource File="{Binding SomeImage}" />
    </Image.Source>
</Image>

Dann im ViewModel, C #:

public string SomeImage
{
    get { return string.Format("prefix-{0}-suffix.png", OtherProperty); }
}

Neuere, bessere, aber im Wesentlichen äquivalente c # können Sie anstelle der oben genannten verwenden:

public string SomeImage => $"prefix-{OtherProperty}-suffix.png";

Dies ist sicherlich der einfachste Weg, es einzurichten, IMO :).

BEARBEITEN: Es sollte selbstverständlich sein, aber das Bild sollte offensichtlich im Resources-Ordner des Projekts für jede Plattform liegen.

12
Maverick

Du sagtest:

das Bild befindet sich im Ordner "Images" des tragbaren Projekts

Jede Plattform hat einen anderen Ansatz für Ressourcen und Bilder. Xamarin sorgt dafür, dass auf jeder Plattform beispielsweise Xamarin.iOS eine eingebettete Ressource hat, während Xamarin.Android eine Android-Ressource für Bilder verwendet.

Sie sollten Ihre Bilder in jedem Projekt für Xamarin.Forms platzieren, um zu wissen, wo sie auf jeder Plattform gesucht werden müssen.

Weitere Informationen finden Sie unter this .

3
Emad

Um Bilder von der PCL zu verwenden, lesen Sie diesen Abschnitt in der Xamarin-Dokumentation .

Sie sollten sicherstellen, dass der Build action für jedes Bild auf Embedded Resource eingestellt ist.

Wenn Sie sie in XAML verwenden möchten, geben Sie eine MarkupExtension an

[ContentProperty ("Source")]
public class ImageResourceExtension : IMarkupExtension
{
  public string Source { get; set; }

  public object ProvideValue (IServiceProvider serviceProvider)
  {
    if (Source == null)
    {
      return null;
    }
    // Do your translation lookup here, using whatever method you require
    var imageSource = ImageSource.FromResource(Source);

    return imageSource;
  }
}

Sie sollten Ihre Bilder dann so verwenden können.

<?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">
  <StackLayout VerticalOptions="Center" HorizontalOptions="Center">
    <!-- use a custom Markup Extension -->
    <Image Source="{local:ImageResource WorkingWithImages.beach.jpg}" />
  </StackLayout>
</ContentPage>

Wie in den Kommentaren erwähnt, platzieren Sie sie im Ressourcenordner Ihres jeweiligen Plattformprojekts, wenn Sie möchten, dass dies sofort funktioniert. Auf diese Weise können Sie auch die vorhandenen automatischen Größenänderungsmechanismen nutzen. Weitere Informationen zu dieser Methode finden Sie auf dieser Seite .

Wenn Sie sie mit der richtigen Namenskonvention im rechten Ordner hinzufügen, können Sie einfach auf den Dateinamen verweisen und Xamarin.Forms übersetzt dies in das richtige Format für die Plattform.

3
Gerald Versluis

Sie können es ein bisschen einfacher machen, denke ich. Dies funktioniert bei mir . Platziere das Bild an der entsprechenden Stelle auf jeder Plattform, z. Ressourcen/zeichnen auf Android

In deinem Xaml:

<Image Source="{Binding someImage}" Aspect="Fill" Grid.Row="2"></Image>

In Ihrem Ansichtsmodell:

private string _someImage = "icon_eye_hidden";
    public string someImage
    {

        get => this._someImage;
        set
        {

            if (this._someImage == value) return;

            this._someImage = value;
            this.RaisePropertyChanged(() => this.someImage);
        }
    }

Dann setzen Sie someImage auf den Namen des Bildes (ohne Erweiterung) und es sollte aktualisiert werden.

0
George McKibbin