Forum Xamarin.Forms

StackLayout - handle click event

Hi all,

I've realized a very simple clickable StackLayout: it's composed by 2 images and a label.

I used TapGestureRecognizer to trigger the tapped event, so I can handle the click of the user on the button.

Here is my question: I would like to customize my StackLayout when the user clicks on it.

I would be able to find a cross platform solution to manage, f.e., the background color of the stackLayout from white to red. And also, if possible, to change the font of the label that is inside the StackLayout.

Does Xamarin Forms provide a simple way to do this?

TY in advance.

Best Answers


  • NMackayNMackay GBInsider, University admin
    edited September 2017


    If your using XAML just give the StackLayout a name and reference the control in the code behind.

    If your using an MVVM approach you can use data triggers and valueconverters to customize your UI based on data changes in the viewmodel.

  • TY for the quick response.

    I think I will use the first approach (I'm using XAML).

    So I give a name to the StackLayout ("myLayout") and I handle the click on it by using TapGestureRecognizer (Tapped="handleMyClick").

    In the code behind

    void handleMyClick(object sender, System.EventArgs e) {
    myLayout.BackgroundColor = WHITE

    but now the BackgroundColor remains white, and this is not what I want.

    I would like that the white color remains only for the time of the click event.

  • NMackayNMackay GBInsider, University admin
    edited September 2017

    Without writing some platform specific code I don't think that event is bubbled up to the cross platform control, there's no OnTapEnded event etc.

    You'd have to write some customer render code or it's probably less grief to just use MrGestures for this.

  • I try to use mrgesture, but I can't find a way to perform what I really need.

    I "simply" want that when I press a StackLayout (or whatever) I can dynamically change some attributes of it.

    And that when I release my finger, the StackLayout returns in its original state.

    It's possible to find a cross platform solution instead of build a customer render?

  • NMackayNMackay GBInsider, University admin

    I'd be seriously surprised if you can't achieve this with Mr Gestures, As I Say, I don't know of any controls that expose the with the Forms cross platform API.


    Otherwise you'll have to investigate platform specific code

  • Ty very much, this will help me to solve the problem!

  • FilipLarssonFilipLarsson SEMember ✭✭

    @MichaelRumpler I was about to purchase the library since it's a fair price of 10€ "The price for one license is EUR 10,00 (+VAT).". However when I get to the MyCommerce-page, the price is 40€. Is something wrong?

  • MichaelRumplerMichaelRumpler ATMember ✭✭✭✭✭

    No. You were a few seconds too late. After 2.5 years at €10,- I just raised it to €40,-.

  • NMackayNMackay GBInsider, University admin

    Still super cheap at 40 euros :smile:

  • karan78karan78 INMember ✭✭
    edited October 2018
    <StackLayout .GestureRecognizers>
    <TapGestureRecognizer Tapped="Button_Clicked"/>
    </StackLayout .GestureRecognizers>
  • You Can Add This in Your Stack Layout and Linked it by tapped when clicked,,

    </StackLayout .GestureRecognizers>

Sign In or Register to comment.