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"
Related
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 !
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".
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.
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.
I want to make my own control, inheriting from GroupBox.
Ive followed instructions in here, and that's the result of the implementation:
using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Windows.Forms;
namespace GeneralUserControls
{
public partial class MyGroupBox : GroupBox
{
public MyGroupBox ()
{
InitializeComponent();
}
protected override void OnPaint(PaintEventArgs pe)
{
base.OnPaint(pe);
}
}
}
But when I try to use it this way:
<Window [...]
xmlns:guc="clr-namespace:GeneralUserControls;assembly=GeneralUserControls" >
[...
<guc:MyGroupBox Header="Etiquette :" Width="70" Height="70">
<Grid>
[...]
</Grid>
</guc:MyGroupBox>
It seems to not consider it as a groupbox! Here are the errors:
Error 1 The property 'Header' was not found in type 'MyGroupBox'.
Error 2 The type 'MyGroupBox' does not support direct content.
Error 3 Cannot add content to an object of type "MyGroupBox".
Error 9 Cannot add content to object of type 'GeneralUserControls.MyGroupBox'.
Any idea?
You try to mix WPF with WinForms. I see the namespace using System.Windows.Forms; You need to make a WPF custom control, or if you really want a WindowsForms control, you need to wrap it in a WindowsFormsHost control.
The namespace of the GroupBox in WPF is System.Windows.Controls. According to the link you provided, I think you read the wrong tutorial.
You could read for example this: http://wpftutorial.net/HowToCreateACustomControl.html