Picture as background in Xamarin Forms is not displayed - c#

I want to use a picture as background in my Xamarin Forms Android app. That image is stored in drawable folder. The image is not displayed when I debug the app on my smartphone. Below is the code. Thank you
<?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:XamarinTest"
x:Class="XamarinTest.MainPage"
BackgroundImage = "BGImage.jpeg">
<StackLayout>
<!-- Place new controls here -->
<Label Text="Welcome to Xamarin.Forms!"
HorizontalOptions="Center"
VerticalOptions="CenterAndExpand" />
</StackLayout>
</ContentPage>
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using Xamarin.Forms;
namespace XamarinTest
{
public partial class MainPage : ContentPage
{
public MainPage()
{
InitializeComponent();
}
}
}

I guess you just store it in the folder but not add it in the project.
you should right click the resource->drawable folder -->add-->add file to add the image file .

Check where do you store your images:
For Android, iOS - Resource Folder;
For Windows Phone, Win/UWP - Assets folder;
Also check "Build action" (it should be AndroidResource for Android, BundleResource for iOS) and additionally (if still not showing) "Copy To Ouput Directory" should be "Copy if newer".

Related

element defined in xaml "does not exist" in c# code behind

I´ve started to learn xamarin forms and now I'm already starting to apply animation to my Image. But I've got an error in my code.
Here's my code in xaml.cs:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using Xamarin.Forms;
using Xamarin.Forms.Xaml;
namespace teste2
{
[XamlCompilation(XamlCompilationOptions.Compile)]
public partial class Page1 : ContentPage
{
public Page1()
{
InitializeComponent();
}
protected override async void OnAppearing()
{
base.OnAppearing();
// The animation
car.FadeTo(0, 2000);
}
}
}
And here's my error:
Error CS0103 Name 'car' does not exist in current context teste2
And here's my xaml code:
<?xml version="1.0" encoding="utf-8" ?>
<TabbedPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="teste2.TabsPage" BarBackgroundColor="#508ca7"
xmlns:android="clr-namespace:Xamarin.Forms.PlatformConfiguration.AndroidSpecific;assembly=Xamarin.Forms.Core"
android:TabbedPage.ToolbarPlacement="Bottom">
<TabbedPage.Children >
<ContentPage Title="Voiture" IconImageSource="lab_icon_voiture.png" BackgroundColor="#DCCECD">
<StackLayout VerticalOptions="CenterAndExpand" HorizontalOptions="Center">
<!-- The image that i want to animate-->
<Image Source="lab_voiture.png" x:Name="car"/>
</StackLayout>
</ContentPage>
<ContentPage Title="Avion" IconImageSource="lab_icon_avion.png" BackgroundColor="#f4f4f4">
<StackLayout Orientation="Vertical" HorizontalOptions="Center" VerticalOptions="CenterAndExpand">
<Image Source="lab_avion.png" x:Name="plane"/>
</StackLayout>
</ContentPage>
</TabbedPage.Children>
</TabbedPage>
This is a common issue with Xamarin on VS, especially on MAC, what happens is that your debug file does not generate the XAML changes onto the xaml.g.cs file. Which is basically the file that is autogenerated where our compiler combines the xaml and xaml.cs file.
All you need to do for this to update correctly is to comment the following line of code:
car.FadeTo(0, 2000);
Once you do this go for a clean build or a rebuild. once your app builds successfully go back to this line of code again and uncomment it and this should start working
Goodluck !

Splashscreen will not move to next page

