How to localize page title using resource files (.resw)? - xaml

I need to translate the title of basic page in windows8 app. Here is a xaml string:
<Page.Resources>
<!-- TODO: Delete this line if the key AppName is declared in App.xaml -->
<x:String x:Uid="title_select_profile" x:Key="AppName">Select profile</x:String>
</Page.Resources>
So, the trick with Uid doesn't work here. How to get accsess to this string from resource file?

Related

Unable to add MediaPlayerElement in XAML

I'm trying to use the Windows.Media.Playback MediaPlayer. I am attempting to follow the information here Play audio and video with MediaPlayer. I am able to hear the audio of a video by calling it from C#.
public MainPage()
{
InitializeComponent();
var mediaPlayer = new MediaPlayer();
mediaPlayer.Source = MediaSource.CreateFromUri(new Uri("https://sec.ch9.ms/ch9/5d93/a1eab4bf-3288-4faf-81c4-294402a85d93/XamarinShow_mid.mp4"));
mediaPlayer.Play();
}
However, when I attempt to add a MediaPlayerElement in XAML I get an 'MediaPlayerElement' cannot be added to a collection or dictionary of type 'IList'1'. error
<?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:controls="clr-namespace:Windows.UI.Xaml.Controls;assembly=Windows.Foundation.UniversalApiContract"
x:Class="XamarinTest.MainPage">
<StackLayout>
<controls:MediaPlayerElement x:Name="_mediaPlayerElement" AreTransportControlsEnabled="False" HorizontalAlignment="Stretch" Grid.Row="0"/>
</StackLayout>
</ContentPage>
If I remove the StackLayout and have the MediaPlayerElement directly in the Content I get a 'Content' does not support values of type 'MediaPlayerElement'.
I saw this question so I assume I'm missing some kind of DLL or reference but I am unable to locate what reference would be needed.
You are trying to apply UWP controls to a cross platform Xamarin Forms project
Windows.Media.Playback is only for Windows, and would not work on Android or iOS. There are techniques you can use to include platform specific controls in a Xamarin project, or you can use a cross-platform control like MediaElement

Implementing TeachingTip control for a UWP App

To install the TeachingTip-control in my UWP app, I've done the following stepts:
installed Microsoft.UI.Xaml package via Nuget in my project
Added <XamlControlsResources xmlns = "using:Microsoft.UI.Xaml.Controls" /> into App.xaml.
Imported Namespace xmlns:controls="using:Microsoft.UI.Xaml.Controls"
I implemented the TeachingTip-control as follows:
<Button x:Name="BackButton"
Background="{x:Null}"
Content="Back"
Click="BackButton_Click">
<Button.Resources>
<controls:TeachingTip x:Name="ToggleThemeTeachingTip"
Target="{x:Bind BackButton}"
Title="Change themes without hassle"
Subtitle="It's easier than ever to see control samples in both light and dark theme!"
CloseButtonContent="Got it!">
</controls:TeachingTip>
</Button.Resources>
</Button>
<Button x:Name="TeachingTipButton"
Click="TeachingTipButton_OnClick">
</Button>
private void TeachingTipButton_OnClick(object sender, RoutedEventArgs e)
{
ToggleThemeTeachingTip.IsOpen = true;
}
When I call the function I get the following DISABLE_XAML_GENERATED_BREAK_ON_UNHANDLED_EXCEPTION error (probably UI error), which I do not understand:
What could be the problem? Why does not my code work?
Edit:
I have now determined that the error is due to App.xaml. After I've installed the Nuget package Microsoft.UI.Xaml, it's expected to add the following code in App.xaml:
But I have already in App.xaml other settings and resources:
When I try to add only the line in App.xaml a key error occurs:
<XamlControlsResources xmlns="using:Microsoft.UI.Xaml.Controls"/>
If I give the resource entry a key like this:
<XamlControlsResources x: Key = "XamlControlsResources" xmlns = "using: Microsoft.UI.Xaml.Controls" />
 It comes to a completely different error:
