Font-awesome: iOS/Xamarin font => Changing words, ONLY on OTF (disable ligatures)

[XamtasticPenn]

Describe the bug
OTF font is replace _words_ in my buttons....

• "Notifications" == "Notifi[ cat icon ]ions"
• "Add" == "[ ad icon ]d"
• "Device Paring" == "Device Pa[ ring icon ]"

TTF works as expected, however the "g" and "y" get cut off.
This is what the TTF files do (https://github.com/Vaberer/Font-Awesome-Swift/issues/20) however it is NOT RESOLVED. Their fix does not work.

To Reproduce
Apply font to any project

Expected behavior
I would expect the UNICODE to work, but be able to type words

Version and implementation
Version: Font Awesome 5 (900)

Or

....if this is the way it is supposed to work, is there a way I can export Font Awesome without to apply "-xx" after the name, like do "bell-xx","phone-xx" so I can use it like TTF???

[tagliala]

Hi!

Thanks for being part of the Font Awesome Community.

You can just use the ttf file, but I have another question: I guess it happens because your application is using Font Awesome as a regular font, while it should only be used for icons. Is it possible to change your applicaiton approach?

[XamtasticPenn]

The TTF has letters cut off [_g, j, q, y, p_] at the bottom. Again OTF works, but changes words into icons, not just unicode. Any idea how to compile FA with "[faname]-xxx" as OTF??? That solves the problem!!!

I understand the idea it "should" be used for icons, but this approach is WAY BETTER and I could use it for Labels, Entries, and everywhere else.

Situation -- A
Current:

<Button Text="Log In  &#xf061;" Command="{Binding LogInCommand}" />

///....that was easy 👍 

Situation -- B
Custom Control
More coding is needed,
Works for Buttons only; only 1 icon and no Labels, Entries, etc. 👎

• _Step 1. Controller_

<Grid>
        <Grid.ColumnDefinition>
                <ColumnDefinition width="*" />
                <ColumnDefinition width="*" />
        </Grid.ColumnDefinition>
        <Label grid.column=0 Text="{Binding Text}"  />
        <Label grid.column=1 Text="{Binding Icon}"  />
        <Button Command="{Binding EventCommand}"  />
</Grid>

• _Step 2. Create Model_

public class FontAwesomeButtonModel
{
        public string Text { get; set; }
        public string Icon{ get; set; }
        public Command EventCommand { get; set; }
}

• _Step 3. Bind Model to View Model [ dependent on # of buttons on view ]_

public class MyViewModel {

        FontAwesomeButtonModel _loginButton;
        public FontAwesomeButtonModel LoginButton
        {
                get => _loginButton;
                set => SetProperty(ref _loginButton, value);
        }

        FontAwesomeButtonModel _backButton;
        public FontAwesomeButtonModel BackButton
        {
                get => _backButton;
                set => SetProperty(ref _backButton, value);
        }

        public MyViewModel()
        {
                LoginButton = new FontAwesomeButtonModel()
                                        {
                                                ...work work work
                                        };

                BackButton= new FontAwesomeButtonModel()
                                        {
                                                ...work work work
                                        };
        }

-_Step 4. Add to View [ dependent on # of buttons on view ]_

<ContentPage ..... xmlns:Fa="clr-namespace:myApp.Controls">
<Fa:FontAwesomeButton ... { Bindings } ...>
</ContentPage>

[DONE ~~ repeating steps 3 and 4]

[tagliala]

Hi,

I understand the idea it "should" be used for icons, but this approach is WAY BETTER and I could use it for Labels, Entries, and everywhere else.

I understand that if you use Font Awesome as a font you can save some markup, but it is a workaround. I understand that ligatures are breaking your use case, but they are a feature of our OTF font.

I think that this is a general question, like "how I can disable ligatures in an .otf file?" and you probably need an .otf editor to remove that feature.

Maybe this can help you: https://stackoverflow.com/questions/43315957/how-to-remove-ligatures-from-a-font-using-fontforge

[XamtasticPenn]

Smile! ...because you're my new favorite person!!!!

Thanks, that did the trick

[tagliala]

You're welcome, glad it helped 👍

[pluk-css]

I am using Font Awesome with Xamarin, and I updated Font Awesome to Version 5.12.0. I noticed that the following still happen (bottom text cutoff):

The TTF has letters cut off [_g, j, q, y, p_] at the bottom. Again OTF works, but changes words into icons, not just unicode. Any idea how to compile FA with "[faname]-xxx" as OTF??? That solves the problem!!!

[XamtasticPenn]

Is that with the OTF file?

OTF doesn't have the letters cut off, but missing icons in iOS and Android....UWP is good

Here's a script
XAML VIEW

    <ContentPage.Content>
        <StackLayout>
            <Label x:Name="IconTotal" />
            <ScrollView>
                <StackLayout x:Name="IconTester"></StackLayout>
            </ScrollView>
        </StackLayout>

    </ContentPage.Content>

C# BACK END

public TestIcons ()
{
    InitializeComponent ();

    int counter = 0, total = 0;
    StackLayout stack = new StackLayout() { Orientation = StackOrientation.Horizontal, Margin = 10 };
    var fields = typeof(Icons).GetFields();
    foreach (var x in fields)
    {
        var button = new Button() { Text = x.GetValue(null).ToString(), WidthRequest = 40, FontSize=20 };
        var label = new Label() { Text = x.Name, WidthRequest=160 };
        stack.Children.Add(button);
        stack.Children.Add(label);

        if(x.Name[0] != '_') total++;
        counter++;
        if (counter == 5)
        {
            IconTester.Children.Add(stack);
            stack = new StackLayout() { Orientation = StackOrientation.Horizontal, Margin = 10 };
            counter = 0;
        }
    }

    IconTotal.Text = "Total: " + total.ToString();
}

_I know I didn't need the view and could have done in all code, but oh well._ :)

[pluk-css]

I tried both TTF and OTF, but both got the same text cutoff problem when I included icon(s) in buttons

[XamtasticPenn]

I'm on version 4.7.0 2016

OTF works, but if your button or text is "Student Locker" it will change to "Student [_LOCK ICON_]er".

To resolve this -- I had to clean out the ligatures with FontForge (free), kind of tricky. There is a MENU item that looks like the letter edit. When you go through the MENU the same screen will give you an option to remove it. It's like a check box or something