Xamarin Forms - Definindo um hiperlink em uma Label


 Neste artigo vou mostrar como definir um hiperlink em uma Label de forma bem simples.

A partir da versão 3.2.0 do Xamarin Forms é possível definir um hiperlink em uma Label de forma bem simples.

Nada como um exemplo prático para demonstrar a funcionalidade.

Vamos lá...

Recursos usados:

Criando o projeto e instalando as dependências

Abra o  VS 2017 Community e clique em New Project e a seguir escolha Cross Platform -> Mobile App (Xamarin.Forms) e informe o nome XF_Labelink:

A seguir selecione a Plataforma, eu marquei somente Android, e escolha a estratégia de compartilhamento que será .NET Standard.

Clique no botão OK. (Eu estou criando apenas o projeto Android mas fique a vontade para criar os demais projetos)

Pronto nosso projeto já esta criado. ( Atualmente(12/2018) a versão mais atual estável é a 3.4.0.1)

Definindo o código da MainPage

Agora abra o arquivo MainPage.xaml e inclua as seguintes views usando um layout StackLayout:

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:XF_Labelink"
             x:Class="XF_Labelink.MainPage">
    <StackLayout>
        <Label HorizontalOptions="Center" VerticalOptions="CenterAndExpand">
            <Label.FormattedText>
                <FormattedString>
                    <Span Text="Macoratti .net : " TextColor="Blue" TextDecorations="Underline">
                      <Span.GestureRecognizers>
                      <TapGestureRecognizer Command="{Binding ClickCommand}" 
                                  CommandParameter="http://macoratti.net" />
                      </Span.GestureRecognizers>
                    </Span>
                  <Span Text=" Quase tudo para a plataforma .NET" />
                </FormattedString>
            </Label.FormattedText>
        </Label>
    </StackLayout>
</ContentPage>

Criamos uma Label usando a propriedade FormattedText e spans onde podemos dividir o texto em seções separadas e formatar cada uma delas de forma diferente.

Cabe destacar a propriedade TextDecorations definida como Underline, um recurso disponível apenas a partir da versão 3.2 do Xamarin.

Estamos usando a classe TapGestureRecognizer para reconhecer eventos de click definindo um comando.

A seguir crie uma classe chamada MainPageViewModel que funciona como a sua ViewModel e defina nesta classe a implementação de ClickCommand que usa o método OpenUri() que aciona a URL recebida como parâmetro.

using System.Windows.Input;
using Xamarin.Forms;
namespace XF_Labelink
{
    public class MainPageViewModel
    {
        public ICommand ClickCommand => new Command<string>((url) =>
        {
            Device.OpenUri(new System.Uri(url));
        });
    }
}

Ao final teremo um texto destacado como um link na Label que quando clicado aciona a url correspondente.

Agora abra o arquivo MainPage.xaml.cs e defina o código para criar a instância da sua ViewModel :

using Xamarin.Forms;
namespace XF_Labelink
{
    public partial class MainPage : ContentPage
    {
        public MainPage()
        {
            InitializeComponent();
            this.BindingContext = new MainPageViewModel();
        }
    }
}

Executando o projeto e informando uma url e clicando no botão de comando iremos obter o seguinte resultado:

Pegue o código do projeto compartilhado aqui :  XF_Labelink.zip (sem as referências)

"E disse Jesus: As raposas têm covis, e as aves do céu têm ninhos, mas o Filho do homem não tem onde reclinar a cabeça."
Mateus 8:20

Veja os Destaques e novidades do SUPER DVD Visual Basic (sempre atualizado) : clique e confira !

Quer migrar para o VB .NET ?

Quer aprender C# ??

Quer aprender os conceitos da Programação Orientada a objetos ?

Quer aprender o gerar relatórios com o ReportViewer no VS 2013 ?

Referências:


José Carlos Macoratti