Skip to content

This repository contains sample about how to make sound on tapping an item in Xamarin.Forms ListView (SfListView)

Notifications You must be signed in to change notification settings

SyncfusionExamples/paly-sound-in-item-tap-listview-xamarin

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

7 Commits
 
 
 
 
 
 

Repository files navigation

How to make sound on tapping an item in Xamarin.Forms ListView (SfListView)

Xamarin.Forms SfListView supports to use common API to load audio data from a shared location across UWP, iOS & Android with the help of SimpleAudioPlayer plugin.

You can also refer the following article.

https://www.syncfusion.com/kb/11687/how-to-make-sound-on-tapping-an-item-in-xamarin-forms-listview-sflistview

You can refer the following steps to achieve the requirement.

STEP 1: Install the Xam.Plugin.SimpleAudioPlayer Nuget package in the shared code project.

STEP 2: Place the audio file in the shared code project and set the Build action as follows,

Project Location Build action
Android Assets AndroidAsset
iOS Resources BundleResource
UWP Assets Content

You can also refer to the link below to use custom fonts in Xamarin.Forms. https://devblogs.microsoft.com/xamarin/adding-sound-xamarin-forms-app/

XAML

Bind the TapCommand of the SfListView.

<syncfusion:SfListView x:Name="listView" ItemSize="60" ItemsSource="{Binding ContactsInfo}" TapCommand="{Binding TappedCommand}">
    <syncfusion:SfListView.ItemTemplate >
        <DataTemplate>
            <Grid x:Name="grid">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="70" />
                    <ColumnDefinition Width="*" />
                </Grid.ColumnDefinitions>
                <Image Source="{Binding ContactImage}" VerticalOptions="Center" HorizontalOptions="Center" HeightRequest="50" WidthRequest="50"/>
                <Grid Grid.Column="1" RowSpacing="1" Padding="10,0,0,0" VerticalOptions="Center">
                    <Label LineBreakMode="NoWrap" TextColor="#474747" Text="{Binding ContactName}"/>
                    <Label Grid.Row="1" Grid.Column="0" TextColor="#474747" LineBreakMode="NoWrap" Text="{Binding ContactNumber}"/>
                </Grid>
            </Grid>
        </DataTemplate>
    </syncfusion:SfListView.ItemTemplate>
</syncfusion:SfListView>

C#

In the ViewModel class, loaded the audio file. Play the audio by calling Play method in the command execution method.

public class ContactsViewModel : INotifyPropertyChanged
{
    ISimpleAudioPlayer Player;
    public ObservableCollection<Contacts> ContactsInfo { get; set; }
    public Command TappedCommand { get; set; }

    public ContactsViewModel()
    {
        ContactsInfo = new ObservableCollection<Contacts>();
        TappedCommand = new Command(OnTapped);

        Player = CrossSimpleAudioPlayer.Current;
        Player.Load("TapSound.wav");

        GenerateInfo();
    }

    private void OnTapped()
    {
        Player.Play();
    }
}

About

This repository contains sample about how to make sound on tapping an item in Xamarin.Forms ListView (SfListView)

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Contributors 2

  •  
  •  

Languages