In this section, we will take a look at how to update the user interface for our WalkTrailInfoPage to apply PlatformEffects and utilize our LabelShadowEffect in our XAML, so that our control elements will take on our custom effect based on the platform that is being run.

Let's start by updating the user interface for our WalkTrailInfoPage by performing the following steps:

1. Locate and open the WalkTrailInfoPage.xaml file, which is located in the Views folder, ensure that it is displayed in the code editor, and enter the following highlighted code sections:

   <?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:customEffect="clr-namespace:TrackMyWalks.CustomEffects"
                x:Class="TrackMyWalks.Views.WalkTrailInfoPage">
          <ScrollView>
               <StackLayout.Padding>
                   <OnPlatform x:TypeArguments="Thickness">
                       <On Platform="Android, WinPhone" 
                           Value="2,0" />
                       <On Platform="iOS" 
                           Value="2,0" />
                   </OnPlatform>
               </StackLayout.Padding>
               <StackLayout Orientation="Vertical" HorizontalOptions="FillAndExpand">
                   <Image x:Name="TrailImage" Aspect="AspectFill" 
                          Source="{Binding ImageUrl}" HorizontalOptions="FillAndExpand" 
                          VerticalOptions="FillAndExpand" />
                   <Label x:Name="TrailName" Text="{Binding Title}" 
                          Style="{DynamicResource labelTrailName}">
                         <Label.Effects>
                           <customEffect:LabelShadowEffect />
                         </Label.Effects>
                   </Label>
                   ...
                   ...
                   ...
                   <Button x:Name="BeginTrailWalk" Text="Begin this Trail" 
                           Clicked="BeginTrailWalk_Clicked" Margin="20" 
                           Style="{StaticResource buttonStyle}">
                   </Button>
               </StackLayout>
          </ScrollView>
   </ContentPage>

Let's now take a look at what we covered in the preceding code snippet:

1. We started by creating a xmlns:customEffect, a reference to our CustomEffects namespace, so that we can access the PlatformEffect in our XAML that we have defined in our namespace
2. We added the Label.Effects attribute to our Label attribute for our TrailName, and then referenced the customEffect assembly namespace so that we can access the platform-specific LabelShadowEffect to use