Universal Windows Platform Support

[robertmuehsig]

Even if the project is named and targets WPF - are you planning to support UWP projects as well?

When I try to install the package it fails: FontAwesome.WPF 4.5.0.7 is not compatible with UAP,Version=v10.0. Some packages are not compatible with UAP,Version=v10.0.

Maybe the code could "just work" on UWP and just the NuGet Package needs some updated targets.

[charri]

The apis for UWP and WPF are very similar. I'll give it a go tonight and see how much work would be involved.

[robertmuehsig]

:+1: If you need help or currently don't have time let me know, so I could take a look.

[charri]

Hmmm TextBlock/Image is sealed in UWP, so won't be that straightforward... grr...

[robertmuehsig]

UWP itself seems to use "SymbolIcon", e.g.

<SymbolIcon Width="48" Height="48" Symbol="Home" />

Is this useful?

[robertmuehsig]

Ok, found a way via the FontIcon class. This is more or less the most simple solution for UWP:

public class FontAwesome : FontIcon
    {
        public FontAwesome()
        {
            this.FontFamily = new FontFamily("./fontawesome.otf#FontAwesome");
        }

        private FontAwesomeIcon _icon;
        public FontAwesomeIcon Icon
        {
            get { return _icon; }
            set
            {
                _icon = value;
                Glyph = char.ConvertFromUtf32((int)_icon);
            }
        }
    }

In XAML: The first one is the pure FontIcon class in action. The FontAwesome class is just a converter for the Glyph.

    <FontIcon FontFamily="./fontawesome.otf#FontAwesome" Glyph="&#xf0b2;"></FontIcon>
    <local:FontAwesome Icon="Android" />
    <local:FontAwesome Icon="Leaf" FontSize="50" Foreground="Aqua" />

Result:

I created a small demo in my fork: https://github.com/robertmuehsig/Font-Awesome-WPF/tree/master/src/FontAwesome.UWP.Demo

For the first release this would work - it's pretty basic, but it has an easy integration via your FontAwesomeIcon enum.

I guess it would be clever to release a new NuGet package, just targeting UWP.

What do you think?

[TrabacchinLuigi]

Same nuget package different framework folder ? maybe ? UWP isn't part of .net core ?

[robertmuehsig]

UWP uses .NET Core, but has a complete new UI/Xaml Stack. WPF don't uses .NET Core.

The FontAwesome Class in the current FontAwesome.WPF package uses the TextBlock class from WPF, but in the UWP world this is not possible. I would recommand a new package because the naming is missleading - UWP has not much in common with WPF and the whole implementation is different.

Another idea: We create a new package "FontAwesome.Xaml", which contains the different implementations for WPF and UWP. This would solve the "naming" issue, but the implementation would still be different.

Both packages (or both implementations) would share the same FontAwesomeIcon-Enum and the embedded font.

[charri]

Maybe I should also rename the package to *.Core to keep up with the trend :p. Pun aside, I think it would be best to create two packages (FontAwesome.WPF, FontAwesome.UWP) - for naming sake but include all the targets. If the codebase drifts further apart for the targets it might make sense to 'hard fork' the UWP.. But we're not at tht stage yet.

I'll review the code at the weekend and might ask a friend who has more knowledge of UWP than me to have a review.

Thanks for the code contribution!

[robertmuehsig]

+1 for .Core ;)

Glad I could help.

[charri]

@robertmuehsig had a go at your code - works fine if font is in the same project, but can't find the proper format to package the font file in a class library. There also does not seem to be any doc on how to load fonts from a class library in UWP.

[robertmuehsig]

Ah, ok. Will try to take a look this week. UWP is a miracle sometimes...

[robertmuehsig]

Mh, tried it and had no issues, or do I miss something?

Code here: https://github.com/robertmuehsig/Font-Awesome-WPF

[charri]

how did you specify the FontFamily? (Uri) I am able to create the control - but it just shows a box when run, as if the font was unable to load