Windows.UI.Xaml.Markup.XamlParseException: "The text for this error is not found.
Can not find a Resource with the Name / Key TeachingTipBackgroundBrush
How can I properly add the resource <XamlControlsResources xmlns="using:Microsoft.UI.Xaml.Controls"/> correctly in my App.xaml?
Your App.xaml file needs to look like this:
<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<XamlControlsResources xmlns="using:Microsoft.UI.Xaml.Controls" />
</ResourceDictionary.MergedDictionaries>
<!-- Other styles here -->
<Style TargetType="Button">
...
</Style>
</ResourceDictionary>
</Application.Resources>
I pasted your code into my project and it worked. However, the code you provided above doesn't have Content for the triggering button, so the only button which appears is the top button. Are you sure you're not failing because of code in BackButton_Click rather than TeachingTipButton_OnClick?
You can remove the duplicate reference to Microsoft.UI.Xaml.Controls from Application.Resources
I solved my problem by removing ContentDialog Size style and Default Button style so that <Application.Resources> has only <XamlControlsResources x: Key = "XamlControlsResources" xmlns = "using: Microsoft.UI.Xaml.Controls" /> as a single entry. In my case, multiple entries in <Application.Resources> </Application.Resources> are unfortunately not accepted.

UWP The attachable property 'Resources' was not found in type 'Style'

In ResourceDictionary file I have a style and I try to add few resources to that style. Unfortunately, the member Resources is not recognized or is not accessible. I need keep resources explicitly within a style.
<ResourceDictionary
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:TestProject.Resources">
<Style>
<Style.Resources> <!--Style doesn't like it here-->
Uwp's style seems to doesn't like it. Is there any equivalent or sufficient workaround? Or I am doing something completely wrong.
Style does not have Resources property (see documentation). Controls and visual elements do. If you want to add resources, you can add them either under a control, all on the same level as the Style element:
<ResourceDictionary
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:TestProject.Resources">
<SolidColorBrush x:Key="MyBrush" ... />
<Style>
<!-- use MyBrush in this style -->
If you define resources on the same level as the Style they will be unfortunately available globally, but that is similar how the default UWP styles are defined in the default XAML resource dictionaries (generic.xaml).

Xamarin.Forms Xaml background Image

I just started a Xamarin.Forms application and I want to add a background image to my XAML.
I added the attribute but it does not appear when I run it!!
Here is the images.
APP
public class App : Application
{
public App()
{
// The root page of your application
MainPage = new Page();
}
XAML:
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="App1.Page"
BackgroundImage="bg.png">
SO, how do I fix it?
Add your bg.png file in each of your native projects, since you are currently using a Android emulator start with your Xamarin.Android project:
Android - Place images in the Resources/drawable directory with Build Action: AndroidResource
ref: https://developer.xamarin.com/guides/xamarin-forms/working-with/images/
Example: In your Xamarin.Android project, add bg.png as shown:
Check the Build Action of that image and ensure that it is assigned AndroidResource. Rebuild and re-test.
In Xamarin.forms
The images should be placed in the following folders
iOS, Android - Resources folder
Windows/UWP, Windows Phone - Assets folder
Then the build action(rt click img->properties) of the images should be changed as follows
iOS - BundleResource Windows Phone - Content
Android - AndroidResource Windows/UWP - Content
If Still the image is not displayed, try changing the Copy to Output Directory to Copy if newer in image Properties
If you want to add background image in XAML file for the entire page in Xamarin project, then use the BackgroundImage property and add your image to the Android project under Resources -> drawable folder and for iOS Resources folder.
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:local="clr-namespace:PhoneDailerDemo"
x:Class="PhoneDailerDemo.MainPage"
BackgroundImage="image3.jpg">
<Label Text="Welcome to Xamarin Forms!"
VerticalOptions="Center"
HorizontalOptions="Center" />
<StackLayout Padding="100">
//..........
</StackLayout>
</ContentPage>
Reducing the size of the image worked for me.
Another way (source) you can achieve this, is by setting the image's build action (in file properties) as Embedded Resource.
Then, using a converter markup-extension you will be able to use it directly in XAML and won't have to copy or link the files in each platform specific project.
Here's the converter you should add to you portable project:
[ContentProperty(nameof(Source))]
public class ImageResourceExtension : IMarkupExtension
{
static readonly Assembly CurrentAssembly =
typeof(ImageResourceExtension).GetType().Assembly;
public const string Assets = nameof(Assets);
public string Source { get; set; }
public object ProvideValue(IServiceProvider serviceProvider)
{
if (string.IsNullOrWhiteSpace(Source))
return null;
// Do your translation lookup here, using whatever method you require
var source = $"{CurrentAssembly.GetName().Name}.{Assets}.{Source}";
var imageSource = ImageSource.FromResource(source, CurrentAssembly);
return imageSource;
}
}
Then in your 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:WorkingWithImages;assembly=WorkingWithImages"
x:Class="WorkingWithImages.EmbeddedImagesXaml">
<Image Source="{local:ImageResource Background.jpg}"}
</ContentPage>
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 (ie. only lowercase letters, numerals, the underscore, and the period are allowed).
iOS - Place images in the Resources folder with Build Action: BundleResource . Retina versions of the image should also be supplied - two and three times the resolution with a #2x or #3x suffixes on the filename before the file extension (eg. myimage#2x.png).
Android - 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 ).
Windows Phone - Place images in the application's root directory with Build Action: Content .
Windows/UWP - Place images in the application's root directory with Build Action: Content .
You can read more at Working with Images
Loading and displaying images in Xamarin.Forms

