CODEWITHSUNDEEP
xamarinxamarin.forms
Johan
Johan

Reputation: 117

How to add a click handler to content page in xamarin forms

I am new at Xamarin.Forms and are trying to add a click event to my content page. I want an event to start when the user clicks on the page, no matter where.

I've created similar functionality in a WinPhone app, where I could solve my problem with OnLeftMouseButtonDown which was available on PhoneApplicationPage, but I could not find a suitable counterpart in the ContentPage. Any suggestions?

Upvotes: 3

Views: 9358

Answers (1)

Pete
Pete

Reputation: 4746

In order to get this working you have to add a Layout to the ContentPage, as you will want to specify some content, and set the HorizontalOptions and VerticalOptions to LayoutOptions.FillAndExpand.

This is not enough though to handle the taps correctly though.

You also need to specify a BackgroundColor for the Layout. I set mine to Color.Transparent. If you try without specifying a Color it does not work.

You then have to attach a TapGestureRecognizer to the ContentPage in order to catch the clicks that are made.

Although this works well with Labels and Buttons in my test below, still receiving the TapGestures for WindowsPhone on both types, along with the Button click event firing - this does not fully work with Android - as the Button click will prevent the TapGesture event from firing.

The other alternative is to try putting an 'invisible' Grid over the top of everything. However the issue with this approach is that you will loose the Click event handler from firing with WindowsPhone and also loose the Click event handler from firing with Android. The good part though - is that you can detect a click anywhere, although not pass this on. It just depends what your trying to achieve at the end of the day.

StackLayout objStackLayout = new StackLayout()
{
    Orientation = StackOrientation.Horizontal,
    HorizontalOptions = LayoutOptions.FillAndExpand,
    VerticalOptions = LayoutOptions.FillAndExpand,
    BackgroundColor = Color.Transparent
};
//
Label objLabel1 = new Label();
objLabel1.BackgroundColor = Color.Red;
objLabel1.Text = "label1";
objLabel1.HorizontalOptions = LayoutOptions.Start;
objLabel1.VerticalOptions = LayoutOptions.Start;
objLabel1.WidthRequest = 100;
objLabel1.HeightRequest = 300;
objStackLayout.Children.Add(objLabel1);
//
Label objLabel2 = new Label();
objLabel2.BackgroundColor = Color.Green;
objLabel2.Text = "label2";
objLabel2.Font = Font.OfSize("Arial", 48);
objLabel2.WidthRequest = 100;
objLabel2.HeightRequest = 300;
objStackLayout.Children.Add(objLabel2);
//
Button objButton1 = new Button();
objButton1.Text = "Click Me";
objButton1.WidthRequest = 300;
objButton1.HeightRequest = 300;
objStackLayout.Children.Add(objButton1);
//
this.Content = objStackLayout;


TapGestureRecognizer objTapGestureRecognizer1 = new TapGestureRecognizer();
objTapGestureRecognizer1.Tapped += ((o2, e2) =>
    {
        System.Diagnostics.Debug.WriteLine("Clicked!");
    });

this.Content.GestureRecognizers.Add(objTapGestureRecognizer1);

Upvotes: 5

Related Questions