Click event on "FlexLayout" element

Question

Tell me, is it possible to add a click event to the "FlexLayout" element and also add a click animation?

var flexLayout = new FlexLayout {
	AlignContent = FlexAlignContent.Center,
	JustifyContent = FlexJustify.SpaceBetween
};

flexLayout.Children.Add(new Label {
	Padding = new Thickness(15),
	TextColor = Color.FromArgb("#333"),
	HorizontalOptions = LayoutOptions.Start,
	FontSize = 19,
	Text = AppResources.ProfileFieldFirstname
});

flexLayout.Children.Add(new Label {
	Padding = new Thickness(15),
	TextColor = Color.FromArgb("#a5a4a4"),
	HorizontalOptions = LayoutOptions.Fill,
	FontSize = 19, Text = "Molotov"
});

element.Children.Add(flexLayout);

There is a code that adds this element to the page! 2024-10-04_19-04-33

I want to show "DisplayPromptAsync" when clicking on the "FlexLayout" element to change the corresponding value. The problem is that the "FlexLayout" element does not have a click event. And how to deal with this. I thought that a button might work, but it does not have the "Children" property.

Can you tell me if this can be implemented?

Answer 1

Hello,

Label does not contain a Click event. If you need to click a Label to trigger an event, you need to use a tapgesture to implement it.

Please refer to the following code snippet and document.

var label = new Label

{

    Padding = new Thickness(15),

    TextColor = Color.FromArgb("#333"),

    HorizontalOptions = LayoutOptions.Start,

    FontSize = 19,

    Text = "test"

};

TapGestureRecognizer tapGestureRecognizer = new TapGestureRecognizer();

tapGestureRecognizer.Tapped += (s, e) =>

{

    // Handle the tap

};

label.GestureRecognizers.Add(tapGestureRecognizer);

flexLayout.Children.Add(label);

• Recognize a tap gesture.

Best Regards,

Alec Liu.

---

If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.