CODEWITHSUNDEEP
c#xamarinxamarin.formstouchbehavior
Shahid Od
Shahid Od

Reputation: 123

How to handle touch event for a FlexLayout in Xamarin

So Im building an app where I should show multiple products, since I want to show more than just one product in one row, i couldn't use a ListView, so I thought about using a FlexLayout as a Bindable-Layout and use the ItemsSource to display my list of products, whiche was a sucess. So I wanted to add a touch event to each of my products shown in the flexlayout, to do so I created a new Behaviour, this is the link for the code I used :

https://gist.github.com/jtaubensee/96a5e49c66a205e36ff32787f1d2114d

that did work and therefor I can use a Command. my problem is that I want to get the product that was clicked, and I can't figure out how to do ? is there anyone who can possibly help me with that ?

Upvotes: 1

Views: 1240

Answers (1)

Lindsay
Lindsay

Reputation: 595

If you are not adverse to xaml, this is how I handle it.

<FlexLayout BindableLayout.ItemsSource="{Binding Abilities}" IsVisible="{Binding HasAbilities}" BindableLayout.ItemTemplate="{DataTemplate attitm:AttachedAbility}"
                    AlignItems="Center" Wrap="Wrap" JustifyContent="Center"/>

and the template implements the touch gesture, and passes the object as the Command Parameter;

<ContentView.Content>
    <StackLayout Padding="20,8" HorizontalOptions="Center">
        <Frame BorderColor="{OnPlatform Android=DarkCyan, UWP=Accent}" Padding="4">
            <Frame.GestureRecognizers>
                <TapGestureRecognizer Command="{Binding DrillIntoCommand}" CommandParameter="{Binding}"/>
            </Frame.GestureRecognizers>
            <StackLayout HorizontalOptions="Center" Orientation="Horizontal">
                <Label x:Name="TitleLabel" Text="{Binding Title}" HorizontalOptions="Center" VerticalOptions="Center"/>
                <Label Text="&#xf12a;" FontFamily="{StaticResource FontAwesomeSolid}" IsVisible="{Binding IsUserCreated}" TextColor="Orange" HorizontalOptions="Center"/>
            </StackLayout>
        </Frame>
    </StackLayout>
</ContentView.Content>

Upvotes: 1

Related Questions