I have been reading much about Xamarin for sometime and how to make a splash screen. I am quite new to something like this and hence i wanted to ask on here, Why is the splash screen not redirecting to the login page in the Emulator'
i am using Visual Studio 2019, I added a new folder drawable-hdpi and then added the images to it to be used inside the xaml. Now what? it does not redirect!
Here is what my code looks like
Splash screen Xaml (MainPage.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:d="http://xamarin.com/schemas/2014/forms/design"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
x:Class="VisitorMan.MainPage"
BackgroundColor="#fff">
<StackLayout HorizontalOptions="Center" VerticalOptions="Center" Padding="10">
<Image Source="splash_logo.png" x:Name="imgLogo" HeightRequest="150" WidthRequest="150"/>
</StackLayout>
</ContentPage>
The corresponsing MainPage.xaml.cs File Looks like this
using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using Xamarin.Forms;
namespace VisitorMan
{
// Learn more about making custom code visible in the Xamarin.Forms previewer
// by visiting https://aka.ms/xamarinforms-previewer
[DesignTimeVisible(false)]
public partial class MainPage : ContentPage
{
public MainPage()
{
InitializeComponent();
Animate();
}
public async Task Animate()
{
imgLogo.Opacity = 0;
await imgLogo.FadeTo(1, 4000);
Application.Current.MainPage = new LoginPage();
}
}
}
The Login Page which shows the username and password (LoginPage.xaml) Looks like this
<?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:d="http://xamarin.com/schemas/2014/forms/design"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
x:Class="VisitorMan.LoginPage"
BackgroundColor="#fff">
<ContentPage.Content>
<StackLayout Spacing="20" Padding="50" VerticalOptions="Center">
<Image Source="splash_logo.png" x:Name="imgLogo" HeightRequest="150" WidthRequest="150"/>
<Entry Placeholder="Username"></Entry>
<Entry Placeholder="Password" IsPassword="True"></Entry>
<Button Text="Log In" TextColor="White" BackgroundColor="#ff77D065"></Button>
</StackLayout>
</ContentPage.Content>
</ContentPage>
The splashscreen is just standstill and does not redirect to the Login Page. Could there be something i am missing?
I have tried shared sample , the problem is that you need to update nuget packages (especially version of Xamarin.Forms) of project to the latest version.
Right click Solution of project , choose Manage Nuget Packages For Solution...
After Updated :
The effect :
I didn't check but you can try this
public async Task Animate()
{
imgLogo.Opacity = 0;
await imgLogo.FadeTo(1, 4000);
Device.BeginInvokeOnMainThread(() =>
{
Application.Current.MainPage = new LoginPage();
});
}

Xamarin.form using embedded images

I want to use embedded images in my portable code. I am using a markup extension as many different videos and guides have shown. My project compiles and runs but no image is displayed. These guides say to put the images under "references" but I am unable to drag an image there or right click and add one in so they are in a folder called Images. If the problem is that they aren't under references then how do I get them there? Otherwise if anyone can spot the error that would be much appreciated.
https://www.c-sharpcorner.com/article/add-images-icons-and-splash-screen-in-xamarin-forms/
https://learn.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/images?tabs=vswin
About.xaml.cs:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using Xamarin.Forms;
using Xamarin.Forms.Xaml;
namespace SVCAPB
{
[XamlCompilation(XamlCompilationOptions.Compile)]
public partial class About : ContentPage
{
public About()
{
InitializeComponent();
Image embeddedImage = new Image { Source = ImageSource.FromResource("SVCAPB.Images.apbLeaders.jpg") };
}
}
}
About.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:SVCAPB.MarkupExtensions"
x:Class="SVCAPB.About"
Title="About">
<ContentPage.Content>
<ScrollView>
<StackLayout
HorizontalOptions="Fill"
VerticalOptions="Fill"
BackgroundColor="#FFC107">
<Image Source="{local:EmbeddedImage ResourceId=SVCAPB.Images.apbLeaders.jpg }"></Image>
</StackLayout>
</ScrollView>
</ContentPage.Content>
</ContentPage>
EmbeddedImage.cs(under folder MarkupExtensions):
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using Xamarin.Forms;
using Xamarin.Forms.Xaml;
namespace SVCAPB.MarkupExtensions
{
public class EmbeddedImage : IMarkupExtension
{
public string ResourceId
{
get;
set;
}
public object ProvideValue(IServiceProvider serviceProvider)
{
if (String.IsNullOrWhiteSpace(ResourceId)) return null;
return ImageSource.FromResource(ResourceId);
}
}
}
Your code is correct, the problem is in the way of adding the images or the reference of your class
1.-Right click on your Images folder -> Add-> Add files-> select your image
2.- This step is necessary as it is marked in the documentation
-if you are using Xamarin studio right click on the image -> Build Action -> EmbeddedResource
-if you are using Visual studio right click -> properties -> Build Action -> EmbeddedResource
or
if you are using Xamarin studio you only need xmlns:local="clr-namespace:SVCAPB"
if you are using Visual studio you need to specify the directory xmlns:local="clr-namespace:SVCAPB.MarkupExtensions"

XAML code behind x:name property is unaccessable

I'm new to xamarin forms, I created an Android Forms apps. But when i give x:Name="" to any element in xaml. In code behind i can't access this property id.
- I updated nuget packages even i keep trying to rebuild projects. But still unable to access xaml ids in code behind. I also uninstalled and installed visual studio multiple times. But still the same problem.
You have to build the project once after adding control in the Xaml.Then you will be able to access the control.
Try to execute this code and find what is wrong in your code:
TestPage.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"
x:Class="TestImageCropping.TestPage">
<ContentPage.Content>
<Label x:Name="label1" Text="Hello"/>
<Button x:Name="button1" Text="Xamarin"/>
</ContentPage.Content>
</ContentPage>
TestPage.xaml.cs:
using System;
using System.Collections.Generic;
using Xamarin.Forms;
namespace TestImageCropping
{
public partial class TestPage : ContentPage
{
public TestPage()
{
InitializeComponent();
label1.TextColor = Color.Blue;
button1.Text = "Click here";
}
}
}
There are some issues related to x:Name property and accessing it in background...
Try to write it manually, it will work.

CrossTextToSpeech sound issue in Xamarin Android

I have created a .NET 2017 solution to start a Text To Speech app. I have followed online instructions and seems really simple, I added the TextToSpeech plugin version 3.0.1 to the solution and added the following code to the MainPage of the Portable Project:
MainPage.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:XamarinTextToSpeech"
x:Class="XamarinTextToSpeech.MainPage">
<ContentPage.Content>
<StackLayout>
<Entry x:Name="Enter" />
<Button Text="Speak" Clicked="Button_Clicked" />
</StackLayout>
</ContentPage.Content>
</ContentPage>
MainPage.xaml.cs
using Plugin.TextToSpeech;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using Xamarin.Forms;
namespace XamarinTextToSpeech
{
public partial class MainPage : ContentPage
{
public MainPage()
{
InitializeComponent();
}
private void Button_Clicked(object sender, EventArgs e)
{
var text = Enter.Text;
CrossTextToSpeech.Current.Speak(text);
}
}
}
But when I debug to an Android emulator (VisualStudio_android-23_x86_phone) and type in something to the Entry textbox, there is no sound. I have stepped through the code and the entered text definitely gets passed in.
Have I missed something? Any help would be much appreciated.

Categories