c# - How to make a phone call in Xamarin.Forms by clicking on a label?

Question

Hello I have an app i'm working on in Xamarin.Forms that gets contact info from a web service and then displays that info in labels however I want to make the label that lists the phone number to make a call when clicked. How do I go about doing this?

Heres in my XAML:

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="ReadyMo.ContactInfo">
  <ContentPage.Content>
     <Frame Padding="0,0,0,8" BackgroundColor="#d2d5d7">
            <Frame.Content>
              <Frame Padding="15,15,15,15"   OutlineColor="Gray" BackgroundColor="White">
                <Frame.Content>
        <ScrollView Orientation="Vertical" VerticalOptions="FillAndExpand">
           <StackLayout Padding="20,0,0,0"  Orientation="Horizontal" HorizontalOptions="CenterAndExpand">
            <StackLayout Orientation="Vertical" VerticalOptions="FillAndExpand">
              <Label Text="Emergency Coordinators"  HorizontalOptions="Center" FontFamily="OpenSans-Light"
                                       FontSize="20"
                                       TextColor="#69add1">
              </Label>
              <Label x:Name="CountyName"   HorizontalOptions="Center" FontFamily="OpenSans-Light"
                                   FontSize="16"
                                   TextColor="#69add1">
              </Label>
              <Label x:Name="FirstName" HorizontalOptions="Center">
              </Label>
              <Label x:Name ="LastName" HorizontalOptions="Center">
              </Label>
              <Label x:Name="County" HorizontalOptions="Center">
              </Label>
              <Label x:Name ="Adress" HorizontalOptions="Center">
              </Label>
                <Label x:Name ="City" HorizontalOptions="Center">
              </Label>

//This is the label that displays the phone number!
              <Label x:Name="Number"  HorizontalOptions="Center">
              </Label>           
            </StackLayout>
          </StackLayout>
        </ScrollView>
       </Frame.Content>
      </Frame>
     </Frame.Content>
    </Frame>
  </ContentPage.Content>
</ContentPage>

heres my code behind:

using Newtonsoft.Json;
using ReadyMo.Data;
using System;
using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.Linq;
using System.Net.Http;
using System.Text;
using System.Threading.Tasks;

using Xamarin.Forms;

namespace ReadyMo
{
    public partial class ContactInfo : ContentPage
    {
        private County item;

        public ContactInfo()
        {
            InitializeComponent();
            var contactpagetext = ContactManager.GetContactString(item.id);

        }

        public ContactInfo(County item)
        {
            InitializeComponent();
            this.item = item;

            //var contactpagetext = ContactManager.GetContactString(item.id).Result;
            //Emergency Coordinators Code
            ContactInfoModel TheContactInfo = ContactManager.CurrentContactInfo;
            CountyName.Text = TheContactInfo.name;
            FirstName.Text = TheContactInfo.First_Name;
            LastName.Text = TheContactInfo.Last_Name;
            Adress.Text = TheContactInfo.Address1;
            City.Text = TheContactInfo.Address2;
            Number.Text = TheContactInfo.BusinessPhone;





        }
    }
}

Thanks in advance!

Answer 1

A Label is not interactive, so you need to use a Gesture to make it respond to taps:

var tapGestureRecognizer = new TapGestureRecognizer();
tapGestureRecognizer.Tapped += (s, e) => {
    // handle the tap
};

// attache the gesture to your label
number.GestureRecognizers.Add(tapGestureRecognizer);

to make a phone call, you can either use the built in Device.OpenUri() method with a "tel:1234567890" argument, or use the Messaging plugin:

var phoneDialer = CrossMessaging.Current.PhoneDialer;
if (phoneDialer.CanMakePhoneCall) 
    phoneDialer.MakePhoneCall("+272193343499");