Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

397
Visualizações
How to correctly use the Image Source property with Xamarin.Forms?

I am having difficulty bringing up an image on the content page in a stack layout. I looked through Xamarin API Documentation and found Xamarin.Forms.Image.Source Property, but no sample code to see how it's written. I also checked to see how it was written in C# and seems to match my code in terms of filename path, but in Xamarin, it may be slightly different since it's the first time doing this. The code I'm currently testing through an Android emulator (Google Nexus 5) in Visual Studio 2013 which runs fine, with the exception of the Image not showing.

Image Source:

new Image
{
     VerticalOptions = LayoutOptions.Center,
     HorizontalOptions = LayoutOptions.Center,
     Source = "/Assets/xamarin_logo.png",
},

Full Code:

public NFCPage()
    {
        StackLayout stackLayout = new StackLayout // instantiate a StackLayout object to layout its children
        {
            Spacing = 5, // amount of spae between each child element
            //HorizontalOptions = LayoutOptions.Center,
            VerticalOptions = LayoutOptions.FillAndExpand, // defines how the elements should be laid out; fill the entire width of the content to the screen
            BackgroundColor = Color.Blue,

            Children = // gets a list of child elements
            {
                new Label
                {   
                    TextColor = Color.White,
                    BackgroundColor = Color.Red,
                    XAlign = TextAlignment.Center, // set text alignment horizontally
                    Text = "Google",
                },
                new Label
                {
                    Text = "Place your device directly at the symbol.",
                    XAlign = TextAlignment.Center,
                    TextColor = Color.White,
                },
                new Image
                {
                    VerticalOptions = LayoutOptions.Center,
                    HorizontalOptions = LayoutOptions.Center,
                    Source = "/Assets/xamarin_logo.png",
                },
                new Button
                {
                    Text = "QR Code",
                    TextColor = Color.White,
                },
                new Button
                {
                    Text = "?",
                    TextColor = Color.White,
                },
            }
        };
        Content = stackLayout; // apply stackLayout to Content
    }
over 4 years ago · Santiago Trujillo
3 Respostas
Responde à pergunta

0

You shouldn't reference the path because the source property is cross-platform and since every platform has a different folder for assets like images, you only need to specify the filename and extension. The Image class knows where to look to find the file.

Image files can be added to each application project and referenced from Xamarin.Forms shared code. To use a single image across all apps, the same filename must be used on every platform, and it should be a valid Android resource name (which means no spaces and special characters). Place images in the Resources/drawable directory with Build Action: AndroidResource . High- and low-DPI versions of an image can also be supplied (in appropriately named Resources subdirectories such as drawable-ldpi , drawable-hdpi , and drawable-xhdpi ).

enter image description here

var beachImage = new Image { Aspect = Aspect.AspectFit };
beachImage.Source = ImageSource.FromFile("waterfront.jpg");

Source: https://docs.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/images?tabs=windows#local-images

over 4 years ago · Santiago Trujillo Relatório

0

If you are willing to add images using code, try this

Downloaded automatically and display the image

        var webImage = new Image { Aspect = Aspect.AspectFit };
        webImage.Source = ImageSource.FromUri(new Uri("https://xamarin.com/content/images/pages/forms/example-app.png"));
over 4 years ago · Santiago Trujillo Relatório

0

Add the image in Solution Explorer by clicking Resources/Drawable folder and select New/Existing item.Please don't copy image to Resources/Drawable folder. I Hope it helps.

over 4 years ago · Santiago Trujillo Relatório
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda