如何在不更改文本字体的情况下使用 FontAwesome 图标

Question

我在按钮和标签中放置了图标，但这是结果：

显示了图标，但它更改了文本。如何在不更改文本的情况下显示图标？

<Button x:Name="btnItems" Text="&#xf022; Load Items" FontFamily="{StaticResource FontAwesomeSolid}" />

Answer 1

我认为最简单的方法是改用按钮图片。下载图标并将其添加到 iOS 中的 Resources 文件夹和 Android 中的 Drawable。

然后像这样在您的按钮中使用它：

<Button Text="Edit" ImageSource="edit_icon" />

顺便说一句，您需要将按钮的字体更改为其他字体或保留默认字体。

Answer 2

我能想到的一个解决方法是将图标和文本分开：

<StackLayout Orientation="Horizontal" HorizontalOptions="CenterAndExpand" BackgroundColor="Purple">

    <Button Text="&#xf0e2;" FontFamily="FontAwesome" TextColor="White" WidthRequest="25" HorizontalOptions="Center"
           VerticalOptions="Center" />

    <Label Text="Load Items" TextColor="White" WidthRequest="90"
           HorizontalOptions="Center"
           VerticalOptions="Center" />

</StackLayout>

Answer 3

Button 可以有 Text 和一个 ImageSource 与 FontImageSource:

ContentLayout 设置图像相对于文本的位置和间距，默认值如下所示 XAML.

可能的位置值为 Left、Right、Top、Bottom。

位置值 Left 或 Right 文本垂直居中。

位置值 Top 或 Bottom 文本水平居中。

  <Button Text="fa-list" ContentLayout="Left, 10">
    <Button.ImageSource>
      <FontImageSource Glyph="&#xf022;" FontFamily="{StaticResource FaRegular4}"/>
    </Button.ImageSource>
  </Button>

Label可以有一个或多个Span:

    <Label>
      <Label.FormattedText>
        <FormattedString>
          <Span Text="f0A4 " />
          <Span Text="&#xf0A4;" FontFamily="{StaticResource FaRegular4}" />
          <Span Text=" f0A5 " />
          <Span Text="&#xf0A5;" FontFamily="{StaticResource FaRegular4}" />
        </FormattedString>
      </Label.FormattedText>
    </Label>

如何在不更改文本字体的情况下使用 FontAwesome 图标

How to Use FontAwesome Icon without Changing Text Font

c#

user-interface

xamarin

font-awesome