Кнопка стека расположена вертикально внутри кнопки

Question

Следующий код создает кнопку в nativescript, содержащую значок, за которым следует текст. Мне бы хотелось, чтобы кнопка укладывала два диапазона так, чтобы значок располагался по центру по горизонтали в верхнем ряду кнопки, а текст располагался по центру под значком.

<Button>
  <FormattedString>
    <Span fontFamily="IcoMoon-Free" text="{{userPlusIcon}}"></Span>
    <Span text="Create New Account"></Span>
  </FormattedString>
</Button>

Мне бы хотелось, чтобы результат выглядел примерно как кнопка сведений о человеке на следующем изображении:

Я пытался использовать StackLayout, но вы не можете вложить его в кнопку. Также я прочитал в другом стеке, что вы не можете присоединить класс css к диапазону Nativescript. Я иду по этому неправильному пути? Может быть, я должен вместо этого использовать StackLayout с вложенными метками и поместить событие (нажатие) в стек, чтобы оно действовало как кнопка?

Answer 1

Я добился этого пользовательского интерфейса, используя метку вместо кнопки, а также используя иконку font-awesome с текстом. Вот код:

<Label row="1" col="0"i[![d="home" text="&#xf015;" (tap)="onChange(0)">
    </Label>