how to create degrees symbol in XAML - xaml

Is there a simple way to display a degrees symbol (as in Fahrenheit) in XAML? Ive been able to find solutions in HTML, Android and iPhone but nothing in xaml.

You can use the same code/number used in HTML
This shows Shows "55º"
<TextBlock Text="55º"/>

Is this: " ° " the symbol you're looking for? I recommend just copying/pasting it into your XAML code and it should display properly.

The correct HTML code is 176, according to this link. The code 186 is masculine ordinal indicator. So the correct answer would be
<TextBlock Text="°F"/>
This will show "°F".

Related

How to specify control's property according to platform in xaml code?

Suppose I have a TextBlock, on PC, I want it text is "PC", and on Xbox, it shows "XBox".
So how to distinguish platform in xaml code, not in C# code.
The reason I have to do this is because there is some controls defined in styles, I want them differs between platforms.
Thanks.
In WindowsCommunityToolkit, this extension that meet your requirements: OnDevice Markup Extension.
Use like this:
<TextBlock Text="{helpers:OnDevice Default=Hi, Desktop=Hello, Xbox=World}"
xmlns:helpers="using:Microsoft.Toolkit.Uwp.UI.Extensions.Markup"/>
In addition, in WindowsCommunityToolkit, there is SystemInformation.DeviceFamily to help you determine the current device type.
Best regards.

UWP Strikethrough

I'd like to use strikethrough in a UWP app. For example: '10% off £100 £90.' The advice seems to be to use TextDecorations, which in 2012 was still not available (link). Please can you tell me if it's possible to use strikethrough in a TextBlock now?
According to the offical documentation, strikethrough is an available TextDecoration.
An XAML-Example:
<!-- Use the default font values for the strikethrough text decoration. -->
<TextBlock
TextDecorations="Strikethrough"
FontSize="36" >
The quick red fox
</TextBlock>
I tested the example by myself in an UWP-Application and had no problems.
How Rob mentioned:
It is available since v10.0.15063.0.

How to convert SVG file to XAML in windows 8 / WinRT

How i can convert SVG file to XAML in windows 8 / WinRT. I am new to this XAML / SVG environment. So anyone please help me to implement the same in windows 8. I need to parse this svg file and need to display the content in the page through code.
For me the simplest way to do it is the following:
Open your .svg file in free vector drawing tool Inkscape
Save as "Microsoft XAML (*.xaml)"
Also you may need to update the result output file a bit after conversion, since not all XAML processing engines support converting a string to Figures (as described in the accepted answer to Why does this Xaml Path crash silverlight?). So, for example, if you have this:
<Path Fill="#FFEDEDED" StrokeThickness="1" Stroke="#FFA3A3A3" Opacity="0.7"
VerticalAlignment="Center" HorizontalAlignment="Center" >
<Path.Data>
<PathGeometry Figures="m 1 2 l 4.0525 5.2361 l 4.0527 -5.2361 z "/>
</Path.Data>
</Path>
then you will need to change it to this:
<Path Fill="#FFEDEDED" StrokeThickness="1" Stroke="#FFA3A3A3" Opacity="0.7"
VerticalAlignment="Center" HorizontalAlignment="Center"
Data="m 1 2 l 4.0525 5.2361 l 4.0527 -5.2361 z" />
- OR -
You could use a bit different way to export the xaml from Inkscape, described by Tim Heuer in accepted answer to the question Convert SVG to XAML, because both ways produce different xaml output:
Method (yes, superhack):
Use Inkscape to save as PDF
Rename the Filename extension from PDF to AI
Use Expression Design to open AI document
Export to Silverlight Canvas
UPDATE (2015-08-25)
I've found my self using the second ("hack") way more and more often rather then first (more straightforward) one, because it creates more "expectable" XAML as I would call it.
I cheated and converted my SVG to a font. First, I created the SVG, then using IcoMoon created the font. https://icomoon.io/app/#/select.
I downloaded the font's ttf into my assets folder with content.
Next I add the code. Notice the font filename, then #, then the name of the font. The text should be
<TextBlock Text="" FontFamily="/Assets/icomoon.ttf#icomoon" FontSize="45"</TextBlock>
Please take a look at this article:
Transforming SVG graphics to XAML Metro Icons
You can find here a way to convert via transforming to XPS.
You can use also an Svg2Xaml converter.
There is a free converter available in the Microsoft Store (as standalone Windows application). It is called SVG to UWP XAML Converter.
It worked without any problems converting my multi-color SVGs correctly as batch to XAML, which I added to Visual Studio within a WPF User Control (for a preview you need to select the SVG file manually)

XAML Path Syntax