Are you not able to have resources in App.xaml if you merge in resource dictionaries?

We have 4 global resources attached in app xaml that are classes we use in our application to maintain state for various items.
Here is how we have them in app.xaml
<Application.Resources>
<AMSI:Global x:Key="AMSI.Global"/>
<eFin:Global x:Key="eFinancials.Global" />
<eService:Global x:Key="eService.Global" />
<eSite:Global x:Key="eSite.Global" />
... a bunch of styles and control templates here...
</Application.Resources>
After reading chapter 23 I decided I was going to clean some stuff up and create few resource dictionaries.
So, I used blend and created two resource dictionaries and moved all the styles to them. Blend modifyied my xaml to the following:
<Application.Resources>
<ResourceDictionary>
<AMSI:Global x:Key="AMSI.Global"/>
<eFin:Global x:Key="eFinancials.Global" />
<eService:Global x:Key="eService.Global" />
<eSite:Global x:Key="eSite.Global" />
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="Resources/ControlStyles.xaml"/>
<ResourceDictionary Source="Resources/DefaultColors.xaml"/>
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Application.Resources>
Ok... great. I was happy. Until I tried to run the app and got an initialization error. Apparently it happens in the constructor of one of the above global objects where we have this code:
var amsiGlobal = Application.Current.Resources["AMSI.Global"] as AMSI.Global;
amsiGlobal.PropertyChanged += new
System.ComponentModel.PropertyChangedEventHandler(amsiGlobal_PropertyChanged);
It was no longer getting a reference to the AMSI.Global object... but it had been working fine before the move.
What am I doing wrong. If I move those global objects outside or the resource dictionaries the code runs again but blend tells me there is an error in the xaml, it also doesn't find the dictionaries when I try to create new control templates. Also, if I create control templates they don't seem to be found, even if they are on the same page as the control referencing it. So, I assume at runtime there will be an issue to.
Any ideas what is going on here? Do I just need to move all my styles and templates back to app.xaml?
I'm a bit new at silverlight, but, have you tried adding
<AMSI:Global x:Key="AMSI.Global"/>
<eFin:Global x:Key="eFinancials.Global" />
<eService:Global x:Key="eService.Global" />
<eSite:Global x:Key="eSite.Global" />
to the Merged Dictionaries?
it would look something like this
<Application.Resources>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary>
<AMSI:Global x:Key="AMSI.Global"/>
<eFin:Global x:Key="eFinancials.Global" />
<eService:Global x:Key="eService.Global" />
<eSite:Global x:Key="eSite.Global" />
</ResourceDictionary>
<ResourceDictionary Source="Resources/ControlStyles.xaml"/>
<ResourceDictionary Source="Resources/DefaultColors.xaml"/>
</ResourceDictionary.MergedDictionaries>
I normally just add my resources in the merged dictionaies and never had a problem
Regards