CODEWITHSUNDEEP
xamarin.androidxamarin.forms
jf974
jf974

Reputation: 5

Xamarin Forms Image/Embedded Image Problems

Visual Studio Project Image Brand new to Xamarin and I have wasted more than a day trying to get a simple image to display on a simple page.

I am using Visual Studio 2017.

The image is set as an embedded resource (see the attached image). There are no errors when run, the image simply doesn't display.

I have tried the following:

<Image Source="XF0003.Assets.logo.png" />
<Image Source="Assets.logo.png" />
<Image Source="logo.png" />
<Image Source="{local:ImageResource XF0003.Assets.logo.png}" />
<Image Source="{local:ImageResource Assets.logo.png}" />
<Image Source="{local:ImageResource logo.png}" />

XAML Page Code:

<?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:XF0003"
             x:Class="XF0003.MainPage">

    <StackLayout>
        <Image Source="Assets.logo.png" />
        <Label Text="Username" />
        <Entry x:Name="usernameEntry" Placeholder="username" />
        <Label Text="Password" />
        <Entry x:Name="passwordEntry" IsPassword="true" />
        <Button Text="Login" Clicked="PageOne" />
        <Label x:Name="messageLabel" />
    </StackLayout>
</ContentPage>

XAML.CS Page Code:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using Xamarin.Forms;

namespace XF0003
{
    public partial class MainPage : ContentPage
    {
        public MainPage()
        {
            InitializeComponent();
        }

        private async void PageOne(object sender, EventArgs e)
        {
            Navigation.InsertPageBefore(new Page1(), this);
            await Navigation.PopAsync();
        }
    }
    [ContentProperty("Source")]
    public class ImageResourceExtension : Xamarin.Forms.Xaml.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;
        }
    }
}

Upvotes: 0

Views: 805

Answers (1)

mac10688
mac10688

Reputation: 2205

In the image you linked, it looks like you only saved the image in your xamarin.forms project. I believe the images need to be saved in their respective projects.

i.e. 

 XF0003.Droid/Resources/Drawable (For Android)

 XF0003.iOS/Resources (For iOS)

Make sure your images have the same name.

For the Android pictures make the build action AndroidResource. For the iOS pictures make the build action BundleResource.

DoNotCopy for both.

When you refer to the image, just use the [name].[filetype]

<Image Source="logo.png" />

It's also explained in great detail here.

Upvotes: 2

Related Questions