I'm trying to create what I believe is a basic shape using XAML. Essentially, I need to create something that looks like the following:
______________^______________
| |
| Some static text will be |
| placed here in the bubble |
|____________________________|
Currently, I have the following:
<Canvas x:Name="myCanvas">
<Path Stroke="#2D2D2D" Fill="#2D2D2D"></Path>
<TextBlock Text="Some static text will be placed here in the bubble." TextWrapping="Wrap" />
</Canvas>
Obviously, the Data portion of the Path element is missing. However, I can't figure out that syntax. It seems so weird. All I want is a rectangle that has a triangle in the middle of the top border. This makes it looks like a chat bubble. Can someone explain how I can do this? Thank you!
For the sake of you learning something, as opposed to just being given a solution. This is along the lines of what you're looking for;
<Path Data="M125.11371,0.5 L141.0695,20.500002 L249.5,20.500002 L249.5,
119.5 L0.5,119.5 L0.5,20.500002 L108.9748,20.500002 z"
Fill="#FF2D2D2D" Stretch="Fill" Stroke="#FF2D2D2D"
UseLayoutRounding="False" Width="250" Height="100"/>
They way I did this was in Expression Blend, I first drew a Rectangle and then using the Pen tool I drew a Triangle and positioned in the top center of the previous Rectangle
I then selected both objects and from the top menu selected Object -> Combine -> Unite which produced this final result.
If you're better with a more Vector oriented program like Adobe Illustrator, there's a XAML Exporter by Mike Swanson that comes in handy quite often, especially for more complicated XAML designs than this.
Your design is one of the easiest you could likely come up with so you can't wonder why nobody will generally want to just answer it blatantly. However I was in your situation before so it's provided, but hopefully something was also learned you can apply when this type of situation pops up again.
Hope this helps and best of luck.
You can read about paths here
There are two ways to create a path:
Using figures (Lines, Polylines, ...)
Using the Mini language

Theme-aware XAML resources in a WP7 project

I'm making a Windows Phone 7 application and I'm a bit confused with dark/light themes.
With a panorama, you very often set a background image. The issue is it's very hard to make a picture which is right for both dark and light themes. How are we supposed to proceed?
Is there a way to force a dark/light theme for a panorama? This will avoid making theme-specific panorama background pictures. Then how do I do? I found xaml files in C:\Program Files (x86)\Microsoft SDKs\Windows Phone\v7.0\Design. If this is a right way to proceed, how can I import them for my panorama?
Or if there's no way (or if it's wrong) to force a dark/light theme: how to write conditional XAML to set correct resources? Now I have the following XAML (default.xaml) which is fine with the dark theme:
<ImageBrush x:Key="PageBackground" ImageSource="Resources/PageBackground.png" Stretch="None" />
<ImageBrush x:Key="PanoramaBackground" ImageSource="Resources/PanoramaBackground.png" Stretch="None" />
But when I use a light theme, black controls and black texts are hard to read with my dark background pictures. So I made different pictures that I can use this way:
<ImageBrush x:Key="PageBackground" ImageSource="Resources/PageBackgroundLight.png" Stretch="None" />
<ImageBrush x:Key="PanoramaBackground" ImageSource="Resources/PanoramaBackgroundLight.png" Stretch="None" />
Now my issue is to make XAML conditional to declare the right thing depending on the current theme.
I found no relevant way on the Internet. I would prefer not to use code or code-behind for that because I believe XAML is able to do this (I just don't know how).
EDIT: Code snippet to load a xaml file as ResourceDictionary
string xaml = null;
StreamResourceInfo xamlInfo = Application.GetResourceStream(new Uri("light.xaml", UriKind.Relative));
using (StreamReader sr = new StreamReader(xamlInfo.Stream))
xaml = sr.ReadToEnd();
dic = (ResourceDictionary)XamlReader.Load(xaml);
this.Resources.MergedDictionaries.Add(dic);
To force a dark or white theme you can indeed use the styles defined in the folder you pointed out. Copy and Paste the rules you need to your App.xaml (just PhoneForegroundColor, PhoneBackgroundColor and the related Brushes would be a good start).
It's probably better though to stay "theme-aware" and load a different image for light and dark themes. Here is an article explaining how to do this: http://blog.jayway.com/2010/12/16/theme-aware-panorama-background-in-windows-phone-7/
There is another possibility I've found: You can use the Coding4Fun Toolkit Converter according to these instructions. However, I'm unable to use correctly use them.
Another possibiliy is to use an OpacityMask. But this only works for black/white images :/
Yousef's solution looks interesting. but it takes too much time to load. The image will be changed round about 1s after the app started. I've tested this on a Nokia 820. I've moved the call for setting the DataContext in a Loaded Event, which was called much later. Now the call takes place in the constructor, so the image will be already set when the application displays it. However, it still adds more loading time :( Any suggestions on how to improve this?