[robertmuehsig]

In the Library: Added the FontAwesome.otf file with Build Action "Resource"

In the FontAwesome class:

this.FontFamily = new FontFamily("./fontawesome.otf#FontAwesome");

[charri]

so i've been going over your project and comparing it to mine and I just can't get my head around what would cause my project not to work. I downloaded your fork but also got the same results (just character square). It only works if the font file is in the same project.

Going to see how to load from an embedded resource

[robertmuehsig]

Mhhh... tried it again on my workmachine with the same result you saw. I will take a look why it worked on my notebook without any issues.

[Alex-Witkowski]

Hi There, left a pull request on roberts Demo.

What works for me is to set FontAwesome as Contet. So it is part of the AppX Bundle created for UWP apps.

After that I referenced the file inside the package in the code for the converter.

Should also work on your side.

@robertmuehsig I think it works on your private dev machine because you have added/installed FontAwesome as systemfont. Thats a little pitfall.

[robertmuehsig]

I checked @Alex-Witkowski PR and it now seems to work on my work machine. The link to the PR: "https://github.com/robertmuehsig/Font-Awesome-WPF/pull/1"

@Alex-Witkowski So, the path "ms-appx:///FontAwesome.UWP.Lib" is the assembly name of the library, right?

[Alex-Witkowski]

@robertmuehsig The ms-appx:/// part says something should be load from the appX package (or at least from the folder on your disk wich contains the stuff of the package).

And the contetns form FontAwesome.UWP.Lib are stored in an folder named like the assembly inside the package. There comes the "FontAwesome.UWP.Lib/" from. You can see the structure of the Appx in your Debug folder.

[charri]

Cool stuff :+1: I'll try it out tonight. Hopefully release by end of week

[dotnetnoobie]

@robertmuehsig I used your demo project but updated it to use a DependencyProperty so I could DataBind the Icon and Update it from a ViewModel

    public class FontAwesome : FontIcon
    {
        public static readonly DependencyProperty IconProperty
            = DependencyProperty.Register("Icon", typeof(FontAwesomeIcon), typeof(FontAwesome), new PropertyMetadata(FontAwesomeIcon.None, IconPropertyChangedCallback));

        public FontAwesomeIcon Icon
        {
            get { return (FontAwesomeIcon)GetValue(IconProperty); }
            set { SetValue(IconProperty, value); }
        }

        private static void IconPropertyChangedCallback(DependencyObject d, DependencyPropertyChangedEventArgs e)
        {
            var ctrl = (FontAwesome)d;
            ctrl.Glyph = char.ConvertFromUtf32((int)e.NewValue);
        }

        public FontAwesome()
        {
            FontFamily = new FontFamily("ms-appx:///FontAwesome.UWP.Lib/fontawesome.otf#FontAwesome");
        }
    }

[Alex-Witkowski]

This could cause a crash when IconPropertyChangedCallback is called with e.NewValue = null which I think is possible when you use it in a custom control and xaml parser calls this before "OnApplyTemplate" where any value might be set. Will have a look at it before Monday.

[robertmuehsig]

@charri Any updates? If you need any help just let me know.

[charri]

@robertmuehsig nearly there. demo project is done. just have to update the documentation and then publish the nugets!

[robertmuehsig]

<3

[charri]

http://www.nuget.org/packages/FontAwesome.UWP/ http://www.nuget.org/packages/FontAwesome.WPF/

Tested and works. Strange thing, when the project is referenced as source the designer shows the font, if referenced as nuget package it just shows a square (works in running app though).

[dygestor]

Thank you very much, it works flawlessly :) Just today I started developing an app and I was wondering, if anyone managed to get fontawesome working on UWP. Great job!

[robertmuehsig]

:+1: I don't have the designer issue you described - works as expected. But UWP and the VS designer are sometimes weird ;). Awesome job!

I would say - we can close this